UX, UI, MOBILE

Moment 5

Moment 5 is a mobile wellness app that focuses on promoting physical and mental wellbeing with flexible 5-minute exercises. People are often busy and backlogged with responsibilities, sometimes a spark is all that is needed to get through the day.

DESIGN PROCESS

• Empathize - User Research, User Interviews


• Conceptualize - Personas, Sketching, IA, Wireframing


• Design - Usability Testing, Prototyping, Style Guide

A Short Break Goes a Long Way

CONTEXT

Working remotely for an extended time prompted a decline in health and mental state. Between Q1 and Q2 of 2020, fitness app downloads increased by 46% worldwide. The top grossing fitness apps were Calm and myfitnesspal with an average of $7 million dollars/month in Q2.

There are an abundant amount of tools with single purpose offerings that are overwhelming, demanding a significant amount of time from users to invest in.

Looking at Perfect Properties app on phone

Supporting User Insights

RESEARCH

My initial research revealed some key information to get started, and assist users on their simple wellness journey. Of the response received, 43% of users spend less than 10 minutes using a health tool, and 50% of users spend less than 5 minutes. For health purposes, people like to keep it short and sweet. Since we can't measure things by feel too well, 43% of users thought that using a mood or wellness indicator would be best to measure results.

User persona 1
User persona 2

Iterative Designing

VALUE PROPOSITION

While designing mid-fidelity frames from my initial sketches, I was looking to see what users thought about the process for each task:

  1. Sign up as a new user
  2. Complete a workout
  3. Reflect on the day

Conducting usability testing revealed a few medium-high severity concerns that were crucial to address before moving on.

Behind the Scenes

KNOWLEDGE IS POWER

"Wouldn't it be great", we discussed, "to contribute to our well-being consistently without spending too much time?"

Screen showing comparison
Screen showing tablet view of property details

Road to Success

GET IN TOUCH

Although being one of the most time consuming steps in the design process, I enjoyed this one the most because it allowed me to see the progress made based on what people actually wanted, not just me. I conducted a few quick A/B testing iterations to determine what was more appropriate, then applied visual design and Gestalt principles to create organized screens. An important step before kicking it high-fidelity was to collaborate with other experienced designers to see if anything was missed.

Screens showing how to contact and schedule viewing

Take a Break

Design system image

Take a Breather

POST DESIGN

Reach out and schedule a viewing

I debated whether a typical messaging option would be a better call, but then opted out. Perfect Properties' focus is not in its ability to chat, but to get in touch with the right people to conduct more valuable discussions outside. To help users with that, the contact screen consists of a short form to fill, while the scheduling screen contains available options based on the expert. Different ways to get in touch is rapidly growing, so it's worth keeping an open mind on additional options to add (i.e. using third party meeting tools).

UX, UI, MOBILE

Moment 5

Moment 5 is a mobile wellness app that focuses on promoting physical and mental wellbeing with flexible 5-minute exercises. People are often busy and backlogged with responsibilities, sometimes a spark is all that is needed to get through the day.

DESIGN PROCESS

• Empathize - User Research, User Interviews


• Conceptualize - Personas, Sketching, IA, Wireframing


• Design - Usability Testing, Prototyping, Style Guide

A Short Break Goes a Long Way

CONTEXT

Working remotely for an extended time prompted a decline in health and mental state. Between Q1 and Q2 of 2020, fitness app downloads increased by 46% worldwide. The top grossing fitness apps were Calm and myfitnesspal with an average of $7 million dollars/month in Q2.

There are an abundant amount of tools with single purpose offerings that are overwhelming, demanding a significant amount of time from users to invest in.

Gym equipment next to Moment 5 on a phone

Supporting User Insights

SURVEY DATA

My initial research revealed some key information to get started, and assist users on their simple wellness journey. Of the response received, 43% of users spend less than 10 minutes using a health tool, and 50% of users spend less than 5 minutes. For health purposes, people like to keep it short and sweet. Since we can't measure things by feel too well, 43% of users thought that using a mood or wellness indicator would be best to measure results.

"Wouldn't it be great", we discussed, "to contribute to our well-being consistently without spending too much time?"

Putting it Together

ITERATIVE DESIGN

I used Card Sorting with my test users to determine the appropriate navigation to best go through the main tasks. I was able to create mid-fidelity sketches which then went through usability testing. Doing so revealed a few medium-high severity concerns that were crucial to address before moving on.

Information architecture graph
Sticky notes from usability testing

Road to Success

VISUAL CHOICES

I conducted A/B testing iterations to determine what was more appropriate, then applied visual design and Gestalt principles to create organized screens. An important step before kicking it high-fidelity was to collaborate with other experienced designers to see if anything was missed. The design was shifted from an overextended process with far too many quantitative data - to a shortened design that tracks progress.

Progress from low to high fidelity

Take a Break

HITTING RESET

A key feature of Moment 5 is based on the evidence provided by users - who do not spend more than 10 minutes in a day to take care of their well-being. The design chosen provides versatile options separated by Move or Rest exercises, to increase engagement. To back up a user's selection, steps are listed followed by 5 minute guided instructions.

Screen to show assortment of exercises
Screen of workout 1
Screen of workout 2

Take Control

CHECKING IN

Tracking progress is one of the most effective ways to determine how far away a goal is. Users thought using mood tracking would benefit this the most, so a reflection step was added post exercise. The results taken would be shown visually in the home screen, with options to further slice and dice goal-related information.

Screen of graph
Screen of calendar
Screen of reflection questionnaire

Outcomes and Takeaways

POST DESIGN
83%
of users were generally satisfied and considered using Moment 5 for their daily well-being
Highlights included working with participants during usability testing to determine the best possible solution. It was exciting to see users pointed out severity errors that I haven't thought of, which showed me the importance of user feedback.
10
months spent part-time to build this project from end-to-end
I had fun working on a project focusing on wellness, as it allowed me to dive into a user's personal goals. This made me reflect on the tools I use, and how they were designed. Future considerations would involve responsive design, and enhancing accessibility.
UX, UI, MOBILE

Moment 5

Moment 5 is a mobile wellness app that focuses on promoting physical and mental wellbeing with flexible 5-minute exercises. People are often busy and backlogged with responsibilities, sometimes a spark is all that is needed to get through the day.

DESIGN PROCESS
🤔 WHAT I LEARNED

• Empathize - User Research, User Interviews


• Conceptualize - Personas, Sketching, IA, Wireframing


• Design - Usability Testing, Prototyping, Style Guide

  • Working with an existing blueprint while embracing the brand
  • Pause after reaching goals, a redesign can be continuous
  • Reverse engineering how a webpage was built and determining design systems in place

A Short Break Goes a Long Way

CONTEXT

Working remotely for an extended time prompted a decline in health and mental state. Between Q1 and Q2 of 2020, fitness app downloads increased by 46% worldwide. The top grossing fitness apps were Calm and myfitnesspal with an average of $7 million dollars/month in Q2.

There are an abundant amount of tools with single purpose offerings that are overwhelming, demanding a significant amount of time from users to invest in.

Supporting User Insights

CUSTOMER EXPERIENCE

My initial research revealed some key information to get started, and assist users on their simple wellness journey. Of the response received, 43% of users spend less than 10 minutes using a health tool, and 50% of users spend less than 5 minutes. For health purposes, people like to keep it short and sweet. Since we can't measure things by feel too well, 43% of users thought that using a mood or wellness indicator would be best to measure results.

Screen of redesigned top
Screen of redesigned middle
Screen of redesigned customize menu

Outcomes and Takeaways

POST DESIGN
21%
reduction in desktop size by adding a column and optimizing space
With the expansion of an extra column, users can see more options at a glance without being overwhelmed with the consistent layout.
Less
time spent browsing, more time back to your family and friends
This was a passion project fuelled by my constant appetite for pizza. It was a fun challenge to redesign without drastically changing an existing product. Future considerations would include sort/filter options and a modern design based on trends.
UX, UI, MOBILE

Moment 5

Moment 5 is a mobile wellness app that focuses on promoting physical and mental wellbeing with flexible 5-minute exercises. People are often busy and backlogged with responsibilities, sometimes a spark is all that is needed to get through the day.

DESIGN PROCESS
🤔 WHAT I LEARNED

• Empathize - User Research, User Interviews


• Conceptualize - Personas, Sketching, IA, Wireframing


• Design - Usability Testing, Prototyping, Style Guide

  • How to collaborate with other Senior Designers, and utilize the design systems built
  • Managing time while working with limited public sector resources
  • Utilizing jobs-to-be-done as the main method of research

A Short Break Goes a Long Way

CONTEXT

Working remotely for an extended time prompted a decline in health and mental state. Between Q1 and Q2 of 2020, fitness app downloads increased by 46% worldwide. The top grossing fitness apps were Calm and myfitnesspal with an average of $7 million dollars/month in Q2.

There are an abundant amount of tools with single purpose offerings that are overwhelming, demanding a significant amount of time from users to invest in.

Jobs To Be Done

USER RESEARCH

Due to the volatile nature of public sector limitations, fundings and timelines could change based on policies that align with provincial/federal directions. To account for this insight, a jobs-to-be-done framework was utilized to access valuable knowledge from employees versed in existing tools. The approach involved conducting user interviews, with the intention to learn how the tool was used, what did the tool do well and what could be improved? This process was repeated for multiple “super-users”, and the information was consolidated to begin formulating feasible solutions.

Team working in office

Key Focus

IDEATION

We synthesized the information gathered from interviewing super-users, and brainstormed ideas that would fit the bill of user needs. Ideas were iterated and discussed with various stakeholders including the Business Analysts and Developers to ensure we were all aligned. A plan of action was drafted, and the main components to keep in mind while designing were:


  • Transitioning from desktop ERP to web-based solution for desktop
  • Reduce levels of change management by keeping the new design familiar
  • Increase ease of use and accessibility for users
Balsamiq mockup of Tax Credits

Transformed Experience

CURRENT STATE

The project was part of a broader digital transformation initiative, to modernize the experience and better equip internal teams. With that in mind, my task was to create simple and intuitive wireframes that would transform existing pages and incorporate a new design for wizards. Current friction stemmed from difficulty navigating through layered tabs, populating and viewing fields, and unstandardized design that were built for pure functionality.

Old pension client

Taxes

IMPROVED
NAVIGATION

Implemented fixed headers and left aligned navigation bar for consistency. Maintained the separate tax tabs (Tax Credits/Tax Slips) while emphasizing hierarchy. I leveraged my experience as an Engineer working in data, to craft an accessible way to view data in tables.

New Tax Credit
Provincial Tax Modal
NR4 Modal

Group Benefits

BETTER 
ORGANIZATION

The original client had 3 tabs to split content similar to Tax Credits/Tax Slips, however a business decision was made to to view all content in one page. A show/hide drawer was implemented for users to easily glance at necessary information without having to navigate elsewhere.

Group Benefits Expanded
Group Benefits Collapsed

Wizards

EFFECTIVE
SPACING

Previous Wizard processes were inconsistent in terms of screen sizing, spacing, and overall layout. The focus for new designs were to maintain a cohesive and effective process, and not confuse users. We utilized the abundant spacing of a web-based solution to create a new standard.

New Member Wizard

Project Results

POST DESIGN
95%
user satisfaction
Internal system users were very satisfied with the new designs, and were slightly more engaged with tasks.
Less
navigational errors
A qualitative survey was sent out to determine if users could navigate through the web-based solution better than the old client
1
Pension Digital Transformation

Redesigning an existing pension management client to a web-based solution in a collaborative tight-knit team. I leverage my Engineering experience designing data visualizations to craft accessible navigation, tables, and processes.

UX, UI, WEB
4
Perfect Properties

Perfect Properties is a web app designed to help users make informed purchases on real estate, to achieve financial security. This means lower risk and increased peace of mind for one of the biggest decisions ever.

UX, UI, WEB
3
Pizza Garden

Pizza Garden is a popular franchise that specializes in pizza cooked in a stone oven located in the Vancouver area. The redesign focuses on the primary menu page.

UI, WEB, BRANDING