
AI ad manger
AI Ad Manager is an AI-driven advertising platform tailored for B2B use, designed to streamline the advertising process and maximize effectiveness for clients' advertisers.
I collaborated with other 2 UX designers in this project, delivered the defined user flows, hi-fi prototypes for vision through working closely with a cross-functional team.
Duration
8 months
My Role
UX Designer
UX Researcher
Team
3 Product Designers
2 Product Managers
2 Product Ops
4 Developers
Awards

Overview
The client is a social media platform with 200 million user base, they established an advertising platform for revenue generation and traffic monetization. However, the current advertising revenue is lower than expected and has hit a bottleneck.
The Problem
Advertisers need to invest a substantial amount of time and effort in the exiting ad system, adversely affecting both ad revenue growth and ad effectiveness.
Design Outcome
We designed an all-in-one ad platform powered by AI and machine learning, which streamlines the advertising process, saving time and costs while maximizing effectiveness.
Swipe me to check the before and after views
Understanding The Context


User Research Process
To identify users' needs, we decided to dig deeper with some primary research, using surveys and interviews.

Research Insights
After conducting the primary research, we analyze the data to identify common themes and insights.

User Journey
We subsequently developed a user journey map to pinpoint crucial touchpoints where users engage with the system. This allowed us to identify areas for enhancement throughout the advertising process, ensuring a better alignment with user needs.

Painpoints & Opportunities
Based on the pain points identified at each stage, we transformed them into design opportunities.

Learn from competitors
After analyzing some trendy ad platforms, we found that while these platforms made innovations, they often suffer from complex user experiences in terms of interface design or workflows. Especially for non-expert users, the overwhelming amount of data and intricate workflows lead to info overload, making it difficult to quickly adjust strategies. Therefore, the differentiating factor of our ad platform lies in simplifying the user experience through intelligent analysis and automated optimization tools, reducing cognitive load and enabling advertisers to efficiently manage ads and make data-driven decisions quickly.

Brainstorming
We brought all our designers together for an internal brainstorming session. following the generation of numerous ideas, I facilitated a workshop to deliberate on the priority features to be included in our project. The participants encompassed the PM, Po team, and Devs. Subsequently, we collectively prioritized the features based on considerations such as time frame, development difficulty, and feasibility.

Create 2.0 IA
Following our previous design decisions, we have developed the information architecture (IA) for Ad Manager 2.0. This IA aims to ensure a clear and organized layout, as well as a well-defined hierarchy.

Low-Fi & Hifi Explorations
Below are examples of the low- and high-fidelity prototypes we developed. After multiple rounds of internal discussions, user testing, and iterative refinements, we finalized the design based on user feedback and team alignment.

Iteration examples based on feedback
We've fixed numerous UX issues uncovered during several rounds of user testing. Here are a few examples that I handled:
1. Revamping the AI Copy Feature
Based on user feedback, I redesigned the AI Copy feature, which was initially created to assist advertisers in generating effective ad copy when they face writer's block or struggle with content creation. However, users found the process too time-consuming when managing multiple ads. In response, I streamlined the experience by enabling the AI to generate ad copy options with a single click, enabling users to quickly choose or modify suggestions, saving time and improving efficiency.



Before: A chatbot to generate ad copy options




After: an AI editing feature to enhance ad copy
2. Enhancing Ad Status Visibility
In user testing, I found that most users closely monitor ads that are in a pending status and proactively contact the PO to identify the issue, ensuring they don’t miss the campaign deadline. However, in the current ad list, there is no distinction between pending ads and other types of ads in terms of presentation. With the support of the project manager, I implemented the following design improvements:
1) Introduced color-coded labels (e.g., yellow for pending ads) to help advertisers quickly identify high-priority campaigns
2) Added pop-up progress notifications for pending ads to inform advertisers of the current status, allowing them to detect delays early and take action before the deadline

Before: the ordinary campaign list


After: A campaign list with color-coded labels & ads progress





Final Solution - Welcome to the 2.0 AI ad manager

01. Quick Overview of Account Performance
A dashboard enables the advertisers to quickly get the trend and situation of the account and make the decision and strategy accordingly.




02. Customized Report Experience
Users no longer need to search through heaps of data, customize report feature enables them to select specific metrics, generating tailored reports to meet their needs. This enhances efficiency, freeing up time for strategic analysis while ensuring accuracy and scalability

03. AI support for Ad copy
The AI edit provide support users in modifying and polishing ad copy as needed, completing the enhancement process quickly. Not only does it improve the quality and appeal of the ad copy, but also saves users costs and resources



04. Smart AI guidance
AI Ad Manager provides real-time AI guidance to users during campaign creation, empowering informed decisions and optimizing performance efficiently



Performance & Impact
63%

Boost in Task Efficiency
98%

Increase in User Satisfaction
68%

Increase in Task Completion Rate
Final Design

Video Walkthrough
Relection
“Small Details are a Big Deal”
This phrase encapsulates one of the most profound realizations I've had throughout this project, and it echoes the wisdom imparted to me by my mentor. As I reflect on the journey of this project, I've come to understand the immense significance of even the smallest elements. Whether it's the precise font size, the subtle nuances of color contrast, or the seemingly trivial placement of buttons, each detail plays a pivotal role in shaping the user experience.
Through the course of this project, I've learned to approach design with a meticulous eye for detail, recognizing that every pixel matters. By prioritizing the refinement of these small yet critical elements, I've been able to elevate the overall quality of the user experience. Moving forward, I will continue to embrace this philosophy, understanding that it is often the small details that make the biggest difference.