Omni-channel makes platforms more addictive

Project Summary

Carousell is a classifieds app that launched in 2012 on iOS and Android. The web platform came a few years after, with a web version of listings to browse online at first. While taking photos was easier on the phone, writing descriptions and managing listings may be quicker with a keyboard on hand. Expanding to a full-featured web app created more opportunities for people to start buying and selling.

The web app went online in 2015, and was announced in November. Prior to the announcement, it has received 140 million web views and has grown since. In 2016 more than 10,000 listings were added through the web app per day.

My Role

I was responsible for designing the user experience and interface of the web platform, following the brand set by one of the co-founders. I was also in charge of user testing and design deliverables.

 

The Problem

How can we increase user engagement time on our platform?

As a mobile-first company, the mobile app was perfect for some contexts. It’s a convenience to start a seller’s journey on mobile: the phone is all a person needs to take a photo and post a listing. But when people have to sell more items or reposting week-old listings, writing or copy-pasting descriptions starts to slow down that buy-and-sell process. Finding items out of thousands is also easier on a bigger screen.

An omni-channel experience, where a person can start a task on any platform and seamlessly switch between mobile to web and vice-versa, may be the ideal solution for our problem.

A Minimum Viable Product

At a minimum, buyers and sellers should be able to use the web platform to browse and search listings, post listings, and send and receive messages. This included user profiles and account management. Sellers can start their process buy snapping photos on their phones and editing that listing on the desktop web for easier management. Buyers can start chats or offers on their commutes and close deals when they’re on their desks.

As a team, we had to consider the breadth of the product features and the limited time and resources we had. We decided to focus less on the visual design and focused instead on features, ease of use, and speed.

The team identified features that would be harder to build (such as real-time messaging and notifications) and given our constraints, we decided to build a traditional web app (instead of single-page) with Javascript to improve the user experience. For design, the focus was on utility and usability over desirability.

 

Design Process

We had a minimum set of features to build upon release and the web experience had the advantage of more screen estate and a different context from mobile. These were the considerations I had when approaching our web experience:

  • Focus on the customer needs for desktop use.
  • Leverage the familiar (current e-commerce and messaging experiences).

Design for Findability

Buyers and sellers should be able to complete their tasks and reach their goals on the website. Icons should inform, not confuse.

On the mobile apps, categories were a laid out in tiles on a screen, I wanted to make it easier for buyers to find a category from a list. With this goal in mind, I labeled the 21 categories that the marketplace had at that time.

Category Menu on Web V1

Design for Consistency

Messaging and experience should be consistent on all platforms. Labels on the web should be the same as on mobile.

Design for Context

Designs should be tailored for user needs at specific moments.

On mobile, sellers are snapping photos with their phone camera and buyers are browsing listings on their commute. Both are chatting, haggling, and replying to messages on the go or meeting up to buy and sell. With the desktop web, the experience should be focused on optimizing a browse and listing experience. Search and filter should be faster and easier because they can view multiple listings with tabs, and it is more convenient to type listing information with a keyboard.

One of the key considerations we made was to design messaging as an inbox instead of a chat-like UI to set user expectations that it may not be “real-time” messaging. The mobile web was also designed to be focused on certain tasks and contexts due to less screen space.

Chat and Inbox on mobile vs. desktop web

I designed screens using the Sketch App and ideas were prototyped in HTML/CSS/JS (and on the browser) to be able to communicate efficiently and build quickly as I collaborated closely with the engineers.

User Testing

User testing before the official web launch

We were able to test only internally prior to the launch, pulling in three interns to test the web app. I prepared tasks for the participants and recorded the screen and session. At the end of the sessions, we were able to identify a poorly designed interaction and change it before the launch date.

2/3 testing sessions showed users clicking on “Search for a user instead” even when the search box is empty.

We also gathered feedback from other teams who would use the web platform (particularly our Customer Support and Community teams who would use the web version of the app for their tasks). An experience with more dense content was considered to be better, which influenced the design changing from a 4-column product grid to 5-columns in order to show more products. While some e-commerce sites favor bigger images for better visual impact, it was more important to see as many search results as possible for our product.

 

Launch

Although the web app was made available online months before the press release, it was announced in November 2015. Although we had little resources, user engagement kept increasing on the web, and the site ranking in Singapore grew from more than 1,000 to #31.

In 2016 more than 10,000 listings were being published from the web daily. We received stories from users about using Carousell at work because it was now accessible on desktop, so much so that a company banned the site to prevent their employees from being distracted. It was a sign of success because we were able to build an experience that let our customers fulfill user goals in all channels.

 

Evaluation

Although adoption is fast in mobile devices, there was a lot of potential for the web platform because it is easier to multi-task and accomplish tasks faster with a wider screen estate. With the limited resources we had during that time, I was not able to push the visual design to the best of my ability. In the end, while I was quite dissatisfied with how it looked, everything worked as intended and users were able to achieve their goals on the new platform.

There was not enough time to completely focus on improving the desktop experience due to other features built across platforms. As the designer for all three (iOS, Android, Web), I felt that I was always sacrificing time I needed to polish the design in order to make sure we were shipping regularly, gathering feedback, doing research, and planning and prioritizing. When an opportunity arose, I would include smaller design tweaks or UX improvements with the other future sprints.

The Web Post-Launch

After a successful web launch, engagement on the platform kept growing. We improved some of the UX or design when new features were launched, and on the engineering side they optimized for speed to give better experience. Features built into the web later on included a more robust filter system, a redesign of the sell form, a “Groups” section, and eventually the addition of subcategories.

In 2016, the company started collecting more data from activities made on the web platform. This included distinguishing listings published from the web compared to mobile, tracking filters, and other user behavior.