Back to works

Inspiring young innovators with a kid-friendly robotics app

The Revolution Robotics Foundation is creating kids' robotics programs and tools that are affordable, accessible, and educational. We collaborated with them in redesigning their mobile application, which helps kids to code, build, and program robots.

A mockup showing the refreshed, sleek UI
Client
Revolution Robotics 
Foundation
Industry
Robotics / Game 
Industry
Service
UI/UX Design
Team Setup
1 Researcher + 1 Designer
Timeline
7 months

Goal

The goal was to redesign the Revolution Robotics app completely: add new features, revamp the navigation, and create a new UI. The application had to resonate well with the young target audience, offering a wide range of features without complicating the user experience.

Challenge

Conducting usability testing with children presents unique challenges and requires careful planning, especially when working with a phone-controlled physical product. Our team, experienced in working with kids, successfully tested with 7-14-year-olds, both in-person and remotely, across two markets.

Outcome

By the end of the collaboration, our team created a completely rewired architecture as well as a new UI and UI kit. The final results were tested and validated along the way with the help of usability testing with 45 kids altogether. In the redesigned app, they quickly learned how to navigate the product and were excited by its possibilities.

24+
Months of collab
25+
User flows
1
Full app redesign
Project timeline
Timeline of our 7 months project, which involved recurrent testing and and multiple app redesign cycles
1 /
Discovery

How we started:

  1. We initiated our projects with kick-offs to learn more about the company, the difficulties they experienced within the app, and their goals.
  2. We had the chance to observe a robotics competition to gather insights on user experiences, focusing on both kids and adults.
  3. We conducted legacy testing of the app with children aged 8 to 14. To protect their privacy, we made sure to have the right consent forms and follow age-appropriate privacy guidelines during the testing sessions.
  4. Based on the revealed information, we had an ideation session about redesigning the app's navigation. In this session we focused on integrating the ‘configure, code, and control’ features into a single navigation bar for easier access by users.
The live kick-off happened in our studio, where a little robot toy welcomed everybody to follow the release in a live feed
Live kick-off
An overview of the kick-off workshop, which displays various illustrations
Online part of kick-off workshop
2 /
Understanding the domain

Our prototyping and validation process:

  1. Prototypes were developed and iteratively improved, starting with the most complex flow, the robot configuration.
  2. This challenging flow was usability tested with kids experienced with robotics, including remote testing with children whose first language was English.
  3. For further flows, parents of kids without robotics experience were recruited via Facebook advertising.
  4. A total of 11 prototypes were tested by the end of the project.
  5. As prototypes became more complex, collaboration with developers was initiated to discuss feature implementation.
On the left side, the original app design of ‘configure’ can be seen. On the right side, the redesigned version is shown together with the biggest change we made. In the new design ‘configuration’ of a robot, ‘coding’ and ‘controlling’ part is easily accessible for kids from the same place (menu on the right side of the screen).
On the left, the original design of the navigation panel can be seen. On the right side, the redesigned version of the live camera function is turned on too. This option was added during our work, alongside the battery life indication (on top), and different sensor measurement indications (on bottom).
On the left, the original design of editing the navigation panel can be seen, where kids could add different pre-written programs to buttons.  On the right side, the redesigned version of this screen can be seen. The screen got a UI refresh, the option to add the measurement of different sensors, and the option to set whether you are right or left-handed.
3 /
UI phase

After testing the early wireframes, we started adding more UI elements to the screens, based on the decisions from a branding workshop. This resulted in more detailed and visually rich prototype screens. At the same time, we began creating a design system that included all the UI components we developed.

Various games designed with Revolution Robotics
4 /
Outcome

By the end of the project:

  1. We rewired the IA of the app.
  2. 10+ usability issues were fixed and all the flows were updated.
  3. 100+ screens were designed in Figma.
  4. A whole new feature was designed: 'learning mode' helps the kids get quick help on how to use different features.
  5. A UI kit was implemented for consistency and speeding up design work.

Check the live Revolution Robotics App

Now available for hire
Let's talk
Schedule a call
Drop a message