Website For Mind

Mosopefoluwa Afolayan

A webpage design showcasing the brand identity for the Mind charity. The design includes an "ABOUT" section with a paragraph and a stylized megaphone icon. Below are three versions of the Mind logo in different colors, followed by a "Project Description" and "Style Guide" section with text. The style guide defines the brand's typography, photography, and a color palette with hex codes in shades of blue, pink, and green.
A webpage design showcasing the brand identity for the Mind charity. The design includes an "ABOUT" section with a paragraph and a stylized megaphone icon. Below are three versions of the Mind logo in different colors, followed by a "Project Description" and "Style Guide" section with text. The style guide defines the brand's typography, photography, and a color palette with hex codes in shades of blue, pink, and green.

Project Brief: A Conversation, Not Just a Website For Mind

The brief from Mind wasn’t a list of features; it was a conversation about connection. They needed their online presence to feel less like a clinical resource and more like a safe space for every single person who might need it. I was tasked with taking their mission, to ensure no one faces a mental health problem alone and weaving it into the very fabric of their site. The clock was a four days sprint leading up to Mental Health Awareness Week in May, so every decision had to be immediate and deeply intentional.

Our North Star: Human-Centered Design

Our guiding principle was simple; Design with Empathy. We started in Figma, not with wireframes, but with user journeys that prioritized feeling. We asked ourselves; How does someone feeling vulnerable navigate this site? How can a font choice or a photograph offer a moment of calm? Every curve of the custom Mind Meridian typeface and every authentic, unposed image was chosen to de-stigmatize the conversation, not just illustrate it.

The Build: A Story in Motion

Using Framer, we brought this vision to life. We crafted a narrative experience where each scroll revealed a new layer of support. Dynamic sections didn't just present information, they told a story of resilience and community. We engineered seamless, frictionless navigation, turning a search for help into a journey of discovery. The site was built to be a beacon of hope, its design radiating the warmth and understanding that is the heart of Mind's work.

The Outcome: A Place to Land

In four days, we didn’t just launch a website; we launched a compassionate experience. We built a digital safe space that empowers individuals and strengthens a national movement. The project proved that technology, when guided by empathy, can be a powerful tool for connection and that a website can be more than just a resource, it can be a place to land. Click here to visit the Mind domain.
The Mind website homepage, featuring a light pink and blue color palette. The top section shows a banner with a diverse group of people holding up signs and smiling. Below are various sections with text and images about getting involved, finding support, and the charity's impact, including statistics and photos of people using laptops and engaging in conversations. The bottom of the page has a footer with the Mind logo and social media links.
The Mind website homepage, featuring a light pink and blue color palette. The top section shows a banner with a diverse group of people holding up signs and smiling. Below are various sections with text and images about getting involved, finding support, and the charity's impact, including statistics and photos of people using laptops and engaging in conversations. The bottom of the page has a footer with the Mind logo and social media links.
Like this project

Posted Sep 9, 2025

Designed a human-centered website for Mind, enhancing connection and empathy. Very fast turnaround time.

Likes

0

Views

0

Timeline

May 3, 2023 - May 7, 2023

Clients

MIND

A Digital Heartbeat for the BHF
A Digital Heartbeat for the BHF
Saddle Creek Logistics Website Design
Saddle Creek Logistics Website Design
SGUA Online Platform Development
SGUA Online Platform Development
Doxy.me Telemedicine Platform Enhancement
Doxy.me Telemedicine Platform Enhancement

Join 50k+ companies and 1M+ independents

Contra Logo

© 2025 Contra.Work Inc