Mayday: UX UI Case Study
Designing Mayday’s Web Experience
Mayday is a fictional online resource that helps educate youth in British Columbia on natural disasters, and how to prepare for them. The main objective is to communicate the harsh realities we could face when we get hit with unpredictable disasters. Click Here for the finished Prototype
Background
Natural disasters are unpredictable, and not many people in Canada
are aware of what to do before, during, and after an emergency
suddenly happens. We watch and read the news on things happening
around the world, which is when we realize that could be our reality.
Youth have the power to move adults, as we have seen with the recent
climate action strikes around the world. The inevitable “Big One” has
been predicted to happen soon, and Mayday is the online resource
that speaks to youth on how to prepare for the unexpected.
Research
The primary demographics for Mayday are teenagers ages 12–19, who are oblivious of the seriousness of when a natural disaster hits. Youth have the power to move adults, and Mayday believes by educating teens, they can share the knowledge to their family and friends.
Although teenagers’ lives are heavily integrated with technology, they are known to have several flaws, mentioned in this Research on Teenager’s UX such as lack of patience and insufficient reading skills.
UX Strategy
To design a website that strategically focuses on the user interaction and engagement as a step towards building an online resource that can maintain the teenage attention span while educating them about natural disasters in British Columbia.
Style
The mood board reflects the current teenagers’ preferences — minimal, sleek, and trendy. Teenagers prefer neutral looking graphics over childlike ones, as they reach for age-appropriate content.
Creative Solution
“Mayday” is an international radio distress signal used in voice-procedure radio communications, signalling a life-threatening emergency; the morse code equivalent being “SOS”. The logo was built from the morse code symbols of “SOS”, to create an asterisk (*) which is primarily used to draw attention to some words.
When the website is first loaded, the landing page prepares and warns users that a quiz is about to start in 4 seconds. By doing so, the users are prompted to complete the quiz right away.
The website uses minimal text, and an ample amount of photography to keep the users engaged. Important terminology is highlighted in red, to compensate for the insufficient reading skills of teenagers.
Link to the Prototype
Future Considerations
We hope to expand and create the mobile optimized site, along with finishing the remaining pages of the desktop site.
Another feature would be to animate some components of the website, such as the static textured background and the quiz questions, to add more storytelling and character to the brand.
Thank you for reading!
Project duration: 4 weeks
Photo: Unsplash
