Action Center
Overview
The goal of this project for Marktplaats Pro was to design a feature to help users keep their advertisements performing well and online.
I was put in charge to ensure that we launch a feature that met both business and user goals, and that it was implementable from a technical standpoint. I took charge of this project mid-way, and through the process Usability Testing, Iterating and Materializing we were able to launch a proof of concept.
Role
UX Designer
UX Design - UI Design - Usability Testing - Developer Handover
Main Highlights
#1
Usability Testing identified major problems that needed to be addressed before launching
#2
Iterating through potential solutions revealed clear ways into solving these problems
#3
Feature was launched to ~800 users, which performed very well with a 25% coversion rate
First things first, what are we building?
The Action Center was proposed a one-stop-shop where users could come and fix their advertisements, either because of budget problems or performance problems.
The reasoning behind it was that users are not aware that their advertisements have used up their budget or that they are performing badly. Through this Action Center we wanted to direct our users attention to certain actions they would need to perform in order for their advertisements to have the best performance.
Design Document
The information was scattered that I decided I needed to create a source of truth for all the information I might need. For this I had to discuss with various stakeholders about the project, and go through various documentations in order to fully understand the purpose of this feature.
This led me to creating a design document where I would have all the information required and I could easily track the progress of the project.
Usability Testing
As I was handed an already existing design with a project plan in place, the first step was to conduct Usability Tests. Therefore I organized these sessions in order to validate whether this new feature would actually solve the core problems.
While the users were very open to the idea of having a 'one-stop-shop' where they can take actions in order to improve their advertisements, the feature's design was very confusing for them.
The prototype we tested looked something like this...
The results we got looked something like this...
Some of the major problems we identified were these...
"
'Set all to Auto' is scary. I'm not sure what's going to happen with my advertisements after I press this button
"
My first instinct is to fix the budget of each advertisement in particular instead of updating them all at once
"
I am missing the link between the Action Center and my advertisements. I'm not sure which advertisements I'm updating.
"
I don't know which ads I'm updating once I press update, I need to have a better overview
"
I'm not sure how this affects my old budget settings. Are they gone completely? Will they come back?
"
I'm scared to set them all to Auto. Will it use all my budget?
After going through all the results, we identified three major recommendations
#1
Give users more clarity about which advertisements they're updating
#2
Allow users to update advertisements both individually and in bulk
#3
Showcase to users how the budget for their advertisements will be changed
Iterations
After the Usability Testing I started sketching and creating some very quick designs in Figma to try and understand how we could best solve the problems encountered during our testing.
Quick brainstorm sketching and designs to fix issues identified during the Usability Tests
Recommendation #1: Give users more clarity about which advertisements they're updating
One of the biggest problems we identified during our usability tests was that users were scared to take certain actions because it wasn't made clear how this would affect their advertisements.
Therefore, one solution would be to show the users the advertisements that will be affected by their actions.
Recommendation #2: Allow users to update advertisements both individually and in bulk
Users also expressed the fact that they would like to have the option to update their advertisements separately, as different advertisements require different budgets.
Giving the user their three most urgent advertisements and an option to view all advertisements that require their attention would address this recommendation.
Recommendation #3: Showcase to users how the budget for their advertisements will be updated
Users were extremely confused on how the budget for their advertisements will be updated, and would make them very hesitant to update the budget from the Action Center.
Showing the user the current status of the advertisement and the new budget as a result of their action would alleviate this problem and give users more clarity.
What we shipped
Due to time constraints and because we wanted to see how this would perform as soon as possible, we decided to ship a Proof of Concept with only some of the features mentioned above.
Both a mobile and desktop solution were shipped.
Action Center
Give the users a quick overview of the most urgent advertisements that require their attention, with a very clear label on what needs to be fixed.
Update Budget Dialog
Reinforce the same message when they select their new budget, ensuring they understand which advertisement they're updating and what its current status is.
Confirmation Dialog
Confirm that everything went as expected and that their advertisement is back online, reinforcing the advertisement name and new budget.
Developer hand-off
The final designs were presented to the developers before hand-off in order to see if there are any technical limitations that we should consider.
After a presentation to the whole team on the final designs, I prepared the developer hand-off for the following sprint.
Results and Challenges
Launch
The feature was launched to a small subset of our user base, which was around 800 users.
It was received very well, having a 25% conversion rate, with plans to expand it to multiple users and more features.
Challenges
As is the case with many projects, this one was not without its challenges. Some of the challenges that I had to overcome were:
I joined mid-way and I was handed the project to guide it to a feature. I had to get up to speed fast with the company and the project itself.
There was no time to ask questions to make sure we're building the right thing for the right reasons, therefore I had to take it and ensure it's implemented in the best way possible.
As I joined, a lot of information was scattered between people and written documents, therefore I took upon myself to create one source of truth that we can refer to in case we needed to.
Next steps
The next steps for this project included:
Launch to a larger user base
Include more features such as bulk update and other types of actions
Implement a separate page where users could see all their actions and take the required steps to ensure they get the most out of their advertisements
