From idea to a 12 new companies as clients
Outcome
Companies lose money due to decreased productivity caused by mental health-related issues, which often go unnoticed, but are easily preventable if detected early.
Problem
Companies lose money due to decreased productivity caused by mental health-related issues, which often go unnoticed, but are easily preventable if detected early.
Constrains
- Zero budget for user research.
- Defined list of mostly non-negotiable features and functionality.
- Poorly made visual identity with no style guide.
- No lead or senior designers (or any other designers besides me)
- I had ZERO prior UX/UI experience, this was my first job in this field.
Stakeholder interview
Reasons behind it
When I joined the company, I was informed that we would be creating a digital product for mental health tracking from scratch.
However, there was no clarity on the business or user goals, nor on the desired outcome. Additionally, there was an opportunity to bridge the knowledge gap regarding other important details.
Key takeaways
- Similar, but not good enough for mental health tracking product exist.
- Product users are going to be CEO’s, managers and HR managers.
- We have to complete this project in about 3 months.
- Solution must be based on HTML (no apps).
- Stakeholders lack a budget for research and prioritize a swift product launch to test it in real-life scenarios.
Competitor analysis
Reasons behind it
Stakeholders drew significant inspiration from the web app known as "&frankly" for its similar functionality but with a slightly different focus. Therefore, it was crucial to delve deeper into understanding this product, along with exploring alternatives like "Agendrix" and "Leapson."
The primary objective was to gain insights into user experiences, industry trends, and feedback.
&frankly analysis showed:
- The outdated appearance and inaccessible contrast levels, failing to meet WCAG standards, contribute to usability challenges.
- The product touches on mental health, but lacks a primary focus, resulting in insufficient emphasis to address the problem effectively.
- Lacking desired features customers complain about.
Angendrix and Leapsome analysis showed:
- Bulk actions are a common time-saving feature for companies with hundreds of employees.
Christian
I would like to see more options in design when it comes to types of questions, adaptability, themes, icons, images and color.
Johan
There's no easy way to delete packages of questions without support from the software supplier.
Alex
It is not very intuitive, especially the answers section.
Relevant proto-persona
Reasons behind it
Before designing, I empathized with our ideal customer based on prior research, creating a preliminary persona. The main goal was to focus on relevant information to base my design decisions in my further work.
How we benefited from proto persona:
- Assisted in mapping a user flow diagrams and decide in what sequence user is expected to interact with the product to help them achieve their goals faster and smoother.
- Helped prioritize features that were most commonly used by the persona based on her goals.
Sarah
HR manager
Sarah works at a mid-sized technology firm specializing in software development. As part of her responsibilities, she seeks solutions to address employee performance issues which become apparent in recent months.
Pain points
- Limited time and resources, lack of expertise in mental health.
- Identifying the factors contributing to declining performance, implementing effective interventions to support employee mental health and overcoming stigma surrounding mental health discussions in the workplace.
Goals
- Sarah aims to identify the root causes of decreased productivity and employee disengagement within the company and solve them.
- Sarah aims to prevent productivity related issues
Needs
- Sarah requires actionable insights and data-driven tools to assess employee well-being, identify trends, and implement targeted interventions.
- She seeks solutions that prioritize employee privacy, offer customizable features, and provide access to resources for promoting mental health awareness and support within the organization.
Wireframing
Reasons behind it
Even though the stakeholders knew what they wanted, they didn't know how they wanted it.
Wireframes allowed us to present the features quickly and clearly, facilitating discussions with stakeholders without delving into aesthetic details.
How we benefited from proto persona:
- Save time and money by providing developers with validated wireframes for core functionalities, allowing development to proceed while visual design is in progress.
- Meaningful feedback streamlined the process by catching potential mistakes early, thus saving time that would have been spent fixing them later.
- It revealed new opportunities that stakeholders may not have considered initially, enriching further product development with fresh insights and ideas sparked by the wireframes.
High fidelity
About
Before delving into high-fidelity design, I needed to establish a visual direction, as the company lacked any existing visual guidelines.
Although they had a website characterized by three predominant blue colors and background photography in each section, there was no formal style guide.
To ensure consistency with the brand, I opted to align the dashboard's aesthetics with those of the website, creating a seamless visual experience.
Outcome
- The final design received praise from stakeholders.
- Following the product launch, we sold it to our first clients within the first month and continuously gained new clients ever since.
Employee answers
After the dashboard was completed, I also had to design question templates for mobile that employees would receive through a link.
These questions were designed to serve a dual purpose: to be interactive and enjoyable for employees to answer, and to serve as easily modifiable templates for HR managers. This allowed HR managers to fill them with different text to create entirely new questions while still making sense.
Conclusions
This was my first ever product ux/ui case study, woohoo! 🎉 The project was definitely an eyes-opening experience for me which provided me tons of opportunity to learn and grow!
Michaela
"I learned a lot from David. He is always willing to lend a hand to anyone who needs it. His ability to overcome challenges with a smile made his stand out as a cut above the rest! Any company would be lucky to have David on their payroll."
