OMA is a startup in its beginning stages working to helps families plan for aging loved ones with cognitive health decline. The product detects signs of memory loss and state of emotional health through the act of telling and sharing stories between family members. While providing projections to plan for the future, Oma also addresses the issues of loneliness in older adults. My work consisted of building a landing page and designing mobile screens for their native app.
My Role
Title UI/UX Designer
Duration of my work
3 months: Sept. 2021-Dec. 2021
Technology
Adobe XD / Photoshop / Illustrator / Figma
H3L Branding Agency
Provision of assets *All assets, including color, typography, icons and animation were provided by the agency
Website Creation
We wanted to answer the following questions in the landing page so users can not only be informed of all the basic information but be drawn to the value of the product.
A few initial sketches and ideas to generate potential layouts
Digital Wireframes We decided to use a one page scroll for easy navigation and allow users to follow a narrative of what, why, how and who we are. To the right is the layout we decided to go with.
Closeups
What is Oma
The WHAT section comes in the beginning as an introduction to the product. It should give the user a concise idea of what Oma can do and what makes it unique. The CTA button is located in the hero for quick access to early signup.
The two CTAs makes it easy for users to get to the signup form. Finally, the top navigation is sticky so that users can access any part of the website at any point.
Why Oma
The "Why" section explains the reasons why Oma is important with facts and tesimonials as supporting information. It starts with a brief explanation of the 3 key problems: Lonliness in seniors, lack of insight for family members and need for greater understanding and family backgrounds for service providers. This is followed by details on how the insight is gathered.
How to Use Oma
If user is interested, they can move on to the more specific question of how it is used. This section will describe in detail the key featuers that users will benefit from.
Users will be able to see that Oma can be used through three types of devices: mobile, large screens such as tablets and TVs and the home device.
The 4 gifs show how a user might navigate through each of the 4 main features of the app: setup, share, check-in and discover sections
The Science section provides further information on how OMA works behind the scenes as well as validate scientific backings behind the product.
About Us
Example of what the "About us" section will look like (Names here are fictional and these positions have not been filled yet)
Show users the faces behind the company and awards and recognitions to build trust.
How to Join Call to action elements are both at the top and bottom of the site. This is the signup form that users will be led to when they click on one of the CTA buttons in the hero.
Mobile Screens
I used assets given to us by the Graphic Design agency H3L to create the flows for mobile and tablet screens. They provided, icons, color palette, typography, one voice assistant animation and two potential UI screens.
My job was to use these assets to create the full flow for the following key sections that users will use in this product:
1. Intro & onboarding
2. Setup 3. Share 4. Check in 5. Discover
Share
Recording, sharing and saving a story
Check-In
Share how you feel by recording your thoughts or choose to play games
Discover
Find out trends, projections and discover care resources
Video
Example of share feature
Conclusion
I loved working on this project as it was my first real world freelance work and gave me a chance to dip my toes into both web and UI design. I enjoyed being given the opportunity to converse with graphic designers on design direction and learn from my manager who taught me about the importance of telling a story in a website.
Looking back at this project, I can see there are many areas that should be improved such as having a consistent design system, using color in a more optimal way and addressing heirarchy issues. I hope to learn more about UI and web design principles to provide better, and more intuitive work for the future.
.webp)
.webp)
