A User-Centric Journey That Led to Remarkable Growth

DevelopMe+ is a learning management system with core functionality of allowing users to access learning requirements and follow learning paths and for employers to provide mandated and suggested learning to users.

main dashboard
Summary

At DevelopMe+, the UI was 20 years old, and the UX role had been unfilled for years. As a Senior UI/UX Designer, I led the transformation of the platform, implementing a modern UI and improving the UX with new flows and functionalities. This redesign resulted in a 133% SaaS growth and a 124% YoY revenue increase.

My primary responsibility was to create intuitive and visually appealing interfaces that enhance the user experience. This involved understanding user needs, conducting research, and designing interfaces that are easy to navigate. I collaborated closely with developers and product managers to ensure effective implementation of the designs.

Additionally, I iterated on designs based on feedback and testing to continuously improve the user experience. My goal was to create interfaces that are both aesthetically pleasing and user-friendly, ultimately leading to increased user satisfaction and engagement.

Core Responsibilities
  • Lead the redesign direction of the app
  • Updated the user experience in key areas of the product
  • I developed the app with Html, Sass and JS
  • Accessibility and performance
  • Aided user research/interviews
  • Created unique visuals for the app (illustrations, icons, etc.)
  • Shared various expertise with the team.
Position

Sr. UI/UX Designer

Timeline

August 2023 - May 2024

Team

4 Developers, 1 PO, 3 QA Engeneers

Problem & Insights

Tackling Manager-User Disconnect and UI Inconsistencies

We faced numerous user problems due to the chaotic system state, making issues hard to identify. The best solution was to start from scratch.

Key problems included:

  1. Manager-User Communication: Admins needed quick and easy access to the service, but communication between managers and users was extremely poor. Managers lacked information about team members' learning histories, making it difficult to determine course relevance.
  2. UI Inconsistencies:The user interface was inconsistent and outdated. To address this, I created a new, fresh style guide for the project, which I continuously updated.
The Goals

From Outdated UI to a Seamless User Experience

The goal of this UX project was to transform the outdated learning management system (DevelopMe+) into a user-friendly platform with a modern UI and improved UX. The project aimed to address several key challenges:

Success Metrics
Enhance Admin Access and Communication

Make it easy for users, administrators, managers, and learners, to efficiently access learning requirements, follow learning paths, and manage their learning history.

Improve User Efficiency

Facilitate quick and easy access for administrators, enabling them to effectively communicate and manage learning requirements for users.

UI Consistency

Create a visually appealing and consistent user interface by developing and implementing a new style guide to replace the outdated and inconsistent UI.

Accessibility and Inclusivity

Ensure the platform complies with accessibility standards (e.g., WCAG) and track improvements in accessibility scores.

Solution

Forging a Path to Clarity: Elevating Communication and UI for a Superior Platform

Finally, after a couple weeks of iterations, we landed on a style that we were comfortable with. We thought that users can now access a dedicated tool within DevelopMe+ to seamlessly view, manage, and complete their learning-related tasks. In our initial MVP release, we've introduced features that empower users to efficiently handle both individual learning tasks and navigate the open enrollment process across the entire platform.

Final Design: Main Dashboard

Before

The main dashboard was cluttered and disjointed, making navigation difficult and obscuring team members' learning histories. The lack of visual hierarchy and inconsistent UI elements created a confusing and uninviting user experience, hindering engagement and communication.

After

Users can now access a consolidated management dashboard within DevelopMe+ that I've designed. This dashboard empowers users to conveniently oversee their learning progress, efficiently manage their tasks, and access all necessary information in one centralized location, simplifying their learning experience.

Profile page

Before

Cluttered interface tracking numerous communication types

After

Detailed preview of profile pages with intuitive design and enhanced usability, enabling easy access to relevant information and seamless navigation.

Final Design: Team view

Users can now access a dedicated profile management tool within DevelopMe+. In our initial MVP release, we've introduced features that enable users to view, manage, and update their personal profiles, as well as easily navigate through the learning requirements and follow learning paths across the entire platform.

Final Design: Assesment course details

Users can easily access their desired courses from the dashboard, this time with a specific focus on assessment courses. By simply clicking on the course card, they can navigate to view comprehensive details, initiate the assessment, and ultimately review their assessment results—all within a seamless and user-friendly process.

Outcomes

1. Improved User Experience:

The project achieved a streamlined and intuitive user experience, making it easier for users to access learning materials and manage their progress efficiently.

2. Enhanced Admin Efficiency:

Admins can now access and communicate information more effectively, facilitating better decision-making regarding course relevance for team members.

3. Modernized UI and Consistency:

The project introduced a modern, visually appealing user interface with a consistent design language, enhancing the platform's overall professionalism and usability.


Discovery & Research

Unveiling Insights: Navigating User Realities for Enhanced Solutions

Me and PM conducted a series of interviews to better understand the problem this project was attepting to solve. My questions centered on understanding the user goals, the contents of use and what is their top priority focus..

Research Objectives

The intention of the interviews was to see how the users handle the old app on dialy basis.

  • Assess whether the terminology is understood by users and appropriate language is used
  • Determine whether the process flows in a logical way
  • Assess if users can effectively navigate through the process using the links and buttons
  • Assess whether the content adequately supports users
  • Analysis of how the design measures up against user goals, business goals, project intent, and system or technical constraints

Analyzing Data

With all of our data collected from the research and analyzing the feedback from the focused group, we created an affinity map of our findings. The affinity map helped us organize our thoughts and really find the most important problem

Feature Prioritization

Unveiling Insights: Navigating User Realities for Enhanced Solutions

To prioritize features with the most immediate impact, I collaborated with the Product Manager, engineering, and product operations to strategize an MVP release plan. We collectively opted to focus on two core workflows central to the majority of user interactions within DevelopMe+: managing user tasks and optimizing the open enrollment process.

Decide & Define

Unveiling Insights: Navigating User Realities for Enhanced Solutions

Once we knew what problem to solve, we focused on coming up with as many ideas to solve it. We went for quantity over quality and welcomed absurd ideas.

Firstly our focus was on home page/Dashboard. We were aiming to brought most important informations our users uses on daily and weekly basis, combine and compiled all into one place.

Future Steps

Navigating towards personalized progress insights and enhanced adoption

We tested the low-fi wireframes with couple of our loyal users. We guided them through the flow and gethered very useful feedback.

After this usability testing we created mid-fidelity wireframes, we added some more functionality and more visibility and clarity with the UI. And we condinued improving the the layout with Round 2 Usability tesing this phase.

The user testing took place with a group of new PWA customers that had just signed up for an in-person course. The insights gathered from this study were really positive but threw up a suprising observation for 2 out of the 5 test-subjects.

Feedback summary:
  • 5 out of the 5 testers would almost certainly pay for supplementary training that could be undertaken in preparation of an in-person course.
  • 3 out of the 5 testers said that they would take an online course instead of an in person course if it were available.
  • 2 out of the 5 testers said that they prefer consultation with line manager before start some online training.

Final thoughts & takeaways

Reflecting on this UX project, we placed users front and center, resulting in a smoother user experience within DevelopMe+. Effective communication between managers and users was a game-changer. Providing administrators quick access to information empowered them. Maintaining a modern, consistent interface was key for user-friendliness. This project emphasized that UX design is an ongoing journey, transforming the learning system. Our efforts drove impressive results: 133% growth and a YoY revenue increase of 124% from 2020 to 2021.

Checkout my work with Zephyr Squad&Scale