Webmaker Badges Are Here: Get Recognized!

I wrote awhile back about our thinking around the Webmaker Badges. Well that thinking is now a reality, we launched the first set of Webmaker badges at MozFest.

There was a big Mozilla post and fanfare around the launch, so I’ll just let you read that for the high level details, but I wanted to go a level deeper and also highlight some key next steps.

Deeper Dive

Skills + Participation.

As I detailed in my previous post, and as you can sort of see above, the initial badges cover a range of ‘hard’ skills like HTML and CSS, but also a range of participation and contribution activities. We think web literacy is more than just learning how to code or specific technical things, but also about being good active members of communities, etc. The first Webmaker badges are a taste of this.

Starting small.

The badges above represent the first of a much larger set of badges that we plan to release over the next year. We knew we needed to start somewhere and zeroed in on the core skills that we were already covering in Thimble, as well as participation badges aligned with MozFest, but plan to release badges that span more skills, levels and events.

Innovative assessments.

Repeat after me: Badges are not assessment. Badges are the thing you get after you’ve learned something and successfully demonstrated that learning through an assessment. The assessments are incredibly important because they are the ‘evidence’ or meat behind the badges. For the initial Webmaker skill badges, we are using embedded assessment, meaning that we’ve built rules into Thimble that automatically assess as the making is occurring and issue badges accordingly. We love this type of assessment because its built into the making, or the stuff that the learner wanted to do anyway, versus making the learner do some artificial separate assessment like a multiple choice quiz. It works pretty well for things like HTML and CSS.

Smart issuing technology.

We’ve built a pretty awesome tool, currently called Open Badger, that supports badge creation and issuing. It allows someone to define a badge, including assigning a name, image, and all of the metadata behind the badge, generates criteria pages, gives you an API to award badges based on learner behavior on your site and posts/hosts the badge assertion for you. And I’m sure I’m missing a few things. It’s pretty awesome and of course, its open source. We’ll be releasing it early next year for folks to run on their own servers. For now, we are beta testing it as the engine behind the Webmaker Badges.

What’s Next

User experience tweaks.

We watched a bunch of people earning badges at MozFest and while people love the badges, we’ve got some work to do on the UX to make sure that people not only understand the badges, but make the connection back to the learning that occurred. This launch was the MVP so we knew we made some sacrifices on the UX front and the good news is that we learned a lot at the festival and have the right people in place to take the experience to the next level.

More badges.

As I mentioned before, this was just the initial set of badges. Next up, we are working to launch badges in Popcorn Maker, as well as add more badges across the web literacy skills to our arsenal.

More assessment innovation.

We did some pretty cool stuff with the embedded assessment for this launch and we want to do more of that, as well as explore peer and self assessment approaches to provide additional flexibility and robustness to the badges.

Open sourcing.

One of the main goals for 2013 is figuring out how to meet our goal of building a generation of webmakers without getting in the way. There are a lot of other people already doing awesome stuff that teaches various webmaking skills or web literacies and we want to include them or recognize their learning, etc. We don’t know exactly what that means yet but we want to find a way to open up the Webmaker Badges to a much broader set of organizations and learning pathways.

Shout Outs

I’ve been lucky enough to be the one introducing the world to the Webmaker Badges, but the credit really goes to the awesome team, including:

• Carla Casilli - Chief Brains and Systems Designer of the Webmaker Badges and learning pathways behind them. She’s the big kahuna of Webmaker Badges and she pulls together all the pieces to make it a badge SYSTEM.
• Chloe Varelidi - Assessment Guru and Badge Mentor (while also driving all of the hackable games work!). She helped define all the initial badges and assessment approaches.
• Doug Belshaw - His Majesty of Web Literacies and Skills. He owns the definition of the web literacies and skills.
• Chris McAvoy - Chief Techie Wrangler. He wrangles all of the brilliant geeks (and is in fact a brilliant geek himself) to deliver production grade stuff on schedule.
• Jess Klein - Aesthetic Sorceress. She wields her magic to make things beautiful, usable and effective for all of Webmaker.
• Atul Varma - The Innovation Developer, or the Guy-Who-Makes-All-The-Crazy-Ideas-Real-Things, responsible for making the embedded assessment in Thimble a reality, among other things, like, um, Thimble.
• Brian Brennan - Badges Overlord. But not the evil kind. He is the technical brains behind the Open Badge Infrastructure and built the issuing technology for the Webmaker Badges.
• Mike Larsson - Finesse Doctor and our go to Fire Fighter. He not only builds mission critical stuff and fixes problems, but adds the finesse on top of everything. 
• Chris Appleton - Badge Designer Extraordinaire. He not only designed the first School of Webcraft badges way back when, but designed our pretty honeycomb badges for Webmaker.
• Sunny Lee - Big Picture Advisor. She represents the Open Badges work and helps keep the Webmaker badges work firmly grounded in the wider ecosystem efforts.

Thanks all! You should all get badges for the awesome work! And thanks to the extended team that gave feedback, fixed bugs, promoted the work, etc.

-E

Webmaker at MozFest

So, you may of heard, but there is this awesome festival coming up next week - it’s MozFest in London, and it’s going to be awesome. 

Webmaker will be a big part of MozFest and here’s how:

Building Webmaker Track / Theme

There are a ton of sessions at MozFest this year. You can get a filtered view of the Webmaker-relevant sessions through the Building Webmaker track. And you’ll notice that these aren’t just sessions about Webmaker, but as the name implies, they are chances to get your hands dirty and help us build Webmaker. Whether its creating starter projects, prototyping how to teach javascript (and building out teaching content for all of Webmaker*, for that matter), imagining Webmaker for mobile, or more, you can help us shape the very near future of Webmaker.  

*cross posted from the Hacktivate Learning track

Webmaker Floor

If you head on up to the top floor at Ravensbourne, you’ll find yourself in the mystical place known as the Webmaker Floor. This floor houses almost all* of the Building Webmaker sessions, as well as the Hacktivate Zone, which is where a bunch of really smart people will be figuring out how to teach this stuff and scale our reach.  The Webmaker Floor is also the home to the Webmaker Bar, explained more below, and some fun lounge-y, hang-out-with-the-designers areas as well. We’ll have some ambient hack zones too, like a project idea board where you can put up starter project topics or ideas that you’d like to see, as well as a huge hackable web literacy skills grid that you can post questions and suggestions directly on.

*I should note that there are definitely sessions and activities relevant to Webmaker occurring on the other floors and you should definitely check out all of the floors and tracks. Come visit the top floor for the core set of get-your-hands-dirty-with-Webmaker sessions.

Note: this image is not completely updated - we are still working with the configuration of the teaching studios. But it gives you an idea of all the energy that will be happening at any given time on the Webmaker Floor.

Webmaker Bar

The Webmaker Bar will be the place you go to make awesome stuff during the Festival. We’ll have some programming there to kick start your creative juices, but its mostly about coming and using Thimble, Popcorn Maker, the X-ray Goggles or a tool of your choice to make something and share it. BYOL(aptop) or use some of the computers we’ll have set up there. Check out all of the starter projects to see some ideas on what to make.

The couches next to the Bar will feature some of our designers and product folk at various times across the two days for some one-on-one user testing and deep dive feedback sessions. 

Hope to see you in London!

-E

Introducing Webmaker, the Product

As you all may remember from previous posts and announcements, we launched Webmaker, the Brand, a few months ago and built and released some of the core foundations, like Thimble, PopcornMaker and the initial learning projects. All of this existed under the common branding umbrella, but were still stand alone projects, teams and processes and end user experiences. 

As Mark mentioned in his post, over the last couple of months, we’ve been focusing on Webmaker, the Product, not as a major pivot - we’ve been doing this stuff for almost a year now - but really as a new perspective on our work and honing in on core priorities. We’re doing so for two core reasons:

1. Experience - we want to develop a Webmaker experience that helps people make things that they want to share and learn web skills in the process. The tool or the mechanics of how things work behind the scenes shouldn’t get in the way of the making and sharing experience. This requires a group of people thinking about the experience from that level, stitching together various tools and sites, creating pathways across projects, etc. At the same time, we need to make sure the tools and projects behind that experience are high quality/robust and remain innovative, so we want to have clear foresight into the roadmaps against the Webmaker goals.
2. Efficiency - we want to make sure that we’re prioritizing things and allocating resources in a way that supports that experience. But this isn’t just internally, we also want to make participation and contribution as easy and seamless as possible - this needs to be designed and supported as a core part of the product.

With all of this in mind, we spent a few weeks drilling into the details and landed on a crisper definition of what Webmaker (the Product) is, who it’s for and how it’s going to roll out and grow. We need some help in gut checking on this to make sure it feels right and that there aren’t any major gaps:

Why Webmaker?

We want to teach people about the web through the web and real technologies. What better way to understand and fall in love with the web, then realize that you can remix it for your own views and opinions and then share it with your networks? And what if in that process, you learned core skills that helped you not only make more things on the web, but changed your attitude in life from just consumption and acceptance, to production and expression? That’s what we are trying to do here, that’s why Webmaker.

What is Webmaker?

Two elements of Webmaker:

1. Tools - tools that support remixing, making and sharing on the web, while building learning into the process as well. Thimble, Popcorn Maker and X-ray Goggles for now. Game Maker, Mobile later.  [logos]
2. Starter Projects - projects, challenges, games and content that sit on top of the tools and guide people in making cool shit and provide instructions and learning objectives as well. On Thimble, starter projects are hackable webpages that have some challenge or project that you complete by editing the HTML and CSS code on the left. In Popcorn, starter projects are thematic videos that you can remix, with some skill development baked into the core content of the video.

Who is Webmaker for?

Two audiences for Webmaker:

1. primary: webmakers - people with something to say, those who want to express themselves and tinker*
2. secondary: webmaker makers - i.e. educators - those who want to teach other people this stuff, amplify our cause and our reach. We want to build this community, inspire them to teach webmaking and empower them to not only use our content, but remix it and to contribute back.

How will Webmaker roll?

Arc

• Making + learning foundations (mostly done, in progress)
• Experience design and connections across tools (MozFest)
• Contribution foundations (end of 2012)
• User + social features including gallery, collaboration within the tools, etc. (end of Q1 2013)

MozFest is our first big deliverable for Webmaker, and its a really important one since its the place that we can not only show off our stuff, but more importantly, playtest and user test our stuff and our ideas so that we can come out of it with a solid direction and set of priorities for 2013. Here are some of the core deliverables for MozFest (note, this is the high level view, look for a post from our head of software, Chris, on the technical and more minute details):

• Experience: ship more unified UX, connecting the Webmaker experience across tools and sites
• Webmaker Badges: launch badges in Thimble. We see badges as a connector between tools and learning experiences, but also between learners and community members. We are starting with badges and associated assessments within Thimble.
• Projects: build set of ‘real’ projects like portfolios and other things that people will want to make and share, as well as a plan for testing at MozFest
• Popcorn: ship PopcornMaker 1.0, the first production version that helps people make awesome Popcorn-ified videos.
• Instructor Community: ship and test hacktivity kits which help provide some hackable curriculum and scaffolding around our tools and content
• Contribution: initial plan for localization - where to start, who to enlist for help, etc.
• Engagement: prototype of community-led QA 
• Open Badges: ship new Badge Backpack UI - the Mozilla-hosted badge Backpack is part of the Webmaker experience
• Open News: build Thimble and Popcorn starter projects for journalists
• Hackable games: prototype hackable games in Thimble

I love this list because you can see how our various projects and programs all start to snap together as part of this Webmaker Product. Still a lot of work to do but its feeling like its moving in a good direction. We would love some feedback and help shaping the next iteration. Key question for now is: Does this make sense to people? What parts are still foggy? Are there any gaps in the narrative?

We are encouraging people to take comments and feedback to the Webmaker list so that the entire community can benefit and respond. I’ll post this to that list as well. 

-E

Webmaker Badges

====TLDR;====

We’re gonna launch some Webmaker badges at MozFest and some more next year. They will include a variety of badge types and some awesome assessment. Get ready world.

====LRIYW; (Longer, read if you want version)====

We’re building a Mozilla Webmaker badge system - eventually feeding into a larger Mozilla badge system. As I mentioned in my last roadmappin’ post, this is our number one priority from now through MozFest. And it’s WAY more than designing some pretty images, its the skills, assessments, technology, metadata and learning content as well. It’s all underway and here are some of the details, pulled from a presentation I gave on the Webmaker call last Tuesday**.

WHY

I think it’s important to explicitly talk about the why or the goals behind the badges. Not only is that important for justifying and explaining why badges are a huge priority for us, but it can also help inform some of our decisions about the types of badges to include, what’s in scope/out of scope, etc.

• Badges = disrupting a monopoly and putting the control back into the individuals’ hands…it’s what Mozilla does.
• Defining / driving a Webmaker experience.
• tying together tools and experiences
• defining potential learning webmaking pathways
• defining an architecture of participation and contribution
• Building fun into the Webmaker experience.
• Recognizing and tracking learning.
• Building and formalizing community.
• Scaling our stuff beyond ourselves.

WHAT

With those goals in mind, the following is the current set of badges, assessments and tools (types, touchpoints and technology) planned for the first iteration of our badge system.

• Skill (I can ____, I know ____)
• mini (I can hyperlink)
• cumulative (I know HTML Basics)
• Achievement (I made a _____)
• mini (I made a webpage)
• cumulative (I am a webmaker)
• Participation (I attended an event)
• Contribution (I hosted an event, I created a project, I added code)

SKILL

mini

cumulative

*NOTE: because we are starting with a very small set of explicit ‘hard’ skills, we are awarding the cumulative based on accumulation of the mini badges. Moving forward, we want to expand to a much broader set of skills, including softer skills. We know that moving to a peer assessment model will be very important for adding more review, evidence and mentorship behind the badges. Look for peer review to come early next year. We’ll be asking for your help on designing an effective peer assessment system.

ACHIEVEMENT

mini

cumulative

PARTICIPATION

CONTRIBUTION

PULLING IT ALL TOGETHER

the badges constellations available by the end of this year below.

NOTE: we are still working through the possibilities with Popcorn so there may be another set of skill badges: mini and cumulative reflecting those skills and that learning either in the first iteration or shortly thereafter.

HOW

So how are we going to make all of this happen? (answer: very quickly, but more specifically:) 

OBr

We are building OpenBadger (OBr), a lightweight badge issuing tool that, despite being lightweight, will do most of the heavy lifting. Specifically, OBr will handle:

• Badge creation and metadata definition
• Badge issuing
• Connection to the OBI

Tool/Site Integrations

In addition, we will be doing some tool and site integration:

• Building embedded assessments into Thimble and Popcorn
• Building calls out to OBr within Thimble and Popcorn. For example, when someone clicks publish, issue this badge, etc.

WHEN

As I mentioned above, we are pushing towards MozFest for an initial release, but we are already thinking about the follow-up releases and where we ultimately want to get to. So the roll out looks something like this (although everything is subject to change and wide open for comments/suggestions). More detail on the follow up releases to come in separate posts.

MozFest

• November 9-12 in London - don’t miss it!)
• All of the above, first iteration of the badge system

March 2013

• More badges and skills covered
• Peer assessment 

Summer 2013

• Levels
• Pathways (including non-Mozilla options)
• Dashboard, goal-setting, portfolios

Thoughts?

So that’s the current plan. We would love feedback and suggestions on how to improve the first iteration of the badge system, as well as ideas for the follow-up releases. Let us know!

-E

**Full presentation from Tuesday’s call

***Also, see posts from Jess and Chloe for more details.

Learning Roadmap - next 4.5 months

It’s that time of year again. Roadmappin’. After a series of big, successful launches including Thimble and all of the learning projects, as well as the Summer Code Party, we’re now finalizing the plans for what’s next. 

Here’s what’s up from now through the end of 2012 (in most cases, by MozFest in November):

DELIVERABLES

Webmaker Badges.

Our number one priority deliverable is an initial badge system for our Webmaking learning experiences. I intentionally say badge ‘system’ because its more than slapping a few pngs on top of Thimble projects, but its the skills, learning content, assessments, tool integration and issuing technology…oh and the badges. Specifically, it will include:

• Publishing the 1.0 of the webmaker skills
• Badge and assessment definition
• Project updating/creation to ensure we fully cover
• All the technical stuff lead by Chris McAvoy, including:
  • Building OpenBadger, our lightweight issuing tool
  • Thimble and Popcorn badge integration
  • User account integration across tools/sites
  • Badge issuing UI/UX

Look for a fast follow post(s) on our plans for the first several iterations of that badge system, but you can expect to see the first Mozilla badges at MozFest later this year.

Lead: Carla Casilli*

Learning Content.

We’ve built a foundation of content and approach under our learning-by-making umbrella, but for only a very small set of skills (HTML, CSS) for a small slice of our audience. We know we want to cover more skills for more people, as well as have more interest-based access points for the same sets of skills. So there is a lot of work to do on Webmaker project creation. Good news for my team is that we actually want Mozilla to build very little of that ourselves, but instead want to work with the community - you - to build your own projects and ideas and add it to the options for learners. Therefore in the remainder of this year, we’ll deliver some additional projects, but also a queue of project ideas and a streamlined mechanism for community members to jump in and start creating projects.

Lead: Carla Casilli

Learning and Contribution Design.

Our learning projects were built to sit on top of our tools/sites and the two work together to create the Webmaker experience, learning pathways, motivation, etc. All the stuff that we care about. So we’ll be contributing significantly to the design for these tools/sites. We will deliver plans and initial implementations of 1) unifying features and functions across our tools to create a consistent Webmaker experience and learning pathways, and 2) how we can build contribution into the core of our tools, projects and experiences.

Leads: Jess Klein on the UX and learning design; Michelle Levesque on the contribution design*

Open Badges.

Open Badges is hitting its stride in a big way. There are over 100 organizations pushing badges into the ecosystem with tons more developing badge systems. The demand is awe-inspiring and overwhelming! We will continue to deliver on Open Badges in the following core ways: 1) Ux overhaul of the Backpack, 2) Partner and community support (and first iterations of a distributed support system! whee! more to come on that), 3) release of OpenBadger as an open source issuing tool, 4) plan and initial work for a 1.0 release of the Open Badge Infrastructure (to deliver in March 2013) and 5) hiring of 2 new team members.

Lead: Sunny Lee*

UK Tent.

While we built a lot of initial content and experiences, our goal is to reach web scale with this stuff and that necessarily means we can’t be in the middle or the driver for very long. So we are very focused on building networks and a community that will use our content, remix it, contribute their own, etc. We’ll build the tent but we need lots of other people to come on in and keep the party going strong. We’ve done a bunch of this in the US through the Hive and our initial partnerships. The next big focus is the UK. We are setting some deep roots in the UK including a MozSpace in London, handful of employees based there, series of events (MozFest in November - you should come!) and initial partnerships and growing relationships with key stakeholders and organizations. By the end of 2012, we will deliver a strategy plan and initial events and outreach to build a network of organizations who are teaching webmaking and contribute to the ict conversations by giving teachers real, relevant content to work with, among other things. 

Lead: John Bevan

Note: All the leads mentioned are the Learning Team Leads. Chris McAvoy is the Techincal/Software Team Lead for pretty much everything above and is awesome at it. Also worth mentioning that the leads have rock star teams behind them that include the Learning Team folks, but also some from Engagement, Software, etc. Yay for no silos!

SCOPING/PROTOTYPING

In addition to delivering things, we will also be scoping a bunch of stuff that will then influence the 2013 roadmap. The main three are:

• Hackable Games. (Lead: Chloe Varelidi) Making / hacking / modding games and learning webmaker skills in the process. Could be cool, right?
• Teaching Programming. (Lead: Me, for now) We want to incorporate javascript into our Webmaker skills and learning experiences. Big questions around where/if our philosophies of learning-by-making will suffice here. Also huge questions around how much of this we do ourselves versus leveraging some of the existing learning options out there already. More to come on this soon.
• Mobile. (Lead, TBD) Apparently Mobile is the new black. It’s where it’s at, so we need to be there too.

Note: It’s very likely that these three will intersect in a big way. You may remix a mobile game to learn javascript, for example. But we are treating them as separate scoping exercises, at least out of the gate, so that we can fully explore all of the options and ideas for each one.

We also had a section of the roadmap called “OUT OF SCOPE” - and not surprisingly, everything on there has moved into the Scoping/Prototyping column. We’re just too dang creative. But we can safely say that will will not deliver any production anything for all of the scoping projects, so that’s something. 

More posts to follow shortly with a deeper dive on these pieces.

-E

What the Numbers are Telling Us

We’ve been rolling things out in a big way and in my opinion, it would be a huge fail if we didn’t use this momentum, attention and summer code partyin’ to learn something about the stuff we’ve built - specifically for me and my team, about the learning projects. Enter The Survey. We have a survey that is available upon completion of a Thimble project* that asks some pretty basic questions about level of previous experience, fun, learning and if/where people got stuck. It’s not meant to be the most robust thing ever, but instead to do some temperature gauging during this first wave of users/learners.

*Note: we have another version of the survey (duplicate except for the word “Thimble”) for the DIY projects, which are the projects that point people out to different sites or tools. But so far, there are very few reposes there (~8) so this analysis is focused on the Thimble projects.

We have almost 150 responses so far, which is way lower than the estimates of folks using Thimble so far (more in the thousands), but not a bad response rate given that the survey link is a little awkwardly presented - right under the copy-your-link-to-your-finished-project field in the ‘Publish’ flow. 

Here are some highlights on what the numbers are telling us so far…

Findings

1) We’ve gone global

People are doing projects all over the globe. From the event registrations, we knew that we had events in 67 countries across the summer, but pretty cool to see this much activity in just a couple weeks.

2) Lots of existing experience.

We have a pretty even distribution of webmaking experience so far, with a slight advantage to those with more experience. This is a bit surprising since the Thimble projects are more targeted at entry level to intermediate, but its likely that some of this is due to the fact that we also just launched Thimble and have a bunch of people that are exploring it just to check it out. I’d also love to believe that there are mentor/facilitator/instructor type of people checking it out for the purposes of using it to teach other people these skills, but that question didn’t make this round of the survey (hindsight!!), so we’ll get those numbers in version 2.0. See below for a cross tab analysis of how this factor influenced other ratings.

3) Fun!

A whopping 74.8% thought that the project was fun and of that 39.4% said super fun. We are aiming for personally engaging, interest-based experiences so the sense of fun is an important piece. 

4) There was perceived learning.

63% reported some learning, with 25% reporting that they learned a lot. This is, of course, self-reported learning, not hard-core assessed learning* - but at this stage, again, to gauge the temperature of people’s experiences, I would say this is a pretty solid number, especially given that fact that over 50% came into the project with some or a lot of webmaking experience.

*Note: On the hard-core assessed learning: 1) we are building in more assessments that will use the work as evidence to validate that certain skills are demonstrated; but 2) all that said, again, ultimately we are after interest-based webmaking with some learning that happens in the process, so if people are engaged and able to make the things that they want to make, then I would call that a success without all the pre-post data hubbub…but we’ll do some of the latter as well next year.

5) People reported getting stuck.

One of our core design principles is to design for graceful failing - or said another, more direct way, don’t let people fail. By the numbers, it would appear we are there yet since 50% of people reported getting stuck. However, looking through the explanations, while there were a few that were overwhelmed by the code, it seems like most people were able to work through their stuck point:

“The </body> and </html> codes were missing and the webpage was showing errors and did not want to complete the project successfully. I figured it out at the end.”

“I didn’t put an end bracket in the right place for the hyperlink.  Which is good, because it meant that I had to go back and figure out why it wasn’t working.”

“In the beginning.  I had to read more carefully than just skim read.”

That’s actually pretty promising then, because the projects were challenging but the learner had enough to solve the problem. It shows trial and error and tinkering which are also really important aspects to our learning philosophy.

There was a trend of ‘stuck’ responses about the publish feature which we need to investigate some more. Right now, when you click “Publish”, you get a URL which you can copy and share through Twitter, Fb, email, whatever but that doesn’t seem to be resonating with everyone. Responses included “I don’t think the publish worked right for me” and “Copy and paste WHERE??”. Apparently some people don’t understand that flow. So we’ll look into that more. 

6) Cross Tab == Cool

Of the people with no webmaking experience:

• 70.9% reported having at least some fun, with 41.9% reporting a lot of fun.
• 66.6% reported at least some learning, with 43.3% reporting learning a lot.
• Only 10% (3) reported not learning anything at all.
• 58.1% reported getting stuck.

Of the people with some webmaking experience:

• 86% reported having at least some fun, with 43% reporting a lot of fun.
• 68% reported at least some learning, with 15% reporting that they learned a lot. 
• Notably, 0% reported not learning anything at all.
• 36% reported getting stuck.

Of the people who came in with a lot of webmaking experience:

• 34% though it was super fun, and 65.8% reported that it was at least kind of fun.
• 48.7% reported some learning with 23.1% reporting that they learned a lot.
• 35% reported that they didn’t learn anything at all.
• 56% reported getting stuck.

6) Some great suggestions

“More animal parts.”

This was the number one request. The Zoo was definitely one of the most popular projects and people wanted more options to create more animals. I’ll take that as a notch on the side of ‘this was fun and engaging’. Also points to needing more projects with rich content and topics like this one. 

“When a project asks you to replace one image with another, it would be helpful if it supplied some links to alternate images.”

This is an interesting suggestion. On the one hand, its a great idea and something that’s relatively easy to do, but on the other hand, again, part of the learning experience, and of web literacy as a whole, is being able to use the Web to find things that are interesting to you. I think what we definitely can do is provide better instructions on places to find images, how to properly attribute them, etc.

“More cat integration.”

Well, duh.

How to foster more learning:

“Maybe a toolset of html elements and drag and drop as well for different html elements.”

There were a handful of comments around this same topic of making it more WYSIWYG like or drag and drop. We intentionally built it this way, so that it is exposing the real code and learners/makers have to get their hands dirty in the code to make something. I think the potential for learning relevant webmaking skills is greater working with the real code…that said, we have to balance that with ensuring that the barrier is not too high. We are planning on doing some experiments with some different approaches with different abstractions with our DIY (read:non Thimble) projects later this summer.

“Maybe give the user an end result to aim for.  Can you make your document look like this [screen grab]  or create a page with a story or something and they have to create the next page.”  

This is a good suggestion and we’ll consider it moving forward.

“The explanations when you click “read more” are WAY above a beginning coder’s head.”

Takeaways:

• We’re on the right path - the projects (+ Thimble), and thus this approach to learning, are providing some engaging and fulfilling experiences for a majority of people. 
• Even though some of the feedback pointed to Thimble and the projects being too advanced for beginners, the numbers show that they reported the same amount of learning as those with some experience. The beginners reported it being a little less fun and got stuck a little more, but 43% reported learning a lot. I think even though the projects might feel overwhelming b/c of being dropped into the code, it seems like it was actually beneficial for people in terms of learning.  We’ve already started working on making Thimble even more accessible to entry level folks by integrating the X-ray Goggle functionality (you can now click on the right side preview pane and see things highlighted in the code on the left) and creating some more starter projects that focus on one or two elements at a time. It’s also worth noting though, that a lot of people with some and a lot of webmaking experience also reported learning and fun. I would guess that number would go up even more if (when) we have templates that are more targeted to various audiences and skill sets. So we’re on to something here. 
• We need more projects that provide more interest-based access points for people - things like the Zoo project with rich content and compelling topics. We really want the community’s help with this so if you have an idea for a Thimble project, tell us about it.
• We need more help and hints baked into the projects so that the barrier to entry is lower and less people can get stuck. 
• We need to revisit the Publish flow to make that work for more people and (bonus!) use it as a teaching moment for those not used to sharing things on the Web.
• We need more cats.

-E

Weekend of Learning

Last weekend, we launched the Mozilla Summer Code Party with the Global Weekend of Code, which was a resounding success. Over 100 events across over 30 countries, with over 1000 people learning to code. And there are at least 4x as many event scheduled for the rest of the summer. Now that’s a party.

Most of the partiers used our new webmaking tools: Thimble and Popcorn Maker. As I’ve talked about before, we have developed a number of projects and templates that sit on top of these tools and give learners an interest-based access point into some webmaking of their own, and of course, some learning in the process.

My role last week was on the Party Squad, monitoring the social medias and retweeting / posting / sharing all the awesome stuff that came through. It was an inspiring place to be in - just amazing to see all of the webmaking that was occurring. I wanted to reshare a few of the projects here. I know you’ve probably seen them all via our constant stream of blogs, tweets, posts, etc. last weekend but it’s worth taking the time to dig a little deeper to expose the learning that’s actually occurring underneath. 

Sell it!

Source / Built from the HTML Wrangler Project

This one may seem simple at first - it was built from what’s intended to be an entry level project for people that are total newbies to HTML and might be intimidated by a lot of code right away. The project introduces the basic concept of tags and comments, and then some text handling tags like <p>, <h1>, <h2> and linking. So there is actually a lot going on in there. And this maker not only mastered these HTML basics, but also added in text that was relevant and interesting to him/her, so that it became something that s/he made that mattered. And learned some HTML in the process.

Map

Source / Built from the Hack a Map project

This is another entry level one that requires the learner to fix a bunch of issues in the code. The fact that you see the page without big errors or floating <’s means that the maker successfully fixed all the issues. This requires you to understand the concept of open and close tags and other HTML syntax details, and then also introduces you to images and text handling. This particular maker decided to add a video to the page. The caption says “i put up this video cuz i figurd that lots of people would like it”. *smile* Thimble currently requires that videos be handled through iframes (because of security issues with the <video> tag) so this wasn’t a super easy thing to figure out how to do. It’s possible the maker pulled it from another project, but isn’t that the beauty of the Web? Of course, there are design aspects like how to surface the video above the map images, but that wasn’t a core part of this project and the maker was still able to hack it to add his/her own content. 

Bakery Bash

Source / Built from the Bakery Bash project

This project focuses on image handling, and helps makers learn the <img> tag, how to find and use image URLs and how to resize images, all under the theme of creating an invitation list for an awesome party with Loaf Cat. (If you don’t know Loaf Cat, ask the internetz) Makers are also asked to work with hyperlinks and link out to secret guests that will attend as well. This particular maker made this his own by using pics of NBA stars and cartoons (and a tomato?) and linking out to super heroes and characters. S/he even hunted down and edited the intro message to read “Porta Pottys Rock”. Silly? Yes. Legitimate HTML skills and interest-based making? Absolutely.

A New Creature

Source / Built from the London Zoo’s Awesome Animal Builder project

This is one of my favorite projects - it’s by the London Zoo and it asks makers to read about several endangered species and then create their own creature by moving HTML images around, and then wranglin’ text and lists to describe the new creature. There’s a lot on the page too, so you have to get comfortable sorting through the code to find the parts you want to move around and edit. And on top of all the awesome webmaking skills required, there are some great learning opportunities around conservation and biology. You can see here that the features and description of the new animal are pulled together from features of the real animals themselves, so the maker was internalizing those details about the real animals and mashing them together for the new creature.

TMNT Zombies

Source / Built from the Get Off My Lawn! project

This one is worth calling out because it requires some pretty advanced CSS positioning. The game involves using %, em and pixels in CSS to move objects to block zombies that are invading your lawn. Not only did this maker demonstrate positioning skills by moving everything to the bottom right corner, but also hacked the game completely and swapped out the zombie images for images of their own. I think some of the most compelling learning/making that we’ve seen is people that not only complete the challenge, but completely hack the process and page to make it something that they care about. Brilliant.

Gallery

Source / Built from ??

This one was just awesome. One of the things on the Thimble roadmap is a gallery so that people can share the things they built with other webmakers. Well this particular enterprising maker just used Thimble to build their own gallery highlighting the links out to the projects that their group made. It’s meta and it’s awesome. Maybe they started with a project and made it from there, made they just used the plain ol’ editor. Doesn’t matter how they got there at all, they knew enough or were able to hack together enough to make a page that suited their needs. Did I mention that I love the Web?

Robot Popcorn! (mmmmmm)

Source / Built with the Popcorn Robots template

Popcorn is our awesome web native film hacking initiative/technology/tool set and we just released an early version of Popcorn Maker that let’s makers build stories through video augmented by information that is relevant to them/their story. In this video, the maker adds a map of London and some pictures of their own, as well as some pop-up captions as the story progresses. This template also allows you to add comments that the robots will read in a robot voice. Very fun, but also some heavy duty skills required around video wrangling, open video, procedural storytelling, storytelling in general, information gathering and curating, etc. I particularly love that the maker started with a screen that says “I have no idea what I’m doing” and yet was able to add a bunch of personal touches and hacks to the video. 

Summary

So in summary, despite some of the surface simplicity of some of the projects, there is a lot of learning and web literacy behind them. I think we should be pretty proud of that. Of course, we don’t yet know what level of skills people are coming in with, and we hope to build more of that into the experience so that we can truly measure the learning. Anecdotally, we heard lots of people say “I am learning so much” and “I can’t believe I just did that”, and we have some basic survey results that I need to analyze and share soon. But above and beyond that, its hard to say right now how much people learned in a traditional pre/post kind of way…but from my viewpoint, we got 1000+ people engaged in making stuff about things that they care about online, and demonstrating a lot of webmaking skills in the process. I’ll call that a victory.

And with that, I leave you with this:

Source