Mission to Mars

Web / Responsive / Illustration

Miss to Mars


Mission to Mars is an interactive website that I designed to explain what humans requirements are needed in order to successfully journey to Mars for exploration. I created the site as a visual narrative of what astronauts will need as they journey towards the Red Planet, beginning with lift off.

web wireframe

Target Audience

The demographic that my website mainly caters towards are the children who visit the Aerospace Museum on a field trip or with their family. If they want to know more about Mars and astronaut requirements, they can use their phones or tablets and scan the QR code at the exhibit, which would lead to this website. My website is especially relevant if students plan to do a school report about Mars or astronauts.

Communication Strategy

The layout is essentially one vertical scrolling page, utilizing anchor points that a user can click in a fixed navigation bar. As a simulation of a real shuttle launch, the bottom of the website begins the journey, ending at the top-most section which contains info on what happens after astronauts land on Mars. In order to appeal to the elementary school demographic, colorful illustrations depicted the essentials of space travel towards Mars.

With jQuery smooth scrolling plugins, I was able to incorporate an interactive navigation bar that users can simply click on to follow the journey in order. Using multiple CSS3 style sheets that target media query devices, the website attains responsiveness and content is adjusted for optimal viewing on desktop, tablet, and phone.

Mission to Mars Mockups
View the live site here.

Mission to Mars was chosen to be featured as an online web exhibit at the Aerospace Museum of California.


Adobe Illustrator, Adobe Photoshop, Brackets code editor, thinking like a kid again