Flight Life Science Library Modern Revamp
Website Layout
Below is what I would like the layout of the website to be in a scrolling format. The still that is pictured at the top is actually an animated sequence going through the different instruments in an aircraft's cockpit. Underneath that is two different connected infographics depicting different aspects of an airplane's flight techniques.
Animation
This next section shows that animated sequence that would be placed at the top of the website, showing the cockpit and relating text. Ideally, I would prefer the animation to play as a gif, so there would be a continuous loop through the cycles.
Statement
While beginning my design process here, I knew for a fact that I wanted to stay very true to the printed book with just some slight modifications to create a system of better understanding and design. Because of this, I kept the same colors that were used in the original system, and I didn’t stray too far from the original graphics. With that being said, however, I did alter the infographics, especially my two explaining landing techniques and flight patterns, in order to clarify what was being displayed. The graphics showcasing these two particular happenings in the book were a bit hard to understand. To make this easier on viewers, I condensed the flight patterns infographic into one picture. I thought it would be easier to see what was going on if it was all demonstrated on one plane; also, I left out a lot of the unnecessary information on the landing techniques infographic. In the book, there was an abundance of lines and colors that I thought were distracting. Lastly, in regards to my animated graphic that I threw in, I also recreated this graphic to hold all of the information in one place. In the book, this information was spread across about eight pages. I thought that having the descriptions and the illustration of the cockpit in one easy to decipher system would make the viewing experience more worthwhile. To explain why I chose this graphic to animate, I thought that it would be best not to overwhelm the viewer with all the information at once, since it is quite a bit to take in. I thought that the use of opacity and scale would really elevate the experience and draw the viewer’s concentration throughout the system as needed. Aside from what I actually did in my designs, I wanted to mention why I picked the infographics and paragraph that I did. When I first received the book, I was instantly drawn into the comparison between birds and planes; however, once really digging in, I was less so intrigued by that and more so by the mechanics behind the airplanes. Because of this, I didn’t want to go with the easier option of my first interest, I wanted to try and find a way to simplify the harder to understand concepts such as the flight patterns and landing techniques. This is also where my animation comes in. As I said before, the information was really difficult to digest right off the bat, so I thought it would be a great challenge to try and make it legible for the average person -- with no prior knowledge of the working of a cockpit. Overall, my main goal was to simplify and modernize, but only to the point of improvement. I didn’t want to completely neglect the workings of the printed material.
Process and Sketches
My sketch process and ideation is displayed down below. I went through a few trials before I settled on the icons and infographics that I wanted to further explore. Also, I changed my mind on the paragraph that I initially wanted to focus on. The color palette is pulled almost completely from the existing book, with some refinements to make the colors better compliment each other.
This was a few steps further along in the process -- and actually what I had during my pin up installation. Since then, I've cut down on a lot of the text in the animation paragraph to make it easier to digest, and I've included more in relation to the diagrams, in order to provide some background information. I also played around with the titles, hierarchy, and icons in order to make things flow a bit better.
