AYOOO WAZZUP?

Elevating UX: A Journey of Platform Enhancement

Elevating UX: A Journey of Platform Enhancement

Elevating UX: A Journey of Platform Enhancement

Client

Commission
Factory

Role

UI Designer

UX Researcher

Interaction Designer

Tags

UI Design

UX Design

Web Design

Timeline

11 months

Fun fact 🏆

I started the project as a UI and UX Designer, primarily concentrating on revamping their existing platform to improve the user experience. As the project progressed, I took on the responsibility of conducting thorough research and designing new features to match their refreshed brand identity. Additionally, I led the team in addressing the challenge of the design hand-over process, as there was no established procedure for this. Witnessing the platform's improvement based on user feedback is immensely gratifying, validating the effort I've invested.

About the company👤

Commission Factory is an affiliate marketing network that acts as the intermediary between advertisers (also referred to as merchants) and affiliates (also referred to as publishers or partners). Commission Factory provides the technology used to track and attribute sales to the correct affiliates, as well as facilitating the payment of affiliate commission on behalf of the advertiser. 

Problem❓

The current platform suffers from outdated design and functionality, leading to negative user feedback on its user experience. Additionally, the UI design feels dated and does not align with modern design standards. The platform has also acquired new features and pages that need to be designed with an intuitive and user-centric approach while maintaining the company's brand and business goals.

Design process 🔍

Emphatize

I start by understanding the users. I conduct research, interviews, or observations to get a clear picture of their needs and challenges. This helps me step into their shoes.

Emphatize

I start by understanding the users. I conduct research, interviews, or observations to get a clear picture of their needs and challenges. This helps me step into their shoes.

Emphatize

I start by understanding the users. I conduct research, interviews, or observations to get a clear picture of their needs and challenges. This helps me step into their shoes.

Define

After gathering insights, I analyze the data and define the core problem or challenge based on what I’ve learned about the users. This gives me a clear direction for my design.

Define

After gathering insights, I analyze the data and define the core problem or challenge based on what I’ve learned about the users. This gives me a clear direction for my design.

Define

After gathering insights, I analyze the data and define the core problem or challenge based on what I’ve learned about the users. This gives me a clear direction for my design.

Ideate

Now, I brainstorm ideas and explore multiple solutions. I try to think outside the box and come up with creative ways to solve the problem, without judging ideas too early.

Ideate

Now, I brainstorm ideas and explore multiple solutions. I try to think outside the box and come up with creative ways to solve the problem, without judging ideas too early.

Ideate

Now, I brainstorm ideas and explore multiple solutions. I try to think outside the box and come up with creative ways to solve the problem, without judging ideas too early.

Prototype

I create simple prototypes, whether they’re low-fidelity wireframes or basic models, to bring my ideas to life. These allow me to quickly test the core concepts.

Prototype

I create simple prototypes, whether they’re low-fidelity wireframes or basic models, to bring my ideas to life. These allow me to quickly test the core concepts.

Prototype

I create simple prototypes, whether they’re low-fidelity wireframes or basic models, to bring my ideas to life. These allow me to quickly test the core concepts.

Test

I test my prototypes with users to see how they interact with the design. I gather feedback, refine the solution, and make necessary changes based on real user behavior.

Test

I test my prototypes with users to see how they interact with the design. I gather feedback, refine the solution, and make necessary changes based on real user behavior.

Test

I test my prototypes with users to see how they interact with the design. I gather feedback, refine the solution, and make necessary changes based on real user behavior.

Solutions 💡

  • Conducted comprehensive user research to identify pain points and areas for improvement.

  • Implemented a modern, visually appealing design that follows current UI trends to enhance user engagement.

  • Used a clean and intuitive layout, along with responsive design elements, to improve user navigation and usability across devices.

  • Updated color schemes, typography, and visuals to improve readability, aesthetics, and overall user experience.

  • Streamlined user flows and introduced clear and concise messaging to guide users effectively through the platform.

  • Incorporated interactive elements and engaging features to enhance user engagement and satisfaction.

  • Regularly gathered and analyzed user feedback to iteratively improve the design and address evolving user needs.

Detailed design process 🔍

Throughout the project, I began by conducting comprehensive user research to identify pain points and areas for improvement. With these insights, I proceeded to implement a modern, visually appealing design that adhered to current UI trends, aiming to enhance user engagement. The design process also involved creating a clean and intuitive layout, integrating responsive design elements to improve navigation and usability across various devices. Additionally, I updated color schemes, typography, and visuals to enhance readability, aesthetics, and the overall user experience.

To further enhance usability, I streamlined user flows and introduced clear, concise messaging to guide users effectively through the platform. Interactive elements and engaging features were also incorporated to boost user engagement and satisfaction. Throughout the project, I regularly gathered and analyzed user feedback, using it to iteratively improve the design and address evolving user needs.

Design Iterations ✏️

The revamped UI is both visually appealing and user-friendly thanks to the new brand design. We also created user friendly interfaces that helps the users understand and use the platform. Users can easily track/monitor their applications and get real-time statuses.

My Design Contributions ❤️

I made significant contributions to various design tasks throughout this project, ensuring a cohesive and impactful final product.

I made significant contributions to various design tasks throughout this project, ensuring a cohesive and impactful final product.

Onboarding Widget

Designing an onboarding widget to guide new users through the initial setup and familiarize them with key features.

Designing an onboarding widget to guide new users through the initial setup and familiarize them with key features.

  • User Research and Analysis

    Conducted user research to understand common onboarding challenges and identify user needs. Analyzed data to create user personas and journey maps.

  • User Research and Analysis

    Conducted user research to understand common onboarding challenges and identify user needs. Analyzed data to create user personas and journey maps.

  • User Experience Design

    Developed wireframes and user flows focusing on a seamless and intuitive onboarding experience. Ensured that each step was clear and easy to follow.

  • User Experience Design

    Developed wireframes and user flows focusing on a seamless and intuitive onboarding experience. Ensured that each step was clear and easy to follow.

  • Visual Design

    Crafted visually appealing elements that align with the overall brand aesthetic. Designed engaging graphics, icons, and animations to make the onboarding process more interactive and enjoyable.

  • Visual Design

    Crafted visually appealing elements that align with the overall brand aesthetic. Designed engaging graphics, icons, and animations to make the onboarding process more interactive and enjoyable.

  • Content Creation

    Wrote concise and informative copy for each step of the onboarding process, ensuring clarity and user engagement.

  • Content Creation

    Wrote concise and informative copy for each step of the onboarding process, ensuring clarity and user engagement.

  • Prototyping and Testing

    Created interactive prototypes to visualize the onboarding process. Conducted usability testing with real users to gather feedback and make necessary improvements.

  • Prototyping and Testing

    Created interactive prototypes to visualize the onboarding process. Conducted usability testing with real users to gather feedback and make necessary improvements.

  • Feedback Iteration

    Iterated on the design based on user feedback, continuously refining the onboarding flow to enhance usability and effectiveness.

  • Feedback Iteration

    Iterated on the design based on user feedback, continuously refining the onboarding flow to enhance usability and effectiveness.

  • Collaboration and Handoff

    Worked closely with CEO, Project manager, Stakeholders and Developers to ensure the smooth implementation of the design. Provided detailed documentation and assets to facilitate a seamless transition from design to development.

  • Collaboration and Handoff

    Worked closely with CEO, Project manager, Stakeholders and Developers to ensure the smooth implementation of the design. Provided detailed documentation and assets to facilitate a seamless transition from design to development.

Impact

The redesigned onboarding widget significantly improved user engagement and satisfaction. New users were able to complete the onboarding process more quickly and with fewer issues, leading to higher retention rates and positive feedback.

The redesigned onboarding widget significantly improved user engagement and satisfaction. New users were able to complete the onboarding process more quickly and with fewer issues, leading to higher retention rates and positive feedback.

Dashboard Re-design

Redesigning the dashboard to enhance usability, improve data visualization, and provide a more intuitive user experience.

Redesigning the dashboard to enhance usability, improve data visualization, and provide a more intuitive user experience.

  • User Research and Analysis

    Conducted extensive user research to understand user pain points, needs, and preferences. Analyzed feedback to identify key areas for improvement.

  • User Research and Analysis

    Conducted extensive user research to understand user pain points, needs, and preferences. Analyzed feedback to identify key areas for improvement.

  • User Experience Design

    Developed wireframes and user flows to optimize the dashboard layout. Ensured the design was intuitive, allowing users to easily navigate and access critical information.



  • User Experience Design

    Developed wireframes and user flows to optimize the dashboard layout. Ensured the design was intuitive, allowing users to easily navigate and access critical information.



  • Data Visualization

    Created clear and visually engaging data visualizations, including charts, graphs, and tables. Focused on presenting data in a way that is easily interpretable and actionable for users.

  • Data Visualization

    Created clear and visually engaging data visualizations, including charts, graphs, and tables. Focused on presenting data in a way that is easily interpretable and actionable for users.

  • Visual Design

    Crafted a modern and cohesive visual design that aligns with the overall brand identity. Utilized consistent color schemes, typography, and iconography to enhance the dashboard's aesthetics.

  • Visual Design

    Crafted a modern and cohesive visual design that aligns with the overall brand identity. Utilized consistent color schemes, typography, and iconography to enhance the dashboard's aesthetics.

  • Prototyping and Testing

    Built interactive prototypes to demonstrate the redesigned dashboard. Conducted usability testing sessions with target users to gather feedback and iterate on the design.



  • Prototyping and Testing

    Built interactive prototypes to demonstrate the redesigned dashboard. Conducted usability testing sessions with target users to gather feedback and iterate on the design.



  • Feedback Iteration

    Incorporated user feedback to refine the dashboard design. Made adjustments to improve functionality, clarity, and overall user satisfaction.



  • Feedback Iteration

    Incorporated user feedback to refine the dashboard design. Made adjustments to improve functionality, clarity, and overall user satisfaction.



  • Collaboration and Handoff

    Worked closely with CEO, Project manager, Stakeholders and Developers to ensure the smooth implementation of the design. Provided detailed documentation and assets to facilitate a seamless transition from design to development.

  • Collaboration and Handoff

    Worked closely with CEO, Project manager, Stakeholders and Developers to ensure the smooth implementation of the design. Provided detailed documentation and assets to facilitate a seamless transition from design to development.

Impact

The redesigned dashboard significantly improved user engagement and productivity. Users reported easier navigation and better data comprehension, leading to more informed decision-making. The updated design also received positive feedback for its modern aesthetics and user-friendly interface.

The redesigned dashboard significantly improved user engagement and productivity. Users reported easier navigation and better data comprehension, leading to more informed decision-making. The updated design also received positive feedback for its modern aesthetics and user-friendly interface.

Benchmark Report

Creating a comprehensive benchmark report to provide valuable insights, compare performance metrics, and identify areas for improvement.

Creating a comprehensive benchmark report to provide valuable insights, compare performance metrics, and identify areas for improvement.

  • Research and Data Collection

    Conducted extensive research to gather relevant data from various sources. Collected performance metrics and industry standards to establish a solid foundation for the benchmark report.

  • Research and Data Collection

    Conducted extensive research to gather relevant data from various sources. Collected performance metrics and industry standards to establish a solid foundation for the benchmark report.

  • Data Analysis

    Analyzed the collected data to identify trends, patterns, and key performance indicators (KPIs). Utilized statistical methods to ensure accuracy and relevance of the findings.

  • Data Analysis

    Analyzed the collected data to identify trends, patterns, and key performance indicators (KPIs). Utilized statistical methods to ensure accuracy and relevance of the findings.

  • Report Structure and Design

    Designed a clear and logical structure for the benchmark report, ensuring it was easy to navigate and understand. Developed visual elements, including charts, graphs, and infographics, to present data in an engaging and accessible manner.



  • Report Structure and Design

    Designed a clear and logical structure for the benchmark report, ensuring it was easy to navigate and understand. Developed visual elements, including charts, graphs, and infographics, to present data in an engaging and accessible manner.



  • Content Creation

    Wrote concise and informative content for each section of the report. Ensured that the language was clear, professional, and tailored to the target audience.

  • Content Creation

    Wrote concise and informative content for each section of the report. Ensured that the language was clear, professional, and tailored to the target audience.

  • Executive Summary

    Crafted a compelling executive summary that highlighted key findings, insights, and recommendations. Focused on providing a high-level overview for quick reference by stakeholders.



  • Executive Summary

    Crafted a compelling executive summary that highlighted key findings, insights, and recommendations. Focused on providing a high-level overview for quick reference by stakeholders.



  • Collaboration and Feedback

    Collaborated with team members and stakeholders to review and refine the report. Incorporated feedback to ensure accuracy, clarity, and alignment with project goals.



  • Collaboration and Feedback

    Collaborated with team members and stakeholders to review and refine the report. Incorporated feedback to ensure accuracy, clarity, and alignment with project goals.



  • Final Presentation

    Prepared and delivered the final benchmark report in a professional format. Ensured that all visual and textual elements were cohesive and effectively communicated the findings.

  • Final Presentation

    Prepared and delivered the final benchmark report in a professional format. Ensured that all visual and textual elements were cohesive and effectively communicated the findings.

Impact

The benchmark report provided valuable insights that helped clients understand current performance levels and identify areas for improvement. The clear and visually engaging presentation of data facilitated informed decision-making and strategic planning. The report was well-received, leading to actionable steps that enhanced overall performance.

The benchmark report provided valuable insights that helped clients understand current performance levels and identify areas for improvement. The clear and visually engaging presentation of data facilitated informed decision-making and strategic planning. The report was well-received, leading to actionable steps that enhanced overall performance.

Package Plans Development

Creating comprehensive package plans to offer tiered service options, catering to diverse client needs and budgets.

Creating comprehensive package plans to offer tiered service options, catering to diverse client needs and budgets.

  • Market Research

    Conducted thorough market research to understand industry standards, competitor offerings, and customer expectations. Analyzed trends to identify opportunities for differentiation.



  • Market Research

    Conducted thorough market research to understand industry standards, competitor offerings, and customer expectations. Analyzed trends to identify opportunities for differentiation.



  • Package Structuring

    Developed a tiered structure for the package plans, ensuring a clear progression of features and benefits across different levels. Designed packages to cater to varying client needs, from basic to premium services.

  • Package Structuring

    Developed a tiered structure for the package plans, ensuring a clear progression of features and benefits across different levels. Designed packages to cater to varying client needs, from basic to premium services.

  • Feature Selection

    Carefully selected and defined the features included in each package. Prioritized features based on customer value, feasibility, and alignment with business goals.

  • Feature Selection

    Carefully selected and defined the features included in each package. Prioritized features based on customer value, feasibility, and alignment with business goals.

  • Pricing Strategy

    Collaborated with the finance team to establish a competitive and sustainable pricing strategy for each package. Ensured pricing reflected the value provided at each tier.

  • Pricing Strategy

    Collaborated with the finance team to establish a competitive and sustainable pricing strategy for each package. Ensured pricing reflected the value provided at each tier.

  • Visual Design

    Created visually appealing and easy-to-understand package plan layouts. Utilized consistent branding, color schemes, and typography to enhance the overall presentation.

  • Visual Design

    Created visually appealing and easy-to-understand package plan layouts. Utilized consistent branding, color schemes, and typography to enhance the overall presentation.

  • Content Creation

    Wrote clear and persuasive copy for each package plan, highlighting key features, benefits, and unique selling points. Ensured the language was engaging and tailored to the target audience.

  • Content Creation

    Wrote clear and persuasive copy for each package plan, highlighting key features, benefits, and unique selling points. Ensured the language was engaging and tailored to the target audience.

  • Feedback and Iteration

    Gathered feedback from stakeholders and potential customers to refine the package plans. Made adjustments based on input to optimize clarity and appeal.

  • Feedback and Iteration

    Gathered feedback from stakeholders and potential customers to refine the package plans. Made adjustments based on input to optimize clarity and appeal.

Impact

The newly developed package plans provided clients with clear, attractive options that suited their needs and budgets. The structured approach and compelling presentation helped increase customer satisfaction and conversion rates. The tiered packages also facilitated upselling opportunities, contributing to revenue growth.

The newly developed package plans provided clients with clear, attractive options that suited their needs and budgets. The structured approach and compelling presentation helped increase customer satisfaction and conversion rates. The tiered packages also facilitated upselling opportunities, contributing to revenue growth.

Design System ⚛️

Having this, helps our developers to create consistent and better UI and user experience. This also made the development more productive.

Having this, helps our developers to create consistent and better UI and user experience. This also made the development more productive.

  • Research and Planning

    Conduct research on existing products, UI patterns, and industry best practices, while collaborating with stakeholders to define the scope and objectives of the design system.

  • Research and Planning

    Conduct research on existing products, UI patterns, and industry best practices, while collaborating with stakeholders to define the scope and objectives of the design system.

  • Component Library Creation

    Identify and design reusable UI components such as buttons, forms, and icons, ensuring they are responsive, accessible, and consistently named.

  • Component Library Creation

    Identify and design reusable UI components such as buttons, forms, and icons, ensuring they are responsive, accessible, and consistently named.

  • Define Style Guidelines

    Establish and document style guidelines, including a consistent color palette, typography, spacing, and iconography to ensure visual harmony across products.

  • Define Style Guidelines

    Establish and document style guidelines, including a consistent color palette, typography, spacing, and iconography to ensure visual harmony across products.

  • Design Documentation

    Create comprehensive documentation for each component, including usage guidelines, variations, and code snippets for developers to implement.

  • Design Documentation

    Create comprehensive documentation for each component, including usage guidelines, variations, and code snippets for developers to implement.

  • Collaboration with Developers

    Work closely with developers to ensure proper integration of design components into the codebase, and provide support during the implementation phase.

  • Collaboration with Developers

    Work closely with developers to ensure proper integration of design components into the codebase, and provide support during the implementation phase.

  • Version Control and Updates

    Manage version control for the design system, regularly updating and refining components as new needs arise or as feedback is received.

  • Version Control and Updates

    Manage version control for the design system, regularly updating and refining components as new needs arise or as feedback is received.

  • User Feedback Collection

    Gather feedback from designers and developers on the usability of the design system, and identify areas for improvement.

  • User Feedback Collection

    Gather feedback from designers and developers on the usability of the design system, and identify areas for improvement.

Impact

Implementing a design system streamlines the design and development process by providing standardized, reusable components and guidelines. This consistency enhances the user experience, ensures brand cohesion, and accelerates project delivery, ultimately improving efficiency and reducing errors across teams.

Implementing a design system streamlines the design and development process by providing standardized, reusable components and guidelines. This consistency enhances the user experience, ensures brand cohesion, and accelerates project delivery, ultimately improving efficiency and reducing errors across teams.

What I learned ☘️

  • After completing the project, I've learned the importance of understanding user needs and preferences in UI design.


  • Conducting thorough user research provided valuable insights into user behavior and expectations, which shaped the design process.


  • Ensuring designs are adaptable and functional across various devices and screen sizes highlighted the need for responsiveness and flexibility.


  • I discovered the significance of incorporating aesthetic elements like color schemes, typography, and layout to enhance both appeal and usability.


  • Maintaining a feedback loop by regularly gathering and analyzing user feedback proved crucial for identifying areas for improvement and refining the design.


  • Embracing continuous improvement and clear communication with users helped in making the design more effective and engaging.

Other case studies

Connect to Content

Add layers or components to swipe between.

Ready to turn your ideas into digital magic?

Let’s team up and create something awesome!

Ready to turn your ideas into digital magic?

Let’s team up and create something awesome!

Ready to turn
your ideas
into digital magic?

Let’s team up and create something awesome!

JIMWELL

A seasoned UI and UX designer on a mission to make an impact in the digital world.

My services

UI Design (Figma)

Website re-design

Landing page design

Website consultation

Follow

JIMWELL

A seasoned UI and UX designer on a mission to make an impact in the digital world.

My services

UI Design (Figma)

Website re-design

Landing page design

Website consultation

Follow

JIMWELL

A seasoned UI and UX designer on a mission to make an impact in the digital world.

My services

UI Design (Figma)

Website re-design

Landing page design

Website consultation

Follow

Create a free website with Framer, the website builder loved by startups, designers and agencies.