The first step for developing the main experience of the project was to convert the sketches I had done earlier into wireframes. This went well and only had to make some small changes due to the length of certain bits of content.




The first set of screens I worked on was the Take Off section. I basically treated this like designing one long/wide poster. I had initially thought of having to move through each screen by buttons rather than scroll, but the way I was designing lent itself to self controlled scrolling with buttons between sections. Once I had the main content in place, I began layering up the background, using relevant type and shapes as forms to give depth to the screen.

I was really pleased with the final design for this section and felt it was very engaging. The animated parts worked really well and were subtle enough to not distract from the main content. I really liked the forms being used in the background, and the setting of the quote.

As this was the first screen, I wanted to bring the content in in a more interesting way. To do this I split the lines up across multiple screens and used smart animate, to give the illusion of them drawing in.

This first section went really well, but had made a problem arise with my art direction.