We’re getting into the nitty-gritty now. We were tasked with transferring our paper sketches onto the screen, so I created a digital mock-up of the toast interactive in Illustrator.
The first step was to create wire frames. The wire frames serve as a composition base for the main content, like the color and style.
Once the wire frames were set in place I created the content on top. Then user interface. Then UI feedback, the buttons and links are made a tiny bit lighter to indicate something was pressed. Lastly the gestures, showing where each interactive point is.
Here’s the page in all its glory: