Mindler rebranding - bringing an agency's vision to reality in our products.
UI
Mindler is Sweden’s largest digital psychology provider, treatment blends video calls with a psychologist an exercises in the app. The medtech industry is typically rather traditional, but Mindler wanted to standout as a more distinctive brand. To achieve this, Mindler’s marketing team collaborated with Save-our-souls to create the new brand vision.
The ask: translate the agency’s brand guidelines across our 3 products, exploring and defining how to implement the rebranding in a digital space.
My role: Product designer lead implementing the rebranding of our app, website and psychologist platform. My role was both to ensure design consistency between all products as well as detailed design work alongside the team.
The team: 3 product designers, brand manager, 2 product managers and 2 tech teams.
Translating agency brand guidelines into a digital space
With a short turnaround between the agency handover and our launch date, the product design team had to quickly adapt the new brand within the constraints of our existing products The initial release had a limited scope, focusing on updating fonts, colors, and imagery in the patient app, psychologist interface, and Mindler website.
These limitations meant we had to apply the rebranding to existing UX and UI, which sometimes didn’t translate well with just color and font updates. Since the new brand vision didn’t easily align with the current UI, designers prioritized certain components to achieve the brand vision without exceeding the project scope.
Sample pages from agency’s brand guidelines.
Exploring color usage for a brand developed from a marketing perspective
The new color scheme and brand expression were developed through the lens of marketing campaigns and social media contexts, making it challenging to apply the bold palette to our digital products. The product team struggled to define design principles that would work well within our functional products.
While the agency was still finalizing the brand guidelines, our product designers began a condensed discovery phase to define brand color usage in our functional product.
Rebranding our Design System & defining the brand expression in app flows
Discovery phase of this project was crash testing the rebranding on our current app Design System and various key screens to define brand expression for the first release. I worked alongside another designer to define:
Exploring component restyling.
Identifying which components needed prioritization of more developer resources.
Applying rebranding within entire Design System.
Publishing DS updates to all our Figma app flows.
Supporting developers in implementing and testing the redesign.
Before rebranding - sample screens from the app.
After rebranding - samples screens after several releases of the rebrand.
Overview of rebranded Design System components and variants.
Rebranding illustrations used in exercises within the app
After the first release, we began redesigning illustrations within iCBT programs. While the main brand illustrations were outsourced, the educational illustrations within the exercises needed to be redesigned internally. The new style of iCBT illustrations needed to further build our new brand and easy for product designers to create in Figma.
Working alongside another product designer, we developed a doodle concept that matched the hand-drawn style of our illustration library. This approach allowed non-illustrators in the product team to more easily create illustrations in Figma. The doodles added a personal touch to the content-heavy program material, resembling notes or diagrams left by a psychologist.
We also designed an Illustration Design System, with reusable components to help build consistent illustration types. This system provided a clear overview of illustrations and facilitated collaboration with the content team for text localization across all markets.
Sample illustrations using our Illustration Design System, relying on handrawn doodle style.
Product team becoming owners of the website rebranding
With limited resources in the marketing department, the product team took over ownership of the Mindler website. This meant implementing the rebranding based on past marketing content and quickly onboarding ourselves to the website’s challenges and opportunities.
I worked alongside another product designer in defining and implementing rebranding of the website. After exploring the brand expression during the discovery phase, we split responsibility for pages and components to meet our tight deadline. As the product design lead, I oversaw all products, sharing insights to ensure consistent rebranding across designers. The website became a link to marketing materials, featuring a bolder brand expression compared to the more functional patient app and psychologist workspace.
Rebranding our psychologist workspace, Mindler Care
Due to a tight deadline, the first rebranding release focused on patient-facing products: the app and the Mindler website. After the launch, we shifted to rebranding the psychologist workspace. As product team lead during a colleague’s maternity leave, I was responsible for leading the product workflow of rebranding Mindler Care.
I collaborated with another product designer, PM, psychologist, and tech team to implement the new design.
Before rebranding - sample screens from Mindler Care, the psychologist workspace
After rebranding - sample screens from Mindler Care, the psychologist workspace
Final thoughts & personal learnings
Some of my biggest learnings during the project include:
Restrictions of implementing outsourced rebranding was a perspective I hadn’t yet experienced in my design career. I’ve always been on the agency side handing over guidelines to clients but never implementing them. This switch in responsibilities gave me new insight into the complexities of a company-wide rebranding. The complexities of scenarios to consider, resource limitations and deadlines all significantly impact the final design.
Discovery phase required within product team. Proper amount of time needs to be allocated for designers to understand the new visual language of a brand. Rebranding often involves more than just updating existing components, it requires refining them to align with the new brand.
Juggling supporting multiple designers & products simultaneously was a new responsibility for me. With the team lead on maternity leave, I took on the role to ensure the team met our deadline and maintained brand consistency accross products. I learned to balance the stress of multiple projects, knowing when to support others by stepping in to sketch or when to delegate tasks.
Increase team retrospectives in high stress projects was key in the team’s success. Weekly team check-outs to gauge stress and reflect what we didn’t want to take with us into the next week. Reflecting on what to improve allowed us to work efficiently and support each other during the tight rebranding deadline.