Dog Morning
Dog Morning is a webstory I created as a university project using Figma, Adobe Illustrator and After Effects.
Task
In university I was given the task of creating a webstory in regards to the subject: daily routine.
Idea
In this playful project, a dog’s morning is followed from its’ perspective. Animated illustrations show different scenaries of the dogs’ morning. The entirety will be illustrated using white, black and red.The user interaction consists of clicking clearly marked red elements to move to the next page, or animation. After each animation, infographics are embedded in the web page, showing facts about dogs in accordance to the situation. To demonstrate this idea I sketched a rough animation of two possible scenes.
Research
I first created a mind map of possible topics of a dog’s morning to pick up. Following this, my research consisted of finding facts, statistics, infographics and articles of said topics and general information on dogs.
Functionality
With this information I created a storyline with an arc of tension for the morning as well as a functional description. It starts off by the protagonist, the dog, waking up, getting his leash and going on a walk. The peak of tension being the dangerous street. The dog’s morning ends by having breakfast and napping next to its’ owner.
Design
I created rough sketches for each scene as well as a rough storyboard. As for the information, I designed fitting infographics. For all of this I used clip studio paint. I kept with a cartoon, comic style and the three colors priorly stated, red, white and black. The final scenes I created using Adobe Illustrator and the animations I made using Adobe After Effects.
Prototype
I finalized the prototype within Figma and filmed a working clickthrough of the webstory.