Alea Health : AI-assisted virtual mental healthcare

Role

Product Designer

Company

Alea Health

Project Scope

  • Build from 0-1

  • UI/UX Design

  • Prototyping

  • Framer Development

Overview

Alea Health, a Dubai-based mental health startup, is building innovation as an AI-assisted virtual mental health clinic. They came with a bold vision: make assisted mental healthcare accessible to everyone.

When Alea reached out, they already had some early pieces: mini brand identity, rough landing page content & basic flow of the app experience with no real product design

As a product designer, my role was to take these rough fragments and transform them into a cohesive product that ready to launch

Challenge: Turning Early Fragments into a Foundation

Alea already had a few rough starting points, but not proper enough to use for product launch. My challenge was to transform these into a professional foundation

Problem

How Might We

Alea’s early brand identity was too rough to apply consistently or reflect the company’s vision

refine it into a professional brand system that feels trustworthy and warm?

AI-generated landing page draft was text-heavy, unclear, and didn’t tell what is Alea’s in nutshell

redesign it into a clear, narrative-driven landing page that builds trust and communicates value quickly?

Basic app flow was just steps on paper with no real UX design

transform it into a responsive, high-fidelity prototype that works for both clients and therapists?

Design Strategy : Process & Outcomes

To turn Alea’s rough starting points into a professional digital presence, I split my approach into three layers:

Refine the brand identity

Refine their branding by enhancing the existing color palette and logo to establish a more professional and cohesive identity.

Revamp the Landing Page

Transform their basic MVP landing page into a polished, engaging company site that showcased their mission and product effectively.

Bring the sketch to into Interactive Prototype

Starting from rough product sketches, create a high-fidelity prototype that demonstrated their platform’s potential and supported their investor pitch.

  1. Branding Refinement

  1. Brand Alignment

Alea’s team wanted Alea’s brand colors to stay close to their MVP landing page, but the identity wasnt clear & unique enough.

So my first step was to analyze what they had, then compare it with other mental health apps to see how Alea could stand out.

Through this benchmark, I noticed most apps leaned too clinical (cold, sterile) or too playful (too casual for mental health). Neither felt right. Alea needed something in between a balance of trust and comfort because the audience will be diverse in terms of age (20–50) and ethnicity.

That insight led to the brand direction I call Warm Professionalism:

Color Refinement

  1. Purple for trust

  2. Pink for warmth

  3. Orange for optimism.

Typography

Modern sans-serif with rounded edges, professional but approachable.

b. Logo Refinement

As part of defining Alea’s brand, I also refined their logo. Alea's Team had an initial sketch, but it wasn’t ready for real use. My role was to explore options that kept the essence of their idea while making it cleaner and scalable.

I developed two directions:

  • Lettermark → variations of the “A”, inspired by a stethoscope and sharper geometric forms.

  • Shape-based → refined versions of their sketch, including a polished “A” resembling a reverse stethoscope.

In the end, we chose the refined shape logo (B1), which stayed true to the sketch but elevated it into a professional, versatile mark that now works seamlessly across Alea’s landing page, app, and investor materials.

Logo explorations
Logo explorations
  1. Revamp the Landing Page:

After defining Alea’s brand identity, my next focus was the landing page , where the very first place investors, therapists, and clients would meet Alea.

Here's the process:

Evaluate

Evaluated the existing landing page and identified key issues:

  • Overly wordy content

  • No clear CTA for lead generation

  • Poor readability & visual

Drafted content structure

mapped sections into a clear narrative (hero, value prop, features, testimonials, CTA).

Explored visual options

Created a mobile-first, medium-fidelity layout to test design styles and finalized the chosen style to maintain consistency across the app and landing page.

Final Design

After alignment, refined the chosen version 1, then i continue into a responsive layout landing page that worked seamlessly across desktop and mobile.

Before vs After

  1. Build MVP Responsive Web App

Designing Alea’s app meant creating an experience for two very different audiences: clients seeking therapy and therapists providing care. They had a rough flow, but it needed to be transformed into a clear, professional product that worked in real life.

My Approach

Reviewed the initial flow to understand the core features.

  • Scoped the product into two user journeys (clients and therapists).

  • Created a prototype in Figma to show how the experience would actually feel , while later it will being develop in next phase

User

  • Find therapists tailored to individual preferences.

  • Receive daily support from an AI chat companion.

  • Connect with therapists through chat and video consultations.

  • Access personalized therapy guidance compiled by AI, based on in-app activities.

Therapist

  • Flexible therapy scheduling

  • Conduct consultations via chat or video calls.

User side

Therapist Side

Outcome

Landing Page Launch

Refined, user-friendly design

Clearly presents Alea’s mission & services

Positive feedback from pitching & showcases

Responsive Web App Live

Seamless experience for therapists & clients

Developed by Alea’s team in phases

Client Satisfaction

Praised design quality & vision alignment

Highly positive feedback on collaboration

Create a free website with Framer, the website builder loved by startups, designers and agencies.