Goal: Building an app that will allow users to chat with a close circle of friends as well as professionals to support their mental health and emotional intelligence.
Restrictions and needs:
- A conversational tool that allows user to talk to their circle of trust, circle of professionals as well as AI.
- Professional profiles and contact
- A resource section
- A way to alert a safe contact when in distress
Process Summary: After identifying the needs of the app with the co-founders, I went ahead and created low-res wireframes. We've iterated on those gradually before jumping to high fidelity screens. Having done the branding for Eimhe, I was familiar with the colors and the direction of the brand. I adjusted the colors slightly to give a calm look and feel to the app.
Team: 1 UI Designer and 2 co-founders
My role: UI Design & Branding
The challenge: Competing priorities was the challenge here. The founders had a big vision for their app. We've addressed that by balancing business goals with the go-to-market audience needs.
As brand evolves and adapt, it was decided to soften the colors of Eimhe's branding for the app. Contrarily to the marketing needs of the website and other advertisement collaterals, we wanted to app to feel like a serene and safe environment. Hence we we created a corresponding set of colors exclusively for the app.
After outlining a map of the sections needed in the app, we've done a series of low res wireframes. It was decided to have the 5 main sections available from the bottom menu. The rest of the settings, or pages that would not need a daily use, have been placed in a hamburger menu available at the top right.
Shown here is the homepage, where the user lands on the chat. The user's circle of trust composed of 5 people is readily available. Also conveniently placed is the circle of champions, on the second tab. The visual choice of bubble here was made knowing that the number of people wouldn't increase over time. The second screen shows the resources available to the user. They can pick between reading, watching, listening or training. As they scroll, the bottom menu collapses to leave more real estate.
One must have was a 'panic' button for users going through a hard time. Although this button needed to be easy to use, we didn't want to make it too easy to prevent accidents. Therefore, we made it a 'swipe' and we've placed it in the top right menu. One note: As the user gets onboarded, a tour is available for the user to learn where this button is. The second screen shows the ability to browse experts. Each of them can be found under one of the 5 categories.