For a long time at Fiverr, Sellers did have basic analytics, but until now there had been no array of tools made specifically for the Sellers to help them do what they do better. Since joining the Web Design Team at Fiverr one of my first projects was to kick off the “Seller Tools” initiative by designing Seller Coupons. My role in this project was to lead all aspects of design (research, wireframing, prototyping, testing) working with the design team, 2 product managers, the UX writing team, the development team and UXR team.
- Improve the user experience for both Buyers and Sellers
- Increase repeat purchases
- Increase Sellers’ revenue
- Strengthen Seller & Buyer relationship
I started my research and discovery journey with a bit of reading. What I was stepping into here was a land of coupons, studded with its own nuances, ones that needed to be considered as this was the first time coupons were being baked into the product at Fiverr.
Among many other articles, this article by the Nielsen Norman Group gave me a great deal of information.
There is a nuance here that may be unexpected: Coupon fields, when empty, can actually decrease sales. Why? This is because some people will see it, and think “Oh there is a coupon discount for this! Maybe I will go look for the coupon on the internet” but to the dismay of many an e-commerce site, many of these users get distracted in the process, abandoning their purchase.
I looked at 10+ products and took detailed notes about what works and what does not about their flow, messaging/communication and UI conventions. Below, I would like to highlight two examples that stood out to me.
Amazon has Coupons, and when I thought about the naming (“Coupon”), I started wondering what differentiates Coupons from other discount methods on Amazon. I did some digging and found out that there are a total of four discount terms in use on Amazon:
We found ourselves with a very relevant conversation within the stakeholder circle. Whaddya call this thing? Is it a coupon, promo, voucher, gift card, sale or a discount? This is important to know early on because the messaging and thus the UX can differ greatly depending on the terminology used.
AliExpress is saturated with promotional elements. One of the first things that pops up when you enter the website is a pop-up with a promotion of some kind. AliExpress takes their promotions seriously.
Naturally, it makes sense that they offer the option to select other coupons that I’ve clipped. I thought this was extremely necessary considering how promo-oriented AliExpress is.
At the time, Sellers did not have the Coupons feature, so they would stick to messaging Buyers after their order is complete with a coupon-like offer. Buyers for their part, had these “Come back soon!” messages, as well as Fiverr promotion codes from Marketing or Customer Support.
The problem with this scenario is that not only can it be confusing for both the Buyer and Seller, but so much more value can be created out of an opportunity like this. From the Buyers’ point of view, the computer should intuit when the best time to use the coupon is and offer it to them. For the Seller, a lot of knowledge can be gleaned regarding coupon usage if only it was a part of a more self-aware process.
Since this project started as a proof of concept, I used live-elements in all stages of design. We went through an iterative process that looked something like this:
In addition to an email from Fiverr, Seller’s saw a notification that included the value proposition and call to action.
Upon clicking on the notification, the Sellers land on the Coupon dashboard. Here, they can create and manage their coupons.
The Seller creates their first coupon
Sending, as well as receiving a mass-produced coupon might feel impersonal. To make the interaction feel more personal, we decided to add an optional custom message from the Seller.
At this point, the Buyers receive the Coupon and have an added incentive to return. Let’s take a look at the flow from the Buyer’s point of view.
The Buyer uses the coupon on an order
Since the Buyer might be accustomed to using the Seller’s Page for picking gigs on the fly, we wanted to show a message (toast) above the gigs so that the Buyer can see it in context.
Clicking into a specific Gig, the Buyer sees the toast notifying them about the coupon here as well.
Checkout is a very vulnerable time for e-commerce contexts (general note). Coupons can add to the already-vulnerable situation. During my research I learned that an empty coupon input might actually cause a drop-off due to users going to look for coupon codes. So in this case, the coupon is auto-applied at checkout.
In the event that the coupon is removed (the Buyer might want to save it for another, larger purchase, for example) the Buyer can see how to re-apply this as well as any other coupons that are applicable.