Project Constellation: Phase 1 • Phase 2 • Phase 3 • Phase 4Phase 5Phase 6Future Vision

Wattpad's New Home: Establishing a Scaleable Modular Framework for Discovery



"I have to do a lot of work to find my next read"


Heuristic Markup

  • Limiteded recommendations
  • Recommendations not relevant
  • Recommendations lack context
  • Layout not responsive
  • Inconsistent elements


  • Majority of users did not find home recommendations helpful
  • Often had to dig to find good content


  • Make home an excellent source for finding your next read
  • Better recommendations (Quantity, Quality, Context)
  • Create the foundations of a scalable modular framework that can aid content discovery through every corner of the experience



A/B test new vs existing design for reading time (retention)

  • New vs Existing Users
  • Age Group (Under 25 vs Over 25)
  • Platform (iOS, Android, Web)


Surveys, in-person & remote interviews, user testing

  • Beta group
  • Wattpad Ambassadors

User Story Mapping

Conducted company-wide User Story Mapping exercise to visualize the new discovery journey through all parts of the app

 Project Constellation: User Story Mapping Part 1

Project Constellation: User Story Mapping Part 1

  Project Constellation: User Story Mapping Part 2

Project Constellation: User Story Mapping Part 2


Defining the Module System

  • Recommendations from who you follow
    • A reading list by a profile you follow
    • Other stories by a profile you follow
    • Other stories by a profile of a story you read
  • Unique recommendations powered by machine learning
    • Because you voted on X story
    • Because you read X story
    • Because you followed X profile
  • General recommendations for all users
    • Featured Stories
    • Trending Stories
    • Popular Stories
  • Work across all platforms, all screen sizes, all breakpoints
  • Flexible system can live in every part of the experience
  • System can evolve for new use cases in the future

Content Audit

Conducted content patterns audit to brainstorm all possible module types


Early Wireframes

Exploring module types and layouts


Final Modules


Exploring a System

Project scope was limited to the home section, but I knew if we wanted a cohesive system, we couldn't just design each page in isolation. I went ahead and explored how a full responsive system could work based on all of the problem mapping we had done previously. It set the stage for many of the phases to come.


High Fidelity Scrollable Prototype



"It's a lot easier to find my next read"

  • 4% increase in overall retention
  • Every group measured saw significant increase in retention
  • One group saw 200% increase in reading time
  • Surveys yielded high satisfaction scores
  • 76% found it easy to find a story they wanted to read with the new design