Portfolio of Christina Fowler
Playtime Island App
A case study detailing the redesign of CBeebies' most used app
Role: Lead User Experience for BBC Children's
In January 2019, I began to work on a redesign of CBeebies’ Playtime Island app. Playtime Island’s purpose was to offer an unlimited number of games to a pre-school audience and create a destination for those games to be found within.
Aside from generally wanting to refresh the app, there were some specific issues that needed to be addressed - one problem was that there was so much “Island” experience that children were getting lost on their way to find the gaming content.
The goals that I helped to set with the Product Manager were…
- Put brands at the forefront
- Enable independent play
- Improve content discovery
These goals all worked towards the key objective of increasing the frequency of use.
Removing barriers
My first finding when reviewing the app was that a typical journey was 20 steps to launch the app, choose an avatar, travel to the main island, float up to the clouds, choose a game, download and launch the game. This approach also meant that the characters that children recognise were 12 steps away.
I created a new user journey by removing the non-essential steps from the existing journey and proposed the characters were brought to the forefront of the app. This reduced the journey to a maximum of 12 steps from app launch to being in a game. This journey became the foundation of the app experience.
During the early stages of the project I also did a competitor analysis to better understand the onboarding in similar apps and how long it typically took for users to get into the app. The existing Playtime Island app took less than 10 seconds in waiting time and this was a figure we looked to maintain or reduce throughout the redesign.
Unlimited catalogue of games
In order to realise the new user journey a new navigation method was required. I facilitated a workshop with all the designers from Children’s UX to generate ideas for a new way to navigate through the growing number of games. Five variations came out of the ideation session and these were then dot voted on by the product team.
I took the two most popular navigation options and used Origami to create prototypes for testing with pre-school children. The result of this testing showed that both options were easy to use but that a dial allowed children to see the full breadth of content available and they could easily find their favourite characters again and again.
I created a second round of Origami prototypes that explored different dial options. I created a 2D and 3D dial and tested again with pre-school children. Both were easy to use so I agreed with the product manager to use the 3D dial in order to differentiate the new app from the old Playtime app and existing competitor apps.
Exposing the content
At the time we had 25 brands and 37 games to accommodate. Under the existing design each game would have a “house” on the island. This meant that there could be three houses from the same brand next to each other, there was often very little to indicate which game they represented, and therefore proved to be problematic for users.
Each house was a significant design effort to create, brands struggled to understand the design rules for the island houses and therefore this caused problems for design sign off.
I created a design that removed the overhead of creating a house for each game and instead used the characters that users can recognise. Children would choose their favourite character first and then the game second.
Environment design
I used the refresh of the app as an opportunity to revisit the environment that surrounded the CBeebies characters. I worked with a team of art workers to develop four ideas for the island; a refreshed version of the existing Playtime Island, fairground island, city island and treasure island.
For each environment concept I drew a storyboard to help stakeholders to understand the impact that this choice might have. These storyboards helped the team to understand that these were not just pictures to be chosen between but the environment would be an interface for children to interact with.
I then took the environment concepts out to children in schools and asked them to draw their own islands where they would like to play. Overwhelmingly the children drew yellow islands with palm trees surrounded by water. Therefore the concept we chose to take forward was the desert island.
UI Design
While the artworking team worked on the new environment I worked on the UI button styles. I tried to use the Childrens’ Games Framework wherever possible, but as this was designed for games it was important to challenge any rules which did not make sense for apps. For example, I switched the “Pause” button for a “Settings” button which then removed an unnecessary screen for users.
Creating delight
During my final few weeks on the project I facilitated a workshop with the entire project team to generate ideas for the delightful interactions within the app. We dot voted the ideas as a team to decide which were the most popular and I then created storyboards for each set of ideas. These storyboards were then handed over to an animator to create the animated assets for the app.
Overall project management
During the course of this project I worked with three different senior designers. This required me to be very organised with my planning so that it was easy to transfer over knowledge to the next senior on the project. I created and maintained a task list throughout the project and ensured all working files were easy to find and to understand.
Looking after the task list in this way not only made it easier for a new senior to get up to speed but also helped me to work more effectively with art workers and animators who lent their skills to the project.
Handing over
When I handed over the project the team continued on to solve the following problems…
- How to present "new" content
- How to find games you've already downloaded
- The offline experience
The app launched in Summer 2020 and since then the menu interaction that I designed has been rolled out to two other CBeebies apps. Storytime and Get Creative now feature a never ending carousel of characters which transport the child to select from a range of stories or creative activities.