All work/Case 02 of 10/Rebrand + website redesign8 min read

Mindweller

Self Analyse, renamed and rebuilt as Mindweller.

Mindweller offers psychometric tests, online counselling and career guidance for students, parents and adults. I renamed the brand from Self Analyse, designed the logo and identity, redesigned and built the website in React, and designed the test screens and psychometric reports.

Role
UI/UX designer + front-end
Scope
Name · Identity · Website · Tests · Reports
Stack
React · GSAP · Lenis
Status
Pre-launch
The new homepage: one promise, two actions and a calm, photographic hero.
CoverThe new homepage: one promise, two actions and a calm, photographic hero.
The short version
Challenge

Visitors arrived with a worry, not a product name, and the old site’s invented names (TalkSpace, MindMap, PathFinder) left them guessing which service to use.

Approach

A new name and identity, plain-language service names, and a homepage that starts with “What brings you here?” and points each answer to the right service.

Outcome

A complete rebrand and a 12-page website, now in pre-launch, where every service is one click from the homepage.

1new name, logo and identity
3services renamed in plain language
3test types with their own screens: Interest, Personality, Aptitude
12pages redesigned and built
01 / Overview

From Self Analyse to Mindweller.

Self Analyse offered tests, counselling and career guidance, but the website buried them under invented product names and a generic template. I renamed the brand to Mindweller, designed a new logo and identity, and rebuilt the website around one goal: helping each visitor find the right service quickly.

Redesigned screenOriginal screenBeforeAfter
DragThe old Self Analyse homepage and the new Mindweller homepage.
02 / The problem

Good services, hard to find.

People arrive with a worry, not a product name: exam stress, a child choosing a stream, a relationship. The old site asked them to decode TalkSpace, MindMap and PathFinder before they could start.

01Invented product names

Visitors had to learn the brand’s vocabulary before they could choose.

02No clear first step

Booking and testing buttons competed with four menus for attention.

03Claims without sources

Unsupported statistics were a trust risk in a mental-health product.

04No guidance for someone in crisis

Nothing explained that this is not an emergency service, or where to go instead.

03 / New brand

A name and identity built to feel calm.

Mindweller needed to feel credible and gentle at once. I designed the name, logo and identity: deep navy and teal, a soft mint accent and a single coral highlight per page.

04 / Clear services

Start from the question, not the catalogue.

Services were renamed to the words people already use (Counselling, Tests, Career guidance), and old links redirect to the new pages. The homepage asks “What brings you here?” with six plain answers, each leading to the right service.

TalkSpace
Counselling1 → 1
Find a counsellor3-question quizBook a session
MindMap
Tests1 → 1
InterestPersonalityAptitudeBundles
PathFinder
Career guidance1 → 1
Classes 9 to 12Plans30-minute consult
“What brings you here?” Six questions, each ending in one action.
Fig.“What brings you here?” Six questions, each ending in one action.
05 / Key decisions

Calm is a design requirement.

Decision 01

Two-tone headlines

A soft grey phrase sets up the thought and a navy phrase lands it, giving every page a rhythm without extra illustration.

Decision 02

Show the product, don’t describe it

Report rings, booking slots and a roadmap checklist appear on the page, so visitors see what they’ll get before they pay.

Decision 03

Honesty first

Testimonials are marked as samples until real ones exist, and every page carries a crisis notice.

Service tabs that rotate on their own and stop when you interact.
01Service tabs that rotate on their own and stop when you interact.
How it works, with a progress line that draws as you scroll.
02How it works, with a progress line that draws as you scroll.
Counsellors get the only dark section on the page.
03Counsellors get the only dark section on the page.
Two ways to begin, with prices on the cards.
04Two ways to begin, with prices on the cards.
Footer with the site map and a crisis notice.
05Footer with the site map and a crisis notice.
01 / 05 · swipe or use arrows
06 / Tests and reports

Results people can actually read.

Beyond the website, I designed the test-taking screens for the Interest, Personality and Aptitude tests and the reports people receive afterwards. The test screens stay quiet: a visible timer, clear progress, and a section map for longer tests like Aptitude. The reports turn scores into plain language: interest areas shown as simple bars, a deep dive into the strongest areas, and suggested streams and careers to explore next.

Aptitude test: question, options, timer and a section map.
Fig.Aptitude test: question, options, timer and a section map.
Interest test: statement choices.
Fig.Interest test: statement choices.
Interest test: picking professions.
Fig.Interest test: picking professions.
Sample report, personal details blurred.
Fig.Sample report, personal details blurred.
07 / Across the site

One system, twelve pages.

Every page follows the same frame and opening, so moving from Tests to Counselling to Schools feels like one product. The community page adds badges and a wall of small wins, with reactions only and no free-text posts, which keeps it easy to moderate.

Tests
Fig.Tests
Counselling
Fig.Counselling
Community
Fig.Community
Schools
Fig.Schools
Before
01Before
After
02After
Starting questions
03Starting questions
Tests
04Tests
08 / Results

Ready for launch.

Mindweller is in pre-launch. The new brand, 12 pages, the test shop, counsellor booking, the test screens, reports and community space are designed, and every service is one click from the homepage under a name visitors already understand.

Learnings

In a wellbeing product, the most persuasive thing you can do is remove a claim you can’t support.

Almost there+50 XP for finishing0 of 10 case studies cleared.
Next case · 03 / Multi-product SaaS

Eclara Whitelabel

A white-label admin platform that academies rebrand and run as their own.

+100 XP8 min read
Eclara Whitelabel preview

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