A redesigned mental health hub with intuitive, mobile-first design that improves navigation and guides users to the right specialists—boosting engagement by 39%.

The Ukrainian Psychological Hub provides essential mental and physical health services, but its website lacked clarity and engagement.

I redesigned and developed a modern, user-friendly platform to enhance accessibility, improve service discoverability, and create a calming experience for users. This project combined thoughtful UX strategy, intuitive design, and custom development to better support those seeking help.

Role

UX/UI Designer, Low-Code Developer

Timeline

16 weeks

Tools

Figma, WIX Velo, JavaScript

Team

Solo Project

The outdated visual design fails to attract users and adequately represent the full range of services provided by the UPH.

The cluttered interface makes it difficult for users to find relevant information quickly, resulting in a high bounce rate.

The Specialists' page is inconsistent and not properly categorized.

A modern, WCAG‑compliant design system (palette, type scale, spacing, components). Updated hero messaging and unified styles via reusable cards/CTAs.

A streamlined navigation system with a well-defined hierarchy and gradual disclosure of information.

Standardized card layouts and profile templates, along with advanced filtering options to facilitate a more efficient search for specialists.

The Ukrainian Psychological Hub (UPH) was launched in 2022 as a volunteer initiative to provide mental health support to Ukrainians affected by the full-scale invasion. While it successfully established itself as a vital resource, its website was hastily built to meet urgent needs, prioritizing basic functionality over a well-designed user experience. Now, as UPH expands its services and moves toward a more sustainable model, the current website’s limitations, such as inconsistent navigation, lack of scalability, and an outdated visual identity, hinder its ability to grow and engage users effectively.

The solution must improve navigation, introduce clear calls-to-action, and optimize the specialists' page with better categorization and filtering.

To gain insight into user experiences, pain points, and valued features, I conducted interviews with both clients and psychologists. Three key takeaways emerged:

Cluttered Home Page: Clients find the homepage overwhelming and difficult to navigate, making it harder to access essential information.

Ineffective Specialist Listings: Clients struggle to compare psychologists due to an overly long list with insufficient details in each profile, making the selection process frustrating.

Visibility Concerns: Psychologists feel that those positioned lower on the list receive fewer client inquiries, reducing their chances of being chosen.

Mindly and Rozmova are the main players in the market and serve as the primary competitors for the Ukrainian Psychological Hub. By analyzing their strengths and weaknesses, I identified key opportunities for improvement:

Modern Design & Organization Matter. Both platforms prioritize clean and modern visual design, making information easier to digest. A well-structured landing page, as seen on Rozmova, improves usability and helps guide users efficiently.

Accessibility of Specialist Listings. Mindly offers a comprehensive list of specialists, but access is restricted to a mobile app, limiting convenience for users who prefer desktop browsing. Rozmova, on the other hand, simplifies the selection process but restricts clients to a limited number of suggested specialists.

Balancing Choice & Guidance. Mindly provides an extensive list, but the lack of direct website access makes it less user-friendly. Rozmova narrows choices through a questionnaire, but this limits user autonomy. An ideal solution should offer both structured guidance and open browsing to accommodate different user preferences.

Next up came design exploration. I developed a moodboard to gather visual inspiration, communicate the brand's identity, and establish the product's visual direction.

The client maintains their website on the WIX platform. To start, I thoroughly explored the platform’s tools and capabilities. To ensure a recognizable brand identity, I decided to retain the yellow and blue from the logo but use them only as accent colors. I structured the landing page into clear, distinct sections and applied the colour block technique to enhance navigation and improve the overall user experience.

For the hero section, I created a collage symbolizing life's balance, with a prominent CTA button. The 'Therapeutic groups' section, a new service, uses an accordion for easy navigation, allowing users to view group details and access them directly. I utilized WIX tabs and JavaScript for this feature. The 'Announcements and Events' section was updated with a neumorphic design using custom CSS for a modern look. The Specialists Page was divided into two sections for psychologists and physical health specialists, with categories for easier selection. I also redesigned the About Us and Specialist’s Profile pages, implementing a new CRM system.

Once the redesign was approved, I implemented the site on WIX, leveraging platform components with custom enhancements. The build included:

Custom CSS and JS: applied neumorphic styling to announcements, accordion/tabs for 'Therapeutic Groups', and image switching for group previews.

CMS setup: structured specialist categories (psychological and physical health), standardized profile fields, and unified card templates with clear contact cues.

Final optimization: refined navigation, filters, and CTAs for faster discovery and reduced bounce.

The Importance of a Hero Section

Communication is key

Scope creep is real