THE PROJECT

CHALLENGE

MeMo is a new app and responsive website designed with the aim of teaching children emotional literacy.

These are critical skills in the development and attainment levels of children.

DESIGN TOOLS

Adobe XD, Adobe Photoshop, Adobe Illustrator, Mural

MY ROLE

UX designer leading the app and responsive website design from conception to delivery

THE PROCESS

UNDERSTAND

Tasked with the brief to design a digital experience to help primary school children develop their emotional literacy, I conducted interviews with MeMo’s primary target users; primary school children, their teachers and parents/care-givers teachers

Due to the ethical and practical limitations of research involving children, as much research as possible was conducted with teachers/caregivers.

DEFINE

USER PERSONAS

Following initial research, personas were created for the primary user groups; primary school children, their teachers and caregivers.

STAKEHOLDER WORKSHOP

I facilitated a three day online workshop of key stakeholders for the project. As the project originated with a very high level concept, the objectives of the workshop were problem definition, ideation and agreeing the next steps to take the project forward.

I lead the team through Design Thinking exercises in order to facilitate the co-creation of ideas to meet our Users' needs.

Day 1 - Problem Definition

Day 2 - Ideation

Day 3 - Next Steps

DESIGN

INFORMATION ARCHITECTURE

Following the stakeholder workshop, I defined the Information Architecture for the project.

IDEATION

A Crazy 8s exercise was performed for rapid ideation of ways of addressing the user's needs

LOW-FIDELITY PROTOTYPE

I created a low-fidelity prototype that connected the user flow of selecting their current feeling and accessing techniques to manage that emotion.

This was tested through usability testing and iterated to refine the design.

MOCKUPS

HIGH-FIDELITY PROTOTYPE

Following testing of the mockups, I created a high-fidelity prototype of the same user flow as the low-fidelity prototype, including design changes made after the usability study.

ACCESSIBILITY

There were specific accessibility considerations for this project. As the primary users were primary school children, the project needed to accomodate users with very low levels of literacy.

Clear labels for interactive elements for screen readers.

Added audio for key messages as not all users can read

Reduced words to minimum through iterative designs.

EVALUATE

USABILITY STUDIES & ITERATIVE DESIGNS

Designs were iterated based on insights from each round of usability studies.

For example, I combined the home and “Current Feeling” screens in order to enable users to more quickly reach the help they needed.

Additional changes were made to reduce words. The original version (not pictured) also had specific named emotions. By reducing to colour categories, we reduced the mental load on selecting the emotion/help required and aided users with limited literacy.

Back button was added

Removed the need to scroll.