For this project, I chose to focus on making a lot of effects on my website I had to separate the images I wanted to use. I did that by using Photoshop.
I have used Photoshop regularly for 10 years so it wasn’t a learning point for me at all, but I still felt like it would be noteworthy because it was a bigger part of this project, not only because of the animations and the interactive elements. But also since it was the main part of the content that would be used for storytelling in this project.
Example timeline of each piece of image that was involved that I photoshopped and edited for the project:
Here is the original image I wanted for a section in the project, I wanted just as pictured that the rocket would come apart and tell about the pieces.
I began by removing the background and separating the pieces. I did however stumble upon the problem that some pieces were covered by the other pieces in the image. I fixed that problem by repairing the part with the help of the editing tools in the software. I, later on, pulled all the pieces apart on different layers so that I could individually export them to later piece them together in the prototype and the website.
Examples of before and after:
Original image
Bottom part of rocket
Top part of rocket