All posts tagged learning

London Learning Jam

How would you teach something about the web using a game?

This was the design brief we gave a talented group of educators, designers, and developers last week at the Mozilla London Learning Jam.

Our thesis is:

  • Use game-like mechanics to encourage learning and making
  • Hack on real code, not rely on training-wheels
  • Meet learners at their interests with tools that help them express themselves


We built a framework to make it easy to create new games. It’s a two-pane editor called Thimble.

One side has code and short comments to explain what to do. The other side has the rendered website, which updates after every change you make to the code, so you can see how the snippets connect.

We used the Thimble framework to hack on new games and playtest them with adults and kids.

New Games

During the first two days of the learning jam, we broke into groups to design the learning games. Some groups came with a brief in mind, others found their way using paper prototyping and talking through what they’d like to make.

I was thoroughly impressed by the creativity and thoughtfulness of the new games:

  • The Animal Builder by the London Zoo. Mix and match animal body parts to create hybrid animals. Learn HTML & CSS.
  • Wickedpedia by Steve Bunce (Open University) and Oliver Quinlan (Plymouth University). Edit celebrity Wikipedia pages. Learn hyperlinking, generating content.
  • Supporter 2 Reporter by Radio Waves. Create your own blog to report on sports such as Olympics. Learn blogging, layout, curation, branding.
  • Get off my Lawn by The Guardian and Goldsmiths. Clear the zombies away from your garden lawn. Learn CSS positioning.
  • Bunnies by Ben O’Steen. Save the bunny from danger by putting it in a safer environment – or worse! Learn HTML Basics, images, CSS positioning.
  • Cube by Laurian Gridinoc. Create a 3D Cube. Learn CSS and trigonometry.
  • Readability by Doug Belshaw. Make the text on your webpage legible. Learn HTML and typography.

What makes a good learning game?

We playtested the new games twice: once with a group of educators, policy-makers, funders and activists and the next day at CoderDojo London with about 15 kids.

Check out what the kids made!

The feedback from both rounds was incredibly helpful. My biggest take-aways were:

  • The comments in the code can be instrumental in making an effective learning experience. The Zombie game did a fantastic job both setting up the code to apply your learning and to prompt you using simple comments.
  • Give a clear mission. Some of the games had brilliant premises, but did not communicate upfront what their purpose was. When you start a game, you should know immediately what the goal is and what you’re expected to do.
  • Prompt creativity, but plan some backups. In games like Make Your Own Meme, participants said they felt pressure to be creative and didn’t know what to write. If we had more defaults or recommended images pre-loaded and commented-out, you could easily toggle in new content without much hassle.
  • Show what others have made. A key feature rolling out next for Thimble is a gallery. I think this will go a long way in encouraging users and showing what’s possible with the tool.
  • Work in pairs. Another tested thesis of ours is the power of working together. I found during the playtesting that teams hacking on the same games benefited greatly. They began to teach each other things and be inspired by one another.

What next?

We’re rolling in this feedback into the next release of Thimble. In future versions, it’ll also be easier to create new games and to share hacks.

The learning & making kicks into high gear this summer, starting June 23 with the Summer Code Party. We invite you to get together with family & friends and teach other the web using these games & whatever you like. You can also think about a hack jam to build even more games.

And there will certainly be a component of these tools & games at this year’s Mozilla Festival. We’re bringing some of the best people and projects to London to showcase what they’ve done over the summer — so dive in, and also give us feedback about what we can improve, what you’d like to see, etc.


We had a lot of fun, and this event won’t been possible without a number of great people.

Firstly, a huge thanks to NESTA in particular Amy Solder and Mark Griffiths for supporting the event and paving the way with key organizing.

A shoutout to all the hack jam and playtesting participants. Congrats to Alaistar Davies, Mark Riches, Laurian Gridinoc, William Duyck, Allan Callaghan, Doug Belshaw, Ian Usher, Oliver Quinlan, Ben O’Steen, and Steve Bunce for making cool new games.

Thanks to CoderDojo London, especially Andy Kent, for letting us play together.

Thanks to Jess Klein, Chloe Varelidi, Erin Knight, Laura Hilliger and Andrew Hayward for their hard work on the learning missions, Thimble, and leadership at the jam.

Lovebomb to Allen Gunn for facilitating, to John Bevan for inviting such great people, to Ravensbourne for hosting us, Paul Clarke for the photos, and to Mark Surman for the vision of how we can all learn and make on the web together.

Images by: Paul Clarke and Oliver Quinlan

A Learning Network for Berlin

There’s a long road ahead to bring Europe’s “start-up darling” Berlin up to par with learning & and the web. Digital literacy and simple computational competencies are often lacking; and there’s no indication yet that Berlin schools will step to fill the gap.*

There’s an important “out of school” role to play with Berlin’s tech-savvy communities and hackerspaces, together with an existing network of media centers and educational activists.


To get closer to a vision of what this could look like, 10 educators, tech community members, and activists met on Wednesday at St. Oberholz for a community brainstorm.

The goal: to map current digital literacy needs & offerings in the city, and to scope possible next steps for a learning network in Berlin.

Connected Learning

One of theories of change driving this discussion is connected learning.

Pioneered by UC Irvine researcher Mimi Ito and the MacArthur Foundation, connected learning is about re-imagining education in the information age. It leverages today’s technologies to meet youth at their interests and passions, realized through hands-on production, shared purpose and open networks.

I personally find this model very promising, as it centers on:

  • actively producing, creating, experimenting and designing
  • valuing the interests of young people to steer their learning
  • cross-generational collaboration
  • harnessing peer culture
  • linking the school, home and local community in an open network
  • and honoring academic achievements.

While the steps we are taking now are small, there are a number of successful learning networks to draw inspiration and mentoring from. Among them Hive NYC and Hive Chicago, as well other models at work in Pittsburgh and other cities.

Berlin: a network for making & learning together

What could such a network look like in Berlin?


  • Visit the Pergamon Museum and get an introduction to new methods in archeology and how to scan for objects underground.
  • After unearthing a digital file of a buried statue from the museum’s learning center, you head to Open Design City, where you pick up the basics of 3D scanning and printing. You print off a copy of the statue based on the museum’s files.
  • Your class had a workshop earlier that year in the Wikimedia Germany community space. So you know the basics of wiki-editing and online research. After digging through articles, you pull up an ancient inscription to go with your statue.
  • Go around the corner to lasernlasern, who helps you etch the inscription into the statue using lasers.
  • You’re really proud of what you made and want to tell the world. The nearest media learning center is a few minutes away. You bring your statue and some photos, and a volunteer helps you set up a blog and a gallery.
  • They tell you about Coder Dojo, a youth-led initiative to learn code, which has it’s first event in Berlin next week. You sign up, eager to make a game about hunting statues and cracking ancient codes.


Needs & Offerings

At the meet-up, we mapped what we already have to offer and what we need.

It was exciting to see that collectively, we have more to offer than we have needs. Lots of important skills at the table (teaching web development, film-making, media theories, entrepreneurship, and more), as well as connections to subject-matter experts, a nation-wide network of education activists, meeting spaces, hardware, time, and even small funding to get started.

The full list is here, and please feel free to add if you something to offer to the network.


Next steps

We decided we needed to test our thinking by running an event.

An event is a concrete way to 1) try out partnerships, 2) gauge local interest, 3) experiment with the curriculum, and 4) have fun.

Together with Fabian, I’m drafting a lightweight scaffolding for a youth pop-up event this summer. Chris Lawrence from Hive NYC has written an excellent piece about how to run one of these events, from which we’ll certainly borrow many ideas.

If you’re interested in:

  • Hosting a learning/hacking station (1-3hr, fun small activity that teaches a skill)
  • Offering a space (large, open space holding 50-100 participants)
  • Volunteering (the more, the merrier!)
  • Recruiting young people (We’re old. Where do we find young people in Berlin?)
  • Spreading the word

Then please join us on June 20 for a planning meeting. Location & time to be determined.

You can follow #hiveberlin for updates and also ping me (@thornet) and Fabian (@fabianmu) with ideas & questions.


Teaching the 4th “R”. Fireside Chat with Cathy Davidson

Last week Mozilla hosted a fireside chat with Cathy Davidson: author, academic, and pedagogic provocateur.

The chat was framed around what the Duke professor calls the fourth ‘R’. Cathy argues that in addition to reading, writing, and arithmetic, we need to teach “algoRithms,” the logic and networked way of thinking that underpins much of our lives.

Algorithmic thinking is less about “learning code” than “learning to code.” Code is never finished, it is always in process, something you build on and, in many situations, that you build together with others. Answers aren’t simply “right” guesses among pre-determined choices, but puzzles to be worked over, improved, and adapted for the next situation, the next iteration.

Mozilla’s Mark Surman and Michelle Levesque responded to Cathy’s proposal in lively virtual debate. Michelle agrees with Cathy on the importance of algorithmic thinking, and she’s been asking what technical skills do you need to participate in the Web? and what softer skills are needed?

Using a conference line for audio and a shared etherpad for collaborative note-taking and questions, we spent the hour discussing the virtues of webmaking and ways we can bring these skills in classrooms and board rooms.

The best place to start, Cathy and Michelle recommend, is to work with institutions and instructors already ready for change. These groups will lead by example. We must to find ways to have wins and celebrate those wins. And talk openly about what didn’t work.

Mozilla wants to help people move from using the web to making the web. And an effective way to do this is to empower the people who are already interested.

Michelle closes with an analogy about plumbing. (No, not that the internet is made of pipes.) She cites a study showing that people are more likely to try home plumbing if there’s someone in the area that knows about plumbing. You feel safe taking risks, knowing that you can get help if you need it. Even if it’s a few doors down, that offer to help is enough to encourage people to try, to not be afraid of making a mistake.

And that’s a neat place for Mozilla to be. Helping neighbors teach each other and encouraging one another to go ahead and get out the toolbox.