top of page
SCROLLYTELLING

Layouts

Featured story

Utilizing astonishing photography to catch the viewer's attention, guiding them to the most relevent event

Essential news

Latest updates, news stories and live coverages easy available with aother search bar.

Interactive scrolling

Engagement beyond the news bulletin. Zooming out of our home planet to reveal...

..our galactic neighbourhood..

..and providing useful information about the celestial bodies and missions planned.

Wireframe

Want some space?

Reimagining NASA's website for more immersive user engagement

OVERVIEW

Background

National Aeronautics and Space Administration's primary portal - nasa.gov's purpose is to share information and inspiration with the public. But the website's experience is unintuitive and overwhelming.

As the sole contributor in this school project, I redesigned the website's interface with the aim of creating a more immersive and engaging experience that could better achieve its purpose. 

Duration

My Role

UI Design

5 weeks

WHY DOES IT NEED A REDESIGN?

Visit nasa.gov

 

The website's objective is to share information and inspiration with the public via an engaging news site.

Lack of hierarchy, cluttered and confusing navigation, inconsistant page layouts.

Form balanced with function, modern, focused, trustworthy and simplified with informational. 

Results in difficulties in finding information and fully appreciate NASA's groundbreaking efforts.

Intended result is to encourage engagement in immersive experiences and deeper, focused learning.

Current

Redesign

Heuristic Evaluation

Crowded navigation

Comprises two navigation bars and submenu items- both of them very busy, leading to lack of clarity of purpose and hierarchy.

Monotonous

With a lack of visual hierarchy, the page follows a rectangular grid with little variation in shapes or grouping of information to guide the readers.

Disorganized

It is hard to find relevant search results due to the tight layout i.e. their proximity and lack of cues like dates and images.

Lack of hierarchy

The page lacks proper text hierarchy and breathing space, making it overwhelming and cumbersome to read.

Underutilized banner

The top banner is too wide but doesn’t include relevant content.

Inconsistent layout

The layout, specifically white space usage is uneven, and looks awkward.

For inspiration, I looked no further than NASA's own various websites. Many of them have some breathtaking features that could be brought to the primary portal. One could spend hours zooming in and out of the real time galactic simulations and awe in the endless possibilities of deep space.

PROCESS - KICKOFF

Inspiration

Artemis Mission

H1 Clarendon

H2 Archer

Body Charter

Explorations

Which approach would be the best fit for the wide range of audiences who visit the website - American public ie taxpayers, educators, researchers, students, children and space enthusiasts worldwide?

Futuristic, exciting, modern

Trustworthy, accountable

Moodboards

Typography & Colours

Life, forever dying to be born afresh, forever young and eager, will presently stand upon this Earth as upon a footstool, and stretch out its realm amidst the stars.

HG Wells

FINAL SCREENS

Ready to lift off?

I have deep admiration for all the scientists, researchers, and engineers who dedicate their time and effort towards space exploration and advancing human progress. It's one of my life goals to visit outer space sometime, but for now working on this project has been pretty rewarding. Here are some things I would keep in mind in a future revision.

REFLECTION & NEXT STEPS

Where to, next?

The solar system section is not to scale. To improve this section on the homepage, it's important to ensure the diagram accurately represents real-life. Given that the portal focuses on science and technology, precision is key.

To-scale models

What happens when we can’t use a dark theme? What would the error, success, and warning colors look like? Usability testing should be conducted to explore various iterations, such as providing an option to toggle between different reading modes. 

Usability testing and iterations

bottom of page