SUMMARY: For my fourth project in Multi-Platform Design, I created a series of animated 404 error pages using Adobe Express. We wanted our pages to be funny, clever, and engaging in order to keep viewers on our site. We started by researching other fun 404 error pages. Then we began to ideate with lots of brainstorming exercises. I created sketches based on my favorite ideas and then began to build my pages in Adobe Express. 

GOALS: My main goal for this project was to learn more about Adobe Express. I have only used the program once before to experiment with web page design. I wanted to learn how to create animations and text effects. Adobe Express has a lot of cool features that I didn’t know about, so it was fun to experiment with the program! Another goal I had was to make my 404 pages clever and engaging. I wanted the users to enjoy the design and stay on the page.

DESIGN PROCESS:

IDEATION EXERCISES: We did a few ideation exercises to help us brainstorm. My favorite was working with stickies! I jotted down each idea I had on a sticky note and stuck it to the table. This helped me get all of my ideas out on paper. We also did speed sketches, which were helpful. After I picked my best ideas, I had a minute to sketch them and to show how I imagined the animations would work. 

FINAL DESIGN: I took my best ideas from the ideation exercises and turned them into my final designs. The first idea was a disco ball/dance theme! I wanted to have a disco ball that spun with flashing lights and music. The second idea was a travel theme. I wanted to have a plane window that opened to a beautiful view that was animated. I ended up scratching this idea because I couldn’t find the elements to work with. The last idea was a St. Patrick’s Day theme. The fours are made out of four leaf clovers. The zero is made out of a gold coin. I wanted a rainbow to pop up in the background along with the text.

ADOBE EXPRESS BUILD: For this project, I challenged myself to only use the features of Adobe Express. On each 404 page, I used the animation features. There were several animations to choose from, so I made multiple elements move with animations. I also used the AI text effects for some of my text. In the picture above, I used the text prompt “pink neon” to create the neon sign look I was going for. I also used stock videos on my pages. I changed the blending mode to screen, so there was a transparent background. This added more movement to my pages.

KNOWLEDGE GAINED: In this project, I learned how to use a new program, Adobe Express. Adobe Express is a great program to use when I need to create something quickly. I was very impressed with all of the AI features in this program. I learned how to use the features to generate images or videos. I also learned how to create text effects using the AI features. I will be using this program for more projects in the future!