Rebuilding a new Home experience
Company—Wattpad
Role—UI/UX Design + Discovery
Tools—Invision, Sketch, Zeplin
Platforms—Web, Android, iOS
Timeframe—Jan-Aug 2019
Testing—User interviews, surveys, D&A
OVERVIEW
Wattpad is an international social reading and writing platform, home to over 80 million monthly active users.
So why redesign the Home experience?
Being on the Content Discovery squad meant we were constantly working on optimizing the best ways for people to find stories. The first way they really do this is on Home. It's the first impression, it's where we gain early signals into their interests, it's what welcomes them for the first time and what welcomes them back the second and third times.
But we had a lot of problems with Home from a technical perspective. Home was built on *cue dad joke* shaky foundations (ha!) which made it hard to make any kind of change on it. So we decided to rebuild it from the ground up.
Old Home and Browse categories on Android
Old Home on Desktop Web and Mobile Web
Where we started
1. Understanding User Problems
Started with defining the Reader Journey of highly engaged users and new users. We then pulled historical data and held qualitative in-person interviews with 10 Wattpad/Non-Wattpad users to identify problems on current home and quantified our findings by surveying 290 readers, 450 writers and 755 users from our community forums.
2. Understanding Business Needs
Held stakeholder interviews from other departments across the organization to understand our business needs and where Home's role could play a big part.
3. Understanding Technical Constraints
Ran exercise with every member of the Content Discovery Squad to outline technical problems from iOS, Android, Web and Platform.
Hypothesized Reader Journey
Home's got 99 problems, literally
User Problems
Content Perception
- People see content that makes them feel like they do not belong because there was the perception that Home only surfaces ‘popular’ content which are teenfic, fanfic and romance (not everyone's jam)
- In our survey, we found that the #1 complaint among Writers and Forum Members was that Home only promotes popular stories.
Lack of Content Control
- People find that they have very little to no control over the content that appears in Home.
- For Readers, the #1 complaint was that Home gave them no control to dismiss stories they don’t like.
Content Freshness
- People struggled to find new and undiscovered content and find that content constantly repeats, even the UI was stale and everything looked the same.
Lack of Context / Meeting Expectations
- People don’t understand why they were seeing the stories they were seeing and what was driving the recommendation.
Business Needs
Wattpad needed the ability to prioritize/merchandise which stories take the top spots when being featured on Home, so that we could maximize revenue and help create the next top IPs.
- Examples: how readers find paid stories, creating space to promote up-and-coming Studios Hits (stories adapted to print, TV and film).
Tech Contraints
Home was built with modules (rows of content), but ironically was not modular. It called a bajillion different services which made any change difficult and any experiment long. One of our engineers described working on Home feeling like a game of Jenga. "You take one piece and the whole thing topples over."
Some technical themes that came up were:
- Overwhelming Tech Debt
- Lack of Measurability & Accuracy
- Scalability & Automation
- Flexibility & Extensibility
Where we iterated
We had to balance a few needs and goals, that of our users and of our business. We were looking at simplifying the story rows, and decluttering the information to make stories more attractive and easier to browse. We were trying to figure out how we could make room for featured and curated stories in a world of personalized recommendations. We were pushing for an opportunity to incorporate the community and gain access to contests. We were exploring ways of promoting our Premium offering as well as our quality Paid stories. All while still maintaining a sense of delight and community. At the end of the day, we wanted Home to feel like home.
Where we refined
We explored many design iterations for what a long term vision would look like of Home that could solve all of the above problems. We then focused on the Day 0 user/Day 7+ experiences considering we were looking at improving the experience for new and existing users. We then worked on defining vertical slices* to ensure we were delivering small pieces of value with every release of New Home.
*Vertical slice is an agile term that includes changes to each architectural layer (UI, Services, Database) sufficient to deliver an increment of value
Our Vision
Home should make you feel feel seen, appreciated, and a part of the Wattpad Community. Because stories power Wattpad, and community is built through those stories.
Where we landed
Launched Version 1 at the end of August 2019 to 30%* of Wattpadders on web (desktop + mobile) and Android. We wanted to roll this out in a careful way to catch any bugs before launching to 100%.
*Users from: Philippines, Australia, UK, Ireland, South Africa, New Zealand, Argentina, and India. The 30% of Wattpadders who see the new home will be randomly assigned into that experience.
All features below are included in Home v1:
Better Wattpad HQ Communication
The Featured Carousel at the top shares important information and highlights some of the stories we love from the Wattpad community and our Wattpad Stars. Users can discover new authors, or news on their favourite story becoming a movie, TV show, or book through Wattpad Studios and Wattpad Books. They'll also hear about the latest news and updates from Wattpad HQ, including product changes, new programs, and more.
This tackles the issue of content, both in terms of belonging as well as freshness. Belonging in the sense that you will see more news from the community to get a feel for who is on our platform. And Freshness through new things being featured and announced which gives Wattpad that sense of activeness and excitement.
New UI for Stories, Whodis?
Everyone judges a book by it's cover. Our research showed that as well, which is why we designed two different ways to highlight the amazing stories you can find on Wattpad to keep things simple, yet intriguing. We wanted to balance out emphasizing the covers of some stories while providing a sneak peak with a description in others.
The two story UI designs alternate randomly which tackles one of the user problems around content freshness and also refreshed the overall look of Home. We also improved our recommendations to ensure no duplicate/repetitive stories.
Browse tag/categories in Search
Browsing tag and categories is now housed within the Search bar for convenience, as the old categories were a little harder to find.
The Browse page for tags/categories got a visual refresh, using illustrations to bring these genres to life in a fun and dynamic way. It also makes it easier for users to quickly decipher between the categories now that they have illustrations vs the old list of static words.
v2 Features
Community + Contests
Users will see more of the Wattpad community pop up in more places like through quotes from their favourite readers, authors, and stories they'll see sprinkled throughout the feed.
They will also be able to easily find out what Wattpad Writing Contests are running, what the prizes are, and how they can enter. This was to solve a transparency problem around contests for both users and the business because we do have a lot of sponsored writing contests.
Content Preferences
To tackle the big problem around Lack of Control, we've added some new settings to allow users to really tell us what they want to see in their Home recommendations.
They will be able to block certain story tags, meaning stories with those tags will not appear in their Home experience any more. They can also decide if they want to see Mature stories or not. Finally, they can select the language of the stories they want to appear in their Home.
We're hoping to gain a lot of signals from these settings in order to better recommend stories in Home. In the near future we will also be exploring ways to dismiss stories directly from Home.
More Shipping and Less Shipwrecks
The biggest change (obviously aside from the UI) is the fact that new Home was much more flexible code-wise for our Engineers to update and work on. We actually rebuilt the services, and backend stuff from scratch.
This means Home can continue to be refined -- making additions that reflect what users need / want, while balancing our business needs, in order to make everyone feel at Home.
Global Launch
Full launch on all platforms (Web, Android + iOS) officially came November 2019.
Download Wattpad and check it out for yourself :)
Results
Over the course of the first 30 days of launch...
- Reading Time: + 8.4% Web, - 1.8% Android
- W1 Retention: No change
- Very positive community reaction (only 6 negative customer support tickets)
Ultimately, the goal was to get people reading content faster (increase in RT), and remain engaged on the platform. If we saw higher engagement/CTR on Home that led to an increase in RT, we did our jobs well.