My role
I was hired as a Lead Product Designer and as a generalist playing the player-coach role, I designed various experiences, scaled the design function, and helped ManyPixels grow its business revenue.
Key Achievements
- Increased conversions across all product listing pages by 19.8%
- Improved usability of filters across web, iOS, and Android platforms
- Enhanced content discoverability on product category pages
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.
Navigating Design Delivery Challenges: Simplifying High-Quality Solutions for Businesses
- The main objective is to reflect updated business processes like business model and introducing new features. And of course, better experience of the platform as well as modern looking UI.
- From a visual point of view, there was a lot of inconsistency in UI design. The product grew, so new features and pages were introduced, but w/o clear design system, it’s getting worse and worse. So objective #2 was to develop a stable design system.
- Our old design was a real headache because we didn't think it through properly. It made it tough to give users a great experience and it just didn't look good. So, we had some serious work to do to fix that mess.
The goal of this project is to transform the ManyPixels design management app by aligning it with updated business processes, establishing a stable design system, and enhancing the user experience, especially in terms of mobile usability.
User Engagement:
Measure increased user activity and design request submissions to indicate alignment with updated business processes.
Design System Adoption:
Monitor a reduction in reported UI issues and design-related bugs as evidence of successful design system adoption.
User Satisfaction:
Assess improved user satisfaction scores and positive feedback on usability and aesthetics.
Forging a Path to Clarity: Elevating Communication and UI for a Superior Platform
I designed everything on the platform with users' needs at the forefront. My goal was to address their pain points effectively. After several months of research and development, I launched the platform as invite-only. The response was incredible, with hundreds of people requesting invites, and the user base quickly grew to 400 paying members
Test the Prototype:
Unveiling Insights: Navigating User Realities for Enhanced Solutions
1. Enhanced User Experience:
By aligning the app with updated business processes and introducing new features, the project resulted in a significantly improved user experience. Users now find the platform more user-friendly, efficient, and visually appealing, leading to increased engagement and satisfaction.
2. No More Design Chaos:
We used to have this design mess - different styles, fonts, you name it. But now, we've got a solid design system in place. Everything looks consistent and professional. It's like we got our act together!
3. User Engagement and Growth:
After all the hard work, we saw a huge boost in user engagement. From our humble invite-only beginnings, we've grown into a bustling community of 400 paying members. It's pretty clear that our redesign and user-focused approach really paid off.
The process we followed
We wanted to show the team at Manypixels how facilitated workshops, followed by focussed prototyping and testing, could deliver not only the measurable results that they were looking for, but also a shared understanding between team members about what we were trying to achieve and what the users of the product essentially wanted to get out of their experiences.
Step 1 - Discovery
Understand the problems, the goals and the plan of action.
Step 2 - Conceptualise
Create wireframes and a clickable prototype of our concept.
Step 3 - Test
Give our prototype to users, gain insights into their behaviour and opinions.
Step 4 - Analysis
Take what we learned and use it to learn, improve and strategise.
Research methods we used here:
We conducted extensive market research, user interviews, competitor analysis, user surveys and workshops with the team and stakeholders to uncover key insights. By engaging with potential and existing users, we aimed to identify pain points, preferences, and opportunities for innovation in the realm of design management. This comprehensive research laid the foundation for informed decision-making throughout the development process, ensuring that our design solution is not only technically robust but also aligned with the real-world needs of our user base. The insights gathered during this phase played a pivotal role in shaping the app's features, functionality, and overall user experience.
Competitor analysis
Manypixels has two main (and biggest) competitors on the market:
- penji.co
- designpickle.com
Interviews:
thanks to God, we have a couple of super loyal clients who found some free time to talk with us, so we could highlight the main Use-cases to be solved.
Stakeholders & expert panel:
We organized six workshops with the management team and customer support lead to uncover key pain points. In a customer-oriented industry lacking uniqueness in processes or value, understanding customer obstacles was crucial.
User Surveys:
We conducted user surveys to gather valuable feedback and insights from our client base. This allowed us to pinpoint key use cases that needed improvement and better understand our clients' pain points and expectations.
Unveiling Insights: Navigating User Realities for Enhanced Solutions
Mostly, all design requests are related to the one company/brand. So it’s painful for the client to upload the same materials (brandbook, illustrations, other brand materials) for each request without missing anything. So to help designers to have all materials from the beginning, we introduce Brand Profiles. Client (and designer after completing somedesign request) uploads everything he has to specific folder of Brand Profiles. So now, when he creates a request, there is no need to do the same work again & again, he just refers to the needed brand profile.
Wireframing & Prototyping: Unveiling Insights: Navigating User Realities for Enhanced Solutions
Before I started working on wireframes I gathered inspiration from other interfaces with functions that Manypixels can use. Analysed our two main competitors and started drawing some ideas that I have in my mind.
Then we spoke with the PM and made some modifications, something was added, something removed but in general we kept the initial idea.
Early sketches and concepts
Developing an Initial Prototype
In order to verify the severity of problems identified in the kick-off workshop and to attempt to streamline some of the processes that users are currently having trouble with, we set about developing a prototype of our proposed solution that would be used during face-to-face UX testing.
I built our prototype in Figma and focused only on the screens required to explore the main issues raised so far. We also wanted to provide quantitative evidence to illustrate any measurable improvements to the experience of learners whilst using our solution and secure funding for the full project.
Usability testing: Navigating User Realities for Enhanced Solutions
I conducted usability testing sessions with our primary users to validate whether the new designs would solve their problems. I wrote a script including a scenario asking the user to create a new request for all design options on desktop and mobile devices.
During the session, I observed how they interacted with the prototype and set up the request. The usability session revealed that it was less arduous to set up a new Request due to the grouping of related fields. It was easier for the user to identify which forms they had to fill, as advanced settings were now hidden under a collapsable toggle.
We aimed to test 5 Learners and any Learner Administrators that we could get our hands on during each study (on average we tested between 2 & 3 Learner Admins).
The tests were carried out 2 weeks apart which gave us time to analyse results and make minor amendments to the prototype between each test.
The Results of Testing
Results gathered during the tests were, on the whole, comparable throughout the study despite the minor changes in between tests. We used the timed tasks to extrapolate representative time savings for each market and for Europe as a whole. We were also able to present positive qualitative results across all of our test users.
Outcome summary:
In order to gauge the user-friendliness and effectiveness of the ManyPixels design management app, we conducted usability testing. Our aim was to observe users' interactions with the system, identify potential pain points, and gather insights to enhance the overall user experience.
-
Navigating the Design Dashboard:
- Task: Show how you navigate through your design dashboard upon logging in.
- Observation: Users successfully located their design projects, indicating an intuitive dashboard navigation.
-
Checking Design Project Status:
- Task: Demonstrate how you identify design projects that are still in progress.
- Observation: Users navigated to the project status section with ease, indicating clarity in understanding project progress.
-
Examining Design Details:
- Task: Show how you view specific details of an ongoing design project.
- Observation: Users easily accessed and explored detailed information about their design projects, suggesting an effective information architecture.
-
Navigating the Design Workflow:
- Task: Show how you review and provide feedback on design drafts.
- Observation: Users efficiently navigated the design workflow, demonstrating a smooth collaboration process with design drafts.
-
Initiating a Design Request:
- Task: Demonstrate the process of requesting a new design project.
- Observation: Users seamlessly initiated new design requests, indicating an uncomplicated and user-friendly request process.
Final thoughts & takeaways
When I look back at our project, one big lesson stands out - putting our users first was the key to our success. By really getting what our users needed and giving it to them, we not only got more engagement but also saw our community grow to a whopping 400 paying members. Having a solid design system in place was also a game-changer, making sure everything looked pro and consistent. But at the end of the day, it was all about making our users happy by solving their problems and creating an app that's super easy to use. That's what set us up for more success down the road.