Go back
Go back
rethinking the homepage
Twin is an app that aims to empower kids with exciting knowledge and valuable skills with STEM games and fun hands-on projects. They needed a designer who can convey the right message and feeling with a new concept.
This case encloses the reconstruction of the homepage, one of the most exciting accomplishments for the product during my time with them.
Twin Science
1 year
Cross functional
Senior Product Designer
Since this app is for children, our major goal was to create lively, fun and dynamic visuals. We wanted it to look fun but also outstanding and easy on the eye with flat illustrations and a minimalistic style.
As the sole product designer of the startup, I take major part in every step of the design process. My tasks consist of creating userflows, prototyping wireframes, designing final user interfaces, maintaining the design system and managing the hand over process to the development team.
Twin has a myriad of different content types to engage. But, the old home page wasn't designed to accommodate this abundance of content. The images that referred to the content types weren't self-explanatory and engaging.
So, children did not quite grasp what the application had in store for them, and we weren't happy with the activation on the home page.
Our users clearly needed more guidance about what they could do on the app and wouldn't mind a gentle push to show them various ways to interact with the content. We wanted to grab their attention the second they got in. And we had just the right thing to do that: our amazing content!
So we decided to change how we welcome them; on the first page, they land.
People make snap judgements. It takes a fraction of a second to make a great (or bad) first impression. Things that users see or hear when they start interacting with a product will shape their opinion of the product
Since the actual user and the marketing target don't overlap in this app, we have two primary personas to keep in mind: the parent who will introduce the app to their child and the kid who will be interacting with the product.
First touch point for us is the parent on the outside world. A person who is interested in their children’s skillset and character growth deeply, we prepare our visuals and message accordingly.
And then there is our second persona, who actually interacts with the product. A young, curious 21st century genious-to-be. First persona is based on a marketing persona, whereas the second one is the actual user itself. We develop and conceptualize the features according to this persona.
We wanted to get a comprehensive idea about what our users understand when they first arrive at our mainpage. So we did a few interviews with children ranging from 7-13.
Wow it looks beautiful. The colors and the illustrations really vibing with me.
I think it has games in it, also you can make things. It could tell you how to make them and you can make them and share.
Adventure because I love an adventure, it sounds exciting.
I'm not so sure...no I don't think I understand.
When we looked at the data, we could see the drop rate of day 1 from the main page was fairly high. It seems that our users came in and leave the app without even clicking anywhere, never to come back again. We needed to find a way to encourage them to interact with the app to achieve any kind of retention.
The naming wasn't working either. Users had different ideas about what an 'adventure' is.
The illustrations attracted the users' attention, but they failed to convey a meaningful message about what they were referring to.
The quests were the most active part for this page so we decided to keep it in the next iteration as well.
The top part was intriguing for users but it's using up screen space ineffectively.
Before diving into considerable changes in the app, we wanted to get a clue about how our competitors approach their home page. Twin recognizes new tech educational apps with content for children between 9-13 in the UK and USA as their competitors.
So, I did a comprehensive benchmark study to shed some light on our competitors' approach to what to present on their home page. And I discovered a common pattern showing how these apps were choosing to present their content openly from the beginning.
We decided to lay out our great content openly for our users instead of hiding it behind ambiguous icons and labels. This way, we ensured that they recognised the app's possibilities.
Also, we wanted to benefit from the recognition effect. The videos and images of the content their peers prepared were more potent than anything we can say or do to tell them what they can achieve with these tools.
Minimize the user's memory load by making elements, actions, and options visible. The user should not have to remember information from one part of the interface to another. Information required to use the design (e.g. field labels or menu items) should be visible or easily retrievable when needed.
After shaking hands over the wireframe with the development team, we proceeded to design the UI. To make the transition easier for the development team, we tried to stay loyal to the UI elements at hand, as much as possible. And since we have been preparing and maintaining a thorough design library, it was fairly easy.
Pictures and images are more likely to be remembered than words. Studies prove that pictures outperform text dramatically in human memory recall.
- Although the change in the design looks massive since we had an extensive design library at the time, the development took reasonably little time.
- Due to the low user count, we decided we'd better implement it all once instead of incremental changes to achieve precise results.
- It was amazing to see the children's reactions to the content when they see it openly. They recognized some of the content creators and engaged naturally without further ado.
- They were instantly hooked by the content their peers were creating.
.gif)
The user researches after the redesign showed us that we hit the spot. Users were much more confident about the content of the modules and what to expect.
It feels exciting because there is a lot of stuff to do. And they all look fun. I want to open one now.
I follow this magician from Youtube so I wanna see his video. I think I’ve never seen this one.
Yeah there are like videos, games, trivias. Also lessons about coding too. But I like the videos.
I will watch videos...of people creating stuff. I want to watch this one now.
The following week of launching the new main page, started to bring the good news. Our day 1 retention increased to a dramatic 53.5% from 22.45% ,in just one week.
The new design for the main page also opened the way to a more dynamic way to iterate the design. We were able to conduct A/B testings to understand which content we put out will attract the users more. With these tests, we changed the visibility of some modules shown on the main screen or reordered them to analyze the data.Peer learning is a powerful tool that speeds up the learning process With this new design, we were also able to yield this power as well.
Next Project
