Hardware / Interaction Design / Strategy
Littlebits
Code Kit
Role /
Design Lead - Interaction Design, Strategy, Prototyping
Team /
CIID -
Alejandra Molina, Michael Owen-Liston
& Andreas Refsgaard
Timeline /
2015 - 2 Weeks

01. About

A vision for littleBits' first product to mix software and hardware. A kit for building electronic games 🕹️ and learning about programming.

Littlebits creates magnetic, electronic building blocks that teach children the basics of electronics and foster a mindset of making. They approached our team to explore how their electronic "bits" could be used to control video games and how an accompanying game-building platform for kids might work. Over the course of 2 weeks, our team researched and conceptualized a new product offering, and prototyped the key experience moments around it.

A kit designed for parents and kids to build and play games from the 8-bit era.

Nostalgia for parents, fresh and fun for kids. This was the ask from LittleBits at the beginning of our design sprint. They wanted a kit that would open up the creative world of 8-Bit games and connect the parent's nostalgia with the kid’s love of gaming and making. We were asked to envision the physical components of the kit, the programming interface, as well as a social platform surrounding the games.

02. The Concept

"What if everything is a controller?"

This became the slogan for our concept and the most important design principle we recommended to the littleBits team. When we started working with their team, the vision for the product was akin to a build-your-own-Gameboy. Over the course of the project, we immersed ourselves in the LittleBits universe and in the world of gaming. In the end, we designed a kit that gives kids and their parents the power to free the 8-bit games of yesteryear from screens and bring them into the physical world where they can become something completely new.

 03. Research

Getting familiar with game design at a retro arcade.

One of the biggest insights from our team research trip to a local retro arcade was noticing that many of the games were slight tweaks of each other. By changing a few small things about the game or controller you could have an entirely new experience.

Co-creating with kids to understand how they think about video games.

We ran a co-creation session with four 10-13 year-olds. We brought a hacked-together LittleBits-controlled video game and some vintage handheld games. We used these to spark answers to questions like: If you could build your ultimate controller for your favorite game what would it be?

Design Principle 01
The method of building games should mimic the logic and simplicity of the physical Littlebits blocks.

Littlebits’ products take something very complex and distill it down into understandable blocks. They are abstracted away from concepts like resistance, current, analog, digital, etc. and presented simply as what they “do”. The same approach can be applied to video game elements.

Design Principle 02
The gameplay should embrace the craftiness and tangibility inherent to the Littlebits brand.

Littlebits are about enabling new experiences and one-of-a-kind creations. The gameplay of the kit should not mimic an existing product such as a gameboy. It should give kids the tools to create new games that play out in-between the real world and what’s on the screen.

Design Principle 03
Use remixing to ease the learning curve of building complex arcade-style games.

Learning to code often starts by learning to modify existing code. The same can be done with games. Use tweaking things like sprites, speeds, and game-boards as a gateway to more complex game building. Allow kids to see how their changes affect the gameplay in real time.

04. Game Builder Software

Game Blocks are ingredients in a recipe for games.

The Atari-style game format and 128 x 96 pixel screen requested by the client had major implications for how we designed the game-building environment. The pixel density and complexity of the games meant that, for simplicity's sake, we needed to add an additional layer of abstraction on top of the traditional object-oriented programming norms. We called this layer “Game Blocks” and built the interface around this concept.

We used paper prototypes to iterate and test our block-based approach to game creation

Just as the physical LittleBits blocks are ingredients in a recipe for circuits, Game Blocks are ingredients in a recipe for games. They fall into the categories of Characters, Elements, Environments, and Information. Each block is self-contained with its own behavior and visual style. This means you can drop any block into your recipe and see how it behaves.

05. The Kit + Sample Activities

A collection of blocks designed to spark physical play.

In choosing what LittleBits blocks we wanted to include in the game kit we intentionally included "wildcard" blocks not usually associated with video games. For example, the light sensor block turns a helicopter game you could play on any phone into a Kinect-like controller where your hand "becomes" the aircraft.

Enemy Spawning Tube

The Enemy Spawning Tube allows a second player to introduce new enemies into the gameplay happening on the screen. A Motion Trigger block is placed at the top of a paper towel roll. When player 2 wants to spawn a new boss enemy into the game they drop an object into the tube setting off the trigger and telling the game to create the new enemy.

Gum-ball Prize Machine

The Gum-ball prize machine project brings the arcade experience into the home or classroom. Pair a littleBits servo block with a jar, cardboard box, and some candy and you've created a tasty reward for any game. Tweak the game to trigger a reward at a high score or at the completion of a level. This project introduces the idea of physical outputs. If a servo can trigger a piece of candy what else can it do?

06. Project Outcomes

Our team's vision eventually became the Littlebits Code Kit

After presenting our vision for how littleBits could use video games as a means of introducing kids to programming, the team from littleBits took our work back to their office to sell the rest of the company on the idea. After nearly 2 years of development littleBits released Code Kit: The first STEM learning kit to combine block-based programming with real-world engineering using littleBits electronic building blocks, empowering students to create their own games.

Back To Work