Agency Box

White-Label Digital Marketing Platform

UI/UX Design
July 27, 2024
4 Weeks

About

AgencyBox is a comprehensive white-label solution designed for digital marketing agencies. With over 4,500 agencies utilizing its services, AgencyBox aims to simplify service fulfillment and facilitate business growth without the overhead. The platform replaces multiple tools, offering streamlined, automated fulfillment to enhance productivity and efficiency.

Challange

Users reported difficulties navigating the platform due to poor information architecture and confusing navigation. Additionally, user research indicated a strong demand for educational resources and support features to help agencies maximize their use of the platform.

Goals
  1. Improve Information Architecture: Simplify and restructure the platform’s layout to enhance usability.
  2. Enhance Navigation: Create an intuitive navigation system that allows users to find information and complete tasks efficiently.
  3. Integrate New Features: Add educational resources and support features based on user feedback to improve user engagement and satisfaction.

Results

Trough our process, we successfully made:

  • UX Research
  • User Flows and Architecture
  • Wireframe Design
  • App Prototype Design
  • Marketing Website

Context

In this project, I held dual roles, serving as both the UI/UX Designer and Project Manager. My responsibilities spanned the entire process, from initial discovery calls to the final demo presentation. I collaborated closely with stakeholders and investors, ensuring that their needs and expectations were integrated into every stage of the redesign.

As the UI/UX Designer, I was in charge of revamping the platform's interface and user experience to address issues with information architecture and navigation. This involved conducting thorough research and analysis, developing new information structures, and creating detailed wireframes and prototypes.

In my capacity as Project Manager, I coordinated all project activities, managed timelines, and facilitated communication among team members. I led the project through its structured stages, from research and analysis to structuring, wireframing, and UI design. By maintaining clear and consistent communication with stakeholders and investors, I ensured that their feedback was incorporated into each iteration of the design.

No items found.

The Process

The process began with in-depth research and analysis, including discovery calls with stakeholders, a platform audit, and a heuristic evaluation to identify pain points. This was followed by restructuring the platform’s information architecture to create a logical and user-friendly layout. The next stages involved developing detailed wireframes and user flows, iterating on feedback, and crafting high-fidelity wireframes that aligned with the new architecture.

The final UI design phase included creating a style guide, exploring visual mockups, and developing a high-fidelity prototype for usability testing. Throughout the process, user feedback was integral, ensuring the redesign not only resolved existing issues but also integrated new features like educational resources to better support and engage users. The culmination of these efforts was the creation of a design system to ensure consistency and efficiency in future development.

Research and Analysis

During the Research and Analysis phase, I undertook a comprehensive examination of the existing AgencyBox platform to identify key usability challenges and areas for improvement. This process began with discovery calls involving stakeholders, where I gathered insights into their goals, pain points, and user feedback. I then conducted a detailed audit of the current platform, scrutinizing its usability, navigation, and content structure.

Structuring

I began by creating a Defined Project Booklet, which documented the project's scope, objectives, timelines, and deliverables, ensuring alignment among all team members and stakeholders. With a clear project outline, I developed a new platform architecture that logically grouped content and features, making it easier for users to find and access what they needed. This involved designing site maps and content hierarchies that reflected user tasks and workflows.

After drafting the new structure, I presented it to stakeholders and users for feedback, engaging in discussions to gather insights and make necessary adjustments. This iterative process ensured that the new architecture was both intuitive and aligned with user expectations, setting a strong foundation for the subsequent wireframing and design stages.

Wireframing

The Wireframing stage was crucial in translating the restructured information architecture into tangible design concepts. I started by mapping out detailed user flows to ensure seamless navigation and task completion, identifying key touchpoints and interactions. Next, I developed low-fidelity wireframes to visualize the basic layout and functionality of the platform, focusing on structure without detailed design elements.

These wireframes were presented to stakeholders and users, and I collected feedback to refine and iterate on the designs.

Once the foundational layout was solidified, I progressed to high-fidelity wireframes, incorporating specific design elements and interactions that aligned with the new architecture and user flows. This iterative approach allowed for continuous improvement based on user feedback, ensuring that the wireframes effectively addressed usability issues and met the project’s objectives.

The Product Design phase was where the platform’s visual and interactive elements came to life, transforming wireframes into a polished, user-friendly interface. I began by creating a comprehensive style guide that defined the platform’s visual language, including typography, color schemes, button styles, and other UI components, ensuring consistency and a cohesive user experience.

With the style guide in place, I designed multiple mockups to explore different visual approaches, gathering feedback from stakeholders to select the best design direction. This collaborative process led to the development of high-fidelity prototypes that accurately represented the final product. The final design was a result of iterative feedback and testing, culminating in a visually appealing and highly functional platform.

Conclusion

Finally, the Product Design phase brought the vision to life with a cohesive visual language, high-fidelity prototypes, and a robust design system. This user-centered approach not only addressed the platform's initial pain points but also introduced valuable new features and educational resources. The result was a streamlined, intuitive platform that enhanced user satisfaction and engagement, positioning AgencyBox as a more powerful and supportive tool for digital marketing agencies.

Previous project
RVS Keuken
Next project
Voolu