Web Design Case Study: Designing and Building A Website for East 2 West Aero
A two-week web design sprint to build a product website for the American Albatross, an experimental jet manufactured by East 2 West Aero, by Ry Keel.
Skills: Web design, Information Architecture, Graphic Design
Tools: Figma, Photoshop
Overview
East 2 West Aero manufactures experimental jets. In other words, they build personal jets for folks who enjoy going for a fly on the weekend but want to do it in style. Their jet airframes are built from the L-39 Albatross, a Czechoslovakian fighter jet that was produced from the 60s until the mid-90s. East 2 West guts the fighter jets, stripping them of old, heavy equipment, (including the weapons…) installs an American-made jet engine and modern equipment, tech, and comforts to come out with an entirely new beast: The American Albatross.
The Challenge
East 2 West needed a way for their potential customers to see the jets they’d sold, what they looked like, technical spec, and how they performed. They wanted the website to be clean and simple but also offer the appropriate information that their customers might want. They also hoped to have the website up and running in two-three weeks.
The Process
01 Client Meeting
I set up a meeting over Zoom to go over the specifics. I needed to know what East 2 West envisioned the website to be, talk about what pages they wanted to the website to have, and the imagery their customers would view. We decided that the four main topics that the site would cover were…
Performance
Safety
Reliability
Modern Standards
Those would be the building blocks of the home page and everything else would grow from there. East 2 West also wanted a prominent Contact Us button on the home page, photos of their jets, and the ability for customers to click a “learn more” button under Performace, Safety, Reliability, and Modern Standards to redirect to a supplementary page.
02 Low-Fidelity Wireframing
I drew up a few potential options for the home page layout, keeping their asks in mind. East 2 West pointed out what features they wanted to move forward with, and from there I began working on mid-fidelity iterations.
03 Mid-Fidelity Wireframing
They were happy with the home page-s mid-fidelity design and asked me to move forward into building the rest of the site based on this design. They asked that the Call to Action button on the headline photo direct the user to a video of one of their jets in-action. Each of the four Header 2 titles would correspond to Performance, Safety, Reliability, and Modern Standards, and the user can click the button beneath each to go to a page with more in-depth information about those topics. Lastly, two Contact Us buttons at the top and bottom allowed users to quickly and easily get in touch with East 2 West.
04 Photoshopping Visual Elements
I wanted a striking headline image to draw the user’s attention when first landing (ha!) on the site. East 2 West sent me a wide array of photos of their jets, so I got to work using Photoshop to create something special.
I took an image of one of their jets, removed it from the background, removed the pilot, and changed the glare on the cockpit windows to reflect the blue color from the background. This headline image was designed to highlight the jet’s features while the (sky) blue background evokes feelings of safety, security, and freedom.
05 High-Fidelity Designs
06 Information Architecture
As the site evolved, it became necessary for me to re-think the information architecture, so I grouped the four main concepts pages into the Overview tab on the navigation menu, and pages such as Specifications, How it’s Built, See it in Action, and Photos into the Details tab.
07 Logo Design
East 2 West wanted their customers to know that the American Albatross isn’t just an upgraded L-39 fighter jet; it’s a different, unique jet with a unique flying experience and feature set. They felt that the American Albatross deserved its own logo, so I set to work on designing a couple of options as well as a design for the website’s favicon.
I began by researching other private jet brands such as Cessna, Boeing, and Bell.
The logo trend for these companies was simplicity, with the company’s name spelled out (for the most part) and perhaps a single symbol to complement the design. East 2 West wanted to incorporate an American flag into the American Albatross design.
Retrospectives
What Went Well
By the end of the two-week sprint, the East 2 West team was very happy with their website design. It became more than they originally expected it would be, with complex navigation and twelve total pages. I’m happy with the site’s information architecture and backed it up with some simple, low-budget testing to make sure everything was in places that made sense to the users. Most important, I think the site will help East 2 West sell more jets, and that’s the most important factor. The jets will basically sell themselves if customers are able to easily and efficiently see them and learn about them on the East 2 West Aero website.
What I Would Have Done Differently
My initial video meeting with East 2 West was only around 30 minutes long. Although it was short and sweet, I should have scheduled more time to ask more questions and get a better read on exactly what they wanted from the beginning. They answered my questions clearly, but if I had been more thorough, I could have avoided over-communicating while I was building the site since it turned out that they wanted the website to contain more pages than originally planned.