top of page
hero-bg.jpg

NASA JPL X Adobe Xd

Native tablet app for teaching children about space exploration

UX Case Study

Responsibilities
UX Research
UX Design
UI Design
UX Deliverables
User Flows
Sitemap
Wireframes
Interactive Prototype
Solution
Native tablet app
Duration
2 weeks part-time
Team Project
Working in a team with another UX designer Reuben Valpy-White

The Challenge

Create an interactive prototype using Adobe XD for a tablet app inspired by NASA JPL for children aged 11 - 13 to learn about NASA's space exploration missions.

The Process

Through understanding the needs, motivations and pain points of our target audience we planned each stage of the user flow based on this information to help guide a user experience design that would be enjoyable, usable and useful. User stories and user flows helped inform our designs during wireframing and prototyping.

Adobe_XD.png
jpl-logo.png

The result

Together we created an engaging and fun way for children aged 11 - 13 to learn about NASA JPL missions through the use of quizzes, games, interactive elements, audio aids, appropriate UX writing to create an immersive experience.

Working as a team

My role was to design the moon mission area of the app, with the lessons and the quiz. I was also responsible for designing the UX and UI of the pin ball style game.

​

Together we designed the information architecture, the user flows and the interaction design.

​

We worked remotely and collaborated via Zoom and Slack.

Reuben's role was to design the Mars mission area of the app,  with the lessons and the quiz. He also was in charge of pitching our project.

Market Research

I undertook high-level rapid market research to determine any useful information in regards to education and instructional design for children. I looked at BBC Bitesize for inspiration and guidance on lengths of lessons, language and jargon used, visual design etc. Although it isn't an app it is a website that is commonly used across the UK by children who learn at home and in school about multiple subject areas, including science. It has a good reputation for being objective, safe, appropriate and accurate in providing children's education.

​

Key Findings:

• Pagination used to keep page lengths short and avoid cognitive overload

• Use of images to break up the text

• Quizzes to test that information has been learned

Gamification

We did some research on learning through playing games and and chose to use gamification in our app to assist with learning. We believed that it would give users a break from learning new challenging information in the lessons and would give them a positive association to returning to the app. We chose to base our game on the classic arcade Pinball machine as it is a simple concept to understand, with little rules. The game begins with a brief tutorial for first-time users but this information can be accessed again at any time.

​

'The human predisposition to play games is associated with their motivations for action. In gamification, both motivational options are evident in different forms. Yildirim [35] conducted a study with 97 participants (49 in the experimental group and 48 the control group) and found that gamification-based teaching practices have a positive impact on students’ performance, attitudes, and motivation.'

'One explanation for why games offer a captivating and immersive experience is the flow theory [36]. Flow is assumed to imply “a state of mind characterized by focused and heightened concentration and enjoyment of intrinsically interesting activities."'

Cirit Mateus De Oro, Daladier Jabba Molinares, Ana María Erazo Coronado and Rodrigo M. Campis Carrillo (December 29th 2021). From Gamification to Serious Games: Reinventing Learning Processes [Online First], IntechOpen, DOI: 10.5772/intechopen.101324. Available from: https://www.intechopen.com/online-first/79849

screencapture-bbc-co-uk-bitesize-guides-z8wx6sg-revision-1-2022-01-07-18_09_45-min.jpg

Information Architecture & Sitemap Creation

We agreed that the navigation in the app must be extremely simple without hiding options, but not showing too many. The assumption we followed was that returning to home to move to other areas of the app would be the simplest way for our target audience. We didn't want to over complicate or confuse users, as they would likely find this frustrating and stop using the app altogether.

Frame 100.jpg
Frame 101.jpg

User Flow

Together we chose to begin with a lesson so that users could read and learn about a particular NASA space mission. This information would then be solidified and tested via a quiz. Following this we wanted the user to have a choice on what they wish to do next so they didn't feel forced to do a certain activity.

Wireframing

Our process of ideation was rapid and sketches were drawn to get our initial ideas down. We chose 1 idea to build on which we felt was the most appropriate for 11 - 13 year olds. 

After hand sketches we took our idea and created mid-fi wireframes in Adobe Xd. These then increased in fidelity once we were happy with the screen content and the user flow from screen to screen.

The last piece of the puzzle was designing the gestures and interactions in order to move from screen to screen. We wanted to keep interactions fairly simple with common gestures that were likely to be understood by children. We included progressive onboarding tips for the users where necessary to make it clear how to interact with the UI.

IMG_4141-min.JPG
Frame 1.jpg
ipad-3.jpg

Accessibility

Cognitive load

Our thought process behind creating a game, was to provide a respite from all the learning from the lessons and quizzes and to pause the cognitive load. We felt it important to create a quiz with a careful balance of being challenging but achievable.

Visual Design

A high contrast colour palette and large font size was used to make reading easier and to avoid large 'walls' of text which may feel intimidating to our target audience. We wanted to create an immersive and fun experience so decided to create the visual perspective that the user is on the planet; a first-person perspective.

ipad-1.jpg

Pagination

We included pagination to indicate to the user how far along in a lesson they are to avoid users dropping out of the user flow by being sure that lessons were not long and manageable to complete.

Audio aids

Our use of auditory aids was designed to help those with sight impairment and for those who learn best by listening. We chose a friendly but professional sounding voice to create the feeling of a kind expert teaching the user directly, thus making them feel comfortable and engaged in the activity.

ipad-4.jpg
bg-2.jpg

Conclusion

At every stage of the project our target user was considered in order to ensure our final product was effective for their needs. This included the UI design, the interactions and gestures, the format of the learning experience, the simple information architecture, the helpful auditory aids, the use of appropriate content etc.

​

The limitations of designing for children and the difficulty in having access to them to get user testing feedback was challenging and it is something we would like to do in the future to validate our design decisions and our hypothesis.

​

The sprint style of the project was challenging as decisions had to be made rapidly and iterated on numerous times.

​

If we were to continue with the project it might be sensible to introduce a maximum limit on the number of times the space mission game can be played, to ensure that the game play is interjected with the learning elements of the app. 

Other case studies

UX DESIGN
Unsoliticed redesign of Nationwide banking website
nationwide-project-cover-image.jpg
END TO END UX DESIGN
Designing a physiotherapy responsive web app
Screenshot 2021-09-29 at 11.08.56.png
bottom of page