StoryWeaver
StoryWeaver is a digital initiative by Pratham Books, India's largest education-focused NGO. It gives kids access to 19,000+ stories in 234 languages around the world. This open-source platform lets contributors create, translate, and illustrate stories/books for free.
My Role
Lead Designer, User Experience & Visual Design
Collaborated With
CEO, Director of Stragety Educaters, Frontend and Backend Engineers
Durations
10 months
Product Type
Website / Web App
What is the problem?
Learning to read is an essential step for education. A lot of children in India struggle to get access to the book in their native languages due to lack of materials available. Limited means to quality content sets learning back.
There is a lack of good content with quality translations across many schools around the nation
Hight-cost books make access to educational material is a pain point for education institutes, parents and literacy organizations.
Many texts fail to ignite the curiosity to learn in children because the content is often just cerebral
The Intervention, StoryWeaver
StoryWeaver, an online open-source platform dedicated to educating kids thought stories
StroryWeaver's mission is a book in every child's hand. They're trying to fulfill it by increasing access to books, inspiring kids to learn through stories, onboarding publishers who create native language content, and most importantly, leveraging some communities to elevate others.
StoryWeaver's Challenges
On their mission to create impact & grow, StoryWeaver faced some challenges, which were we stepped in
01
Increase the number of reads and improve reading experience on the platform
02
Personalise Homepage & improve discoverability
03
Optimise and design features focused for educators and SW community
04
Reviewing & rating for community reviewer & gathering feedback from readers
05
Reach out to people in the rural area with low means of connectivity
The Process
Mapping the Website and features to understand existing IA
Mapping the flows of all the existing features and the website was our first step in redesigning the platform. Workflow Mapping provided us with more context about the product, how it worked, and what the existing information architecture looked like.
We mapped all the old workflows and pitched new ones that would improve the experience on the website depending on what type of user was browsing
Whiteboarding to ideate after getting insights from StoryWeave's teams
StoryWeaver had already done some rounds of research & and testing before engaging with us. The outreach team also interacted with educators in school and literacy organizations and was up to date with their needs and demands.
Since Pratham Book is a publishing house, the needs and concerns of content creators were also accounted for. Collaborating with various stakeholders was crucial to validate if were making the right design trade-offs
Solutions & Key Features
01
Improving the reading & experience by redesigning UI & prioritising functions for power users
StoryWeaver was home to many beautiful, high-quality digital books however the experience of finding a book wasn't easy. There were many ways one could filter their search for a book but those important parameters were not leveraged, they got lost if the business of the UI & the amount of content.
To improve the reading experience we replaced some text with visual indicators. That would make it easier to scan books. We made it easier for readers to quickly scan levels, and languages and maintained functionality through a hover menu. The new UI also showcased the amazing illustrations.
Old Book UI
New Book UI
Reading categories were added to make it easier for people to find content for the genres they liked. The quick read function gave readers the ability to take a quick look at the book description & more entry points to new content were added to the book details page to give the readers custom recommendations.
02
Personalizing the Home page by curating content for all users & encouraging discovery
StoryWeaver home page was rich in content but only on one kind. The platform hosted many campaigns, events and wrote amazing blogs about impact, education and their work in education. All of which was buried in under several clicks.
From landing on an endless page full of content
The Home page of the platform was just an endless scroll of books with the ability to filter content.
To a curated experience with a variety of content
The new home page featured StoryWeaver's recommended books, their blog, campaign banners with CTAs, and curated content for returning readers and creators
03
Designing for educators and StoryWeaver community's needs by featuring Lists & Personal Library
Reading lists quickly became a community & educator's favorite feature. Educators and parents could access reading lists especially made by publishing houses for educators. This saves educators a lot of time as they don't have to individually search for books and download them one by one.
With reading lists, they can do a bulk download, save the list to their off-line library, and even create their own private list also known as a Personal Library
04
Reviewing & rating for community reviewers & gathering feedback from readers
Simplifying reviewing for Community Reviewers
A committee of reviewers vets the content that is published on the platform. They had to fill out a long multiple-choice questionnaire for each book, even the ones that were of good quality. Now the reviewer only had to answer those questions if given a low rating.
Reviewing & Rating for Readers on the platform
Getting feedback from people doesn't only benefit StoryWeaver but also the user, their ratings affect their recommendations. We also suggest more stories to read after they rate one to reward them with personal recommendations
05
Reach out to people in rural area with low means of connectivity
My places in India don't have connectivity or Wifi. Most schools don't have the internet to access books online. For communities that only get access to the internet once a week or so, this feature is perfect. It allows people to save books when they're online and later access them even when they don't have any connectivity.
Key Takeaway
Having collaborated with multiple internal teams on this project, I learned that while it's important to account for their needs, it's equally important to challenge them to differentiate between what is a need vs a demand. While collaborating with cross-functional teams, pushback from teams was a part of the process. It's also a critical part because it encourages people to think critically people and have strong reasons to defend their choices.