Project
My Role
Reporting Screens are where users track and manage their campaigns in Adphorus. It was one of the pain points of our platform, as users needed more flexibility, customization functionalities in a simpler interface.
​
As we started rethinking the Adphorus Reports tool, we listened to client feedback and kept the end-user front of mind. We were focused on concerting a user-friendly and fully customizable interface that allows campaign managers and decision-makers alike to seamlessly analyze and understand the results while continuously optimizing performance. We considered how our clients' marketing team will be leveraging a Reporting Loop to maximize the potential of their data.
​
​
I led the user research, analysis, and testings, UX & UI processes, producing all deliverables and presenting these to stakeholders and the rest of the team. I worked alongside a Product Manager, Product Marketing Manager, Product Analyst, UI Designer, Icon Designer, and Web developers.
Brief
Challanges
It was aimed to develop a more sophisticated yet intuitive reporting tool that could serve each advertiser’s particular use cases. In other words, customization and flexibility should have been a priority so that the tool’s capabilities do not detract from but rather facilitate the learnings that an advertiser is seeking.
With the rising complexity of travel advertising and the proliferation of new Facebook products, advertisers demand increasingly in-depth reporting capabilities. Meanwhile, the value of reporting exceeds any individual output. Sophisticated reporting capabilities ensure that users are informed in a timely manner and can effectively analyze the results. Our clients must then be able to translate your reporting efforts into actionable insights as quickly and effectively as possible. And, finally, the marketing teams of our clients should be sharing their insights to continually optimize and improve performance. The end result is a continuous Reporting Loop.
​
The main challenge was to understand the nature of reporting through the eyes of the actual users, develop a tool that supports the needs of power users with an intuitive tool that does not give hard times to new users as well.
Lean UX Design Approach
Lean UX, based on the foundation of Agile development, is a user-centric approach that focuses on reducing the waste produced during the design cycle and enhancing the UX through multiple iterations without spending much time on documentation.
​
We adapted the aspects Lean UX framework to redesign our reporting tool.
Build
Measure
Learn
Iterate
Lean UX Process
Wireframing
Briefing
User Research
User Analysis
Storyboard
User Scenarios
Conceptual Model
Sketch Work
Brainstorming
Use Cases
Work Flow
Information Arch.
Site Map
Screen Wireframing
Major Interactions
Getting quick &
frequent feedback
from
- CS Team
- Product Managers
- Tech Team
Visual Design
Interaction Design
Style Guide
Screen Mockup
Prototyping
Getting quick &
frequent feedback
from
- CS Team
- Product Managers
- Tech Team
Client Meetings
A/B Testing
Analytics Tools
Event Tracking
Feedback System
​
Plan & move
to the next cycle
Ø1
Ø2
Ø3
Ø4
Ø5
Ø6
Ø7
Iterating
Testing
Externally
Validating
Internally
Validating
Internally
Prototyping
Planning &
Discovering
Ø1 Planning & Discovering
The first phase included briefing, the planning execution & analysis of the user research, creating user scenarios & flows. I worked closely with cross-functional teams, getting & sharing feedback frequently.
User Research
Briefing
Brainstorming
Technical Specs
Product Managers
Research Planning
Determining the scope of
User Research & UX Methodologies
Customer Success Managers
Tech Team
Data Analysts
Collecting User Feedbacks
Qualitative & quantitative data gathering
Analysis of Data
Data Planning
User Scenarios
Storyboards &
Combining user data
with tech specs
Creating user scenarios & flows
Research Planning
Research planning is the phase to determine the strategy of user research & analysis. In the research planning phase, I defined the topics we need to address and conducted brainstorming sessions to answer the questions under 4 different topics.
Research Goals
Why we are conducting this research?
What kind of data we are trying to collect?
Methodology
What research techniques are the most suitable for the project?
Schedule
What is the deadline for the project?
How much time do we have for research & tests?
Scope
What is the scope of the research?
​
User Research
After the detailed planning of the research, I started collecting qualitative data from our Customer Success Team, who are always in touch with our users. All negative and positive feedbacks and insights were collected and categorized. Next, with Product Managers and Analysts, we carefully investigated former feature requests related to reporting tool and categorized them, by combining the requests that came to our Customer Success Managers. For quantitative data, I worked with the tech team & Product Analysts to collect former session data, such as durations, click numbers, error message numbers, etc.
​
Next, we arranged interviews with our clients that were actively using our platform. 15 hours of field interviews, online surveys with 50 users and 18 hours of session recording watching were completed as a part of our user research phase.
​
Analysis & Documentation of User Research
In order to define pain points and improvement areas, all the collected data was carefully analyzed, categorized, and documented. Below, a part of our documentation can be seen.
Ø2 Concept Creation & Wireframing
Basic use cases & user flows
Use Cases & Workflow
Wireframing
High fidelity screen wireframing
Information Architecture
Content Inventory
Page Content Finalization
Defining Functionalities
Site Maps / Categorization &
Prioritization of Functionalities
Major Interaction
Defining the major interactions
Brainstorming about what
other interactions are needed
This phase included defining use cases & work flows, forming information architecture, designing high-fidelity screen wireframes and defining the major interactions that crucially affect the user experience and guide the UI process.
Use Cases & User Flows
In order to define functionalities, use cases and user flows are created. Below, a user flow for creating a report can be seen.
Information Architecture
Site Map
After creating use cases & user flow​s, I created basic site maps to demonstrate the different screens based on different action groups and their connections.
Defining Functionalities
Combining use cases, user flows, and site maps; the main actions users would take, the basic categorization of action groups, and their distribution in different pages started becoming clear.
Next, for each screen, all the functionalities and actions are listed and categorized to shape the layout of the page before producing wireframes. Below are the defined functionalities and their categorizations for Report Detail Screen.
Wireframes
I combined all the data gathered, and the deliverables I created, to design detailed high fidelity wireframes showing every possible flow, for both review meetings with other teams & guiding the UI Designer.
When wireframes are completed, I defined major interactions, that would affect users' experience of the tool. By highlighting the major interactions, the UI designer focused more on the features with pain points and create the best interaction solution.
Ø3 Validating Internally
After designing wireframes, feedback sessions across different teams are done for validation. I gathered feedback from Product Managers to check if wireframes covered specs, from the Tech Team to check if there was any technical constraint, from the Customer Success Team to be sure if all user needs & expectations are covered for MVP, and the Product Marketing Manager for checking wordings & tone of voice.
​
After all these sessions wireframes are revised and prepared for UI Design Process.
​
​
Ø4 Prototyping
The prototyping phase included ​all Visual & UI Design work. My responsibility in this step was checking if screen designs were coherent with the style guide if all minor and major interactions are designed, briefing Icon Designer for icons needed in the tool, and making sure if the Icon Library is up to date, and delivering final designs to front-end developers.
​
​
​
Ø5 Validating Internally
When the UI process was done, my responsibility was to check it first with Product Managers and then with the Tech Team if there are any components that are not in or suitable to Style Guide. After the front-end work was done I validated the interface, to check if everything is correctly applied in front-end in terms of both UX & UI.
Ø6 Testing Externally
As the coming from the nature of Lean UX Design based on learning after releasing an MVP, before planning any improvements or releasing version 2 of the tool, we tested our tool on our clients. We arranged customer meetings with 25 users to gather their feedbacks after they use the tool. For showing breakdown results in table, we designed 2 different designs and conducted an A/B Test on different users. We reorganized our events to be sen on the new tool, to track relevant and detailed data for V2. All the data is updated in our Feedback documents, with the insights coming frequently from our CSMs.
Ø7 Iteration
Last but not least, we iterated the whole process to release V2!
Research
Proposed Solution
Proposed Solution
Ø1
-
Research
-
Competitor Analysis
-
Defining Goals
-
Workshops for concept creation
-
Reconsider the current approach
-
Creating concepts by combining research results and user goals
Ø3
-
Creating an onboarding flow and screens by combining best practices, psychological effects, project goals & user goals
Proposed Solution
Ø1
-
Research
-
Competitor Analysis
-
Defining Goals
-
Workshops for concept creation
-
Reconsider the current approach
-
Creating concepts by combining research results and user goals
Ø3
-
Creating an onboarding flow and screens by combining best practices, psychological effects, project goals & user goals
Ø2
Research
Proposed Solution
Ø2