Webmaking as Connected Learning

Connected Learning wants to revolutionize the way people learn. How can Webmaker be a part of that movement?

Connected Learning: A New Synthesis Report  Blog Image

These new resources on Connected Learning are highly recommended reading for anyone interested in the future of education and “learning by making.” As Mimi Ito’s accompanying post explains, the Connected Learning Research Network has tested their hypotheses with a series of case studies, design experiments and a national survey — all culminating in a new report synthesizing the latest theory and research.

What is Connected Learning?
(paraphrasing from the report’s introduction)

  • pursuing an interest or passion with the support of friends and caring adults
  • in ways that are socially embedded and oriented toward educational, economic or political opportunity
  • linked back to academic achievement, career success and civic engagement

What is Webmaker?

  • digital literacy through interest-driven making. empowering people with skills to build the web (and world) we want.
  • pursuing an interest or passion with the support of friends and mentors
  • linked back to achievement, career opportunities and civic engagement through badges

Connected Learning & Webmaker share…

  • Principles: Interest-powered. Peer-supported. Learning by making.
  • Design: Open. Production-centered. Shared purpose.
  • Values: Equity. Social connection. Full participation.

Webmaker as Connected Learning: 5 community stories

Here are five examples of how Webmaker’s first year experimented with bringing connected learning principles into practice, told from the perspective of of real community members:

  1. UNATTIInterest-based making through openly networked learning events
  2. ZAINABFrom maker to youth mentor to career paths
  3. EMMAAdult mentorship and youth-run projects
  4. JONMixing physical making with digital making. Spurring social innovation in product design
  5. MEREDITHTalking back to TV: challenging media stereotypes through webmaking


code party

“i taught my parents! my brother and also few of my friends in school…..
here is  a thimble web page my father made….
My father is a coder now!!:)
My Mother too!!!”

  • Unnati is a 13-year-old from Erode, India. Last summer she signed up to take part in an openly networked, community-powered learning event called the  Summer Code Party.
  • When no one signed up for the event she wanted to organize in her town, she wrote to the Webmaker community asking for help.

Mentor-powered learning through digital making

  • Gauthamraj Elango, a 21-year-old volunteer Mozilla Rep, saw Unnatti’s message and decided to help, using Webmaker tools and community.
  • Gauthamraj picked webmaking projects geared to Unnati’s interests, beginning with a multimedia storytelling project called “Inanimate Alice,” showing her how to remix it using Webmaker tools like Thimble and Popcorn.

My love for web started with the Inanimate Alice Project.I loved it but it wasn’t a cake walk….i got stuck somewhere in the middle…and to help me Alice sent me Help!

  • With the help of her mentor, Unnati was quickly able to start making her own web pages and projects. These grew her confidence in digital skills like HTML and video remix, and gave her something fun to share with her family and friends.
  • Unnati was then able to bring her new skills into the classroom, creating a web page exhibit for social studies on the role of technology in education.
  • This lead to interest from her teachers and classmates. Unnati organized her own code party events at school, teaching her fellow students and later her parents.

ma and me!mom

Building social support for new interests

  • Unnati now identifies as a “proud webmaker,” and has become an active part of new community-led projects like Gen Open (see below). This provides ongoing social support for her new interest in digital making and the web.
  • She also advocates taking an interest-based approach to helping others like her gain digital skills, building off popular interest in music, for example.

One day I was watching a video based on the Popcorn project… it said the project was made to attract kids who love Film making to come and learn some code…. and I thought that was a great idea…And that we could apply the same idea for people who love music…. there are millions who love music… I am a music lover myself! 🙂


Technology isn’t something I really expressed an interest in until recently. Gradually, I started getting into creating and designing technology, which led to webmaking.

  • Zainab is a 16-year-old high school junior in NYC, and a member of her school’s “MOUSE Squad,” a tech literacy program and member of the Hive NYC learning network.
  • Zainab participated in a series of Summer Code Parties last summer, from small  skill-shares with other Hive network teens to larger hack jams.
  • As part of that process, Zainab began running “train the trainer”-style events, showing other youth facilitators how to use the Webmaker “X-Ray Goggles” for workshops with middle school students after school.

Earlier this year, I was trained on how to use and teach others about X-Ray Goggles…. This was when I first started thinking about how to not only use the web, but to start making the web. From then on, I just basically started grabbing every opportunity I could to develop and gather more skills as a webmaker.

Social advocacy through webmaking

  • Zainab also used Webmaker’s Thimble to create her own social advocacy project for other youth.
  • Her “Take a Stand” template makes it easy for youth to create their own web page about a social issue or cause they care about, learning digital skills as they go.

I was motivated by the documentary “Bully,” and the purpose of my web project is for people to take a stand and make an impact on an issue that they really care about by creating a simple web page about it.

From mentorship to educational and career opportunities

  • Zainab wrote about her experiences on Huffington Post in posts titled “Don’t Be A User, Be a Maker” and “On Becoming A Hacker.”
  • Her longer-term goal: study electrical and computer engineering at MIT.
  • Webmaker and Hive have provided her with resources to help level up her skills, plus practical leadership experience and references that can help.

Some people might argue that it is not important to learn things like HTML and CSS, but in a world where we are being introduced to new technology every day, it’s a part of your world and you don’t want to be blind to what’s going on in your environment.


Parents and kids wanted more, lots more – not just more hack jams but more OPPORTUNITY for kids period.

  • Emma is a software developer and parent based in Victoria, Canada.
  • She is an active volunteer and big believer in the values that volunteerism and open source contribution can offer youth.
  • But she saw a lack of these kinds of digital literacy opportunities in her local schools.

Parents of one eager hacker communicated frustration at the complete lack of instruction in their son’s school for the skills he was developing in programming.  These parents are out in their communities, using the right language  — for example ‘my son wants to learn JavaScript’ — but still they cannot locate the resources they need.

From a pair of learning sessions Emma organized with  parents and colleagues in Victoria, Canada last summer

Using adult mentorship and informal learning to teach new skills

  • Documenting each step on her blog along the way, Emma organized a pair of “hack jam” learning events for youth aged 9-14.
  • Because of Emma’s commitment to working in the open, a colleague at the local university “overheard” her need for a venue and donated the use of the university computer lab for the event.
  • Both events were filled to capacity, with an observer from the Ministry of Education attending as well. Youth learned the basics of web programming, and digital concepts like remix and reuse.

I guess you could say the outcome of our event was  ‘More please’ : more events, more opportunities for discussion and  collaboration, more opportunities to learn, and to teach.  Parents and kids were interested in starting code clubs, and bringing the conversation into their schools which is exactly the goal.  Volunteer teachers/mentors are also keen to meetup and share ideas ~ yay!

Building interest-based networks run by youth

  • Inspired by their early success, Emma embarked on a larger project: creating one of the world’s first open source projects run entirely by and for youth.
  • The project begins by asking youth around the world to answer a single question: “If you could make anything on the web, what would it be?
  • Based on input from around the world, youth will decided what they want to make together, working with other youth around the world using open source principles and organizing.

Hopefully they’ll find out what many of us in Open Source love about Open Source: that you are empowered to make a difference by working in the open, that ‘learning happens’,  ‘mentorship happens’ , and because of a shared community goal — great things happen!


4) Jon

Mixing physical making with digital making. Jon taking photos

My values are in social innovation and I believe that we need to work with people who are often ignored because of their social or economic backgrounds.

  • Jon is a university professor from Dundee, Scotland.
  • His passion is helping students and colleagues experiment at the edge of physical hacking in ways that involve the web.
  • The goal is to bring more creative and ecological thinking to how we imagine, design and prototype next-generation products.

I am excited about making the web physical. Why? Because there is only one universal platform for the web — and it’s not this one you’re reading this on. It’s the one that you’re sitting, standing or possibly floating in.

Spurring social innovation in product design

  • Jon recently brought colleagues, parents and students together to make and learn alongside each other, beginning with a 3-day jam event.
  • The emphasis was on coming up with creative new uses for the web in our everyday physical world.
  • Prototypes ranged from mashing up Arduino with Twitter, to making Google Street View respond to an arcade game joystick, to creating new data-responsive products and applications for news.
This “Twitter bird” flaps its wings using wire, paper and Arduino every time someone tweets a particular #tag.
  • “Making the web physical” offers intriguing new forms of interest-based learning.
  • It begins with learner’s interests in the physical world — like gadgets, clothing / fashion, robotics, games — and then layers digital making and open source values on top.
  • The result can help spur more social innovation in design thinking, inventing and product development.

“The big thing that we have learned is that an open approach to innovation is profitable. My students can measure that profit immediately because they have had conversations with the great brands that attended the event. If they experienced a closed project, then those students wouldn’t have had any of these great learnings nor productive conversations.”

5) Meredith


Television was my babysitter – I think I first said “dada” to Burt Reynolds in Smokey and the Bandit. But I made the move from media-spectator to media-manipulator in college.

  • Meredith is a self-described “tinkerer” and media-manipulator.
  • She manages a teen design and technology program at MOUSE, and wants to weave new offerings around the web and coding into their technology and youth leadership program. But she’s nervous about translating tinkering into code in ways students will find relevant and fun.

Talking back to TV: challenging stereotypes through webmaking

Digital Remixing and Storytelling with the LAMP
Students from New York’s Lower East Side Preparatory High School using Webmaker for video remixing and digital storytelling (Jan 2012)
  • Drawing on new skills and ideas from colleagues she met at the Mozilla Festival, Meredith collaborated with media literacy collaborators at The LAMP to bring new webmaking tools like Mozilla Popcorn Maker into a curriculum about challenging stereotypes in popular culture and media.

First we talked about what stereotypes are, how they get started and how we can fight against them using technology and media. Then we broke into groups and chose stereotypes and issues we wanted to address. We wrote out our thoughts and then recorded our scripts.

  • The students then added their audio recordings to Webmaker’s Popcorn Maker, adding images, Wikipedia articles, maps and text to illustrate their main ideas.
  • Popcorn Maker made it dramatically faster and easier for students to make their own movies, without having to actually record or edit video. They came away with a lasting artifact on the web they could easily share with parents, teachers and friends.
  • Their finished projects ranged from interviews about stereotypes in their Harlem and Washington Heights neighborhoods, to challenging stereotypes about Chinese students at their school, to a Spanish-language perspective on coming to America from the Dominican Republic.

Badges for community recognition and resume development

  • Students are also able to earn badges and “Wins” for their involvement with MOUSE, as well as Webmaker badges like Media Maker and Audio Maker.
  • Because both badge systems are now building on a shared Open Badges Infrastructure, all of these badges can appear in a single complete “backpack” for the learner.
  • This provides a more complete picture of skills learners have acquired inside and outside the classroom, and can help with college applications, resume development, and recognition from their community.
  • Meredith is now helping to train other teachers in how badges can foster student development, and working on MOUSE’s project to implement peer-based assessment so that learners can award badges and “wins” to other learners.
Mouse badges or “wins” provide a lasting record of new skills and achievements for each student…
New Webmaker badges like “media maker” and “audio maker” can also appear in the learner’s same badge “backpack.”

One comment

Submit a comment

Your email address will not be published. Required fields are marked *