Skip to content
João Montenegro

ubbu

Computer science for K-6, made easy

Year
2016–2022
Field
Software
Role
Co-founder, product and design
Links
ubbu.io
ubbu: Computer science for K-6, made easy

ubbu has been meticulously designed with the help of educators to both enable and empower teachers of all fields, and help kick off their school's innovation journey.

ubbu lesson screen: a quiz on variables beside an illustrated scene
ubbu teacher view of a first-year programming course, with the class list and scores

That's why ubbu allows its users to login as a team. It also benefits the kids themselves, who pick up important social skills from the group exercises.

ubbu login screens for students and teachers, side by side

As important as the team login, ubbu is also designed for both online and offline environments. The connected school is becoming a reality, but until then, teachers need to rely on solutions that work offline.

ubbu character picker, over an illustrated city
ubbu teacher home, showing the classes a teacher manages

Inside ubbu, there's a curriculum of games and videos, all designed by ubbu's own content team.

ubbu puzzle screen: a robot on a grid, driven by the command buttons
ubbu block-coding editor with the sprite list, code blocks and stage

At the end of the learning curve, ubbu has its own block coding tool: ubbox. With it, kids can create code projects and share them with their peers.

ubbu class report, scoring each student against each lesson
ubbu teacher profile with account details and classroom progress
ubbu classroom overview: lesson details, class performance and student questions

At the core of the experience, ubbu focuses on the teacher by guiding them through the curriculum and providing analytics on the class's progress.

Mobile experience

Throughout the years of growing ubbu, mobile grew in importance.

ubbu on a phone: class list, lesson plan and coding screens
ubbu block editor on a phone, with the sprite and character pickers

Advanced content navigation

ubbu’s main user, the student, was the focus of the design. This way, many design experiments were made to increase engagement and lesson-to-lesson navigation.

Here’s one of the broader experiments: UbbuWorld, an immersive experience where the user controls a character hopping between coding challenges, science lessons, and code project builds.

This design was preliminary, and the current form is being developed.

ubbu course map: hexagonal tiles leading from lesson to lesson
ubbu course map on a phone, with the lesson card open

Website design

ubbu’s website had many iterations throughout time, as it was built to:

  1. Convince kids that it was a fun experience.

  2. Convince parents the educative value of the platform and methodology.

  3. (Most importantly) convince teachers and educators that the program was easy to implement.

ubbu marketing page: “Become a coder by playing”
ubbu community page showing projects made by children
ubbu page for educators: “Supercharge your classroom with computer science”
ubbu curriculum page, with a rocket illustration and testimonials
ubbu page for parents: weekly updates on a child's progress
ubbu page describing new content: the lab, food games and other courses
ubbu help centre page
ubbu page listing the concepts taught, from problem solving to online safety

Branding and logo design

ubbu’s branding was a tough problem to crack.

Together with the identity crisis of the parent company, there was a problem of trying to speak to many audiences simultaneously.

One of the methods to validate the brand was to ask children of a few nationalities to try to pronounce a few words. ubbu stood out as an easy name to say.

The logo itself is soft, inviting, and clean.

The colours were chosen to echo the traditional hues of programming environments, like the old monitor terminals.

The ubbu wordmark in four colourways: black, yellow, white and blue

Media

João Montenegro interviewed about ubbu on RTP's Network Negócios

Reviewing ubbu’s founding history at RTP, Network Negócios (in Portuguese).

The segment is no longer online.