We had a lot of fun doing some betatesting for the Mozilla Summer Code Party.

The idea is to gather a few friends around your kitchen table, have some drinks and snacks, and play around on the web together.

It’s through the informal, friendly setting of your kitchen table that we hope people will find inspiration to make things together on the web. The format is simple and also highly customizable, so you can host the event on your own terms.

Mimosas and Making

As part of the organizing team for the Summer Code Party, I felt it was really important to test the kitchen table format myself. (A huge shoutout to the other Mozilla betatesters! I’ll be writing a summary of your input and experiences tomorrow.)

On a Sunday afternoon I called up three friends to come over and play with Hackasaurus. Two of them already knew about the tool but hadn’t played with it too much, while the other was new to it. They all have experience with making things on the web: the group was comprised of a journalist, an illustrator, and a web strategist.

The invitation was very casual, which I think helped set up a relaxed, fun atmosphere. I just asked them to bring their laptop and to swing by my house for an hour.

We poured ourselves some mimosas, and I showed them two tools to get started.

Hacking the News

I first showed them lovebomb.me, which lets you remix cards and send messages to your friends. Their reaction was lukewarm. So I moved right into demoing the Hackasaurus X-Ray Goggles.

After remixing the example on hackasaurus.org, they installed the goggles and surfed the web for other sites to hack. The most obvious thing to remix was images, so they swapped photos on sites they knew.

One friend, interested in politics, hacked Wikipedia by replacing a politician’s profile with a brown envelope, a symbol of corruption:

After a few image hacks, we took to changing text as well. Another friend remixed a headline story so that it raved about his brother’s favorite sports team. He emailed the hack to his brother and immediately followed up with a call to explain how he made it and how funny it was.

There was also a Guardian remix about a politician outing himself as a muppet. “Labour leader calls for equal rights for muppets after he is revealed to be one,” reads the subtitle.

Storything

Since one of my friends is a journalist keen to learn more code, I showed her the Storything prototype. It’s designed to walk journalists and others through basic HTML tags, using a two-pane editor and a little video tutorial to mark up an article they’ve written.

She did the first chapter and said it was helpful and would likely try out the rest of the tutorials.

Doing your own thing

Several other betatesters pointed out, and I agree, that a successful kitchen table event balances curated activities with a hackable agenda that encourages participants to do what they want.

So while two participants were using Hackasaurus, the other was writing in his blog and clicking around on the web. I think that’s great and definitely the way to run these things: create a fun, communicative space where friends can learn and make stuff on the web, either in a guided or free-form way.

That self-direction helps the host get away from a disciplinarian role, and instead allows for everyone to make something that interests them. As a facilitator, I found my role to be more about introducing ideas, keeping a good flow and troubleshooting, rather than being a task manager.

Ways to improve

We ended up hacking for an hour, and I can imagine we’d play for longer if there had been more time. As we wrapped up, I asked my friends what they liked and what could be improved.

In general, they said they really enjoyed it — it was much more fun than they thought it would be.

However, they suggested adding more tutorials within the X-Ray Goggles, since sometimes it was hard to know why their hacks weren’t working. Perhaps in the manner of Storything with a guided tutorial, or just a hover-over “What’s this code?” or simple debugger might be helpful in showing people how the code is made and how they can hack it.

From my end, I also really enjoyed hanging out and showing my friends something interesting. I think we need smoother integration to publish hacks into a shared, global gallery. For this betatest, my friends emailed me their hacks and I took screenshots.

Perhaps we can build in some gallery functions directly into the Publish button in the X-Ray Goggles, since I imagine this will be a popular tool during the summer code party.

As a facilitator, it certainly helped to be familiar with the tools and to have played with them myself already.

I think encouraging future hosts to test a range of tools and have a ready repertoire is a good idea. As I’ve heard from other betatesters, you might need to adjust the agenda on the fly, introducing new tools to fit the interests and skill-levels of your participants.

Lastly, although I wrote up the host guide for the kitchen table event, I ventured far from it. That’s totally the intention, but I found it striking how little I followed my own instructions. I’m not sure I’d re-write the guide to match what I did in practice, but I’ll have to compare notes with the other betatesters to determine what parts of the guide are really valuable and which are just noise.

A huge thanks to my friends for joining me on a Sunday afternoon for some webmaking!

Hundreds of whiteboards and office snacks later, I’m happy to say we ended the sprint with:

• A simplified event menu married to Mozilla’s learning offerings
• Sweet mockups for make.mozilla.org/events
• A platform solution for creating, importing and aggregating Mozilla-related events
• User-friendly How-Tos for planning an event
• A summer campaign to encourage young people to learn code around their kitchen tables
• A mullet

A word about mullets

First impressions go a long way. When people hit a website for the first time, they’re partaking in a complex calculation to determine if the site is even worth the server space it’s hosted on.

Give people a clean, inspiring and relevant first page, and after a few clicks in, they’re less likely to write you off if the design isn’t perfect or the copy not as crisp.

This is called the mullet principle: fresh & well-groomed in the front, stray & straggly in the back.

With this model in mind, we set about making our event mullet site. And bad coiffure puns along the way.

Even simpler event menu

I’ve been blogging darn near exclusively about the event menu. It was a joy at the sprint to realize that we can get it even simpler and more fitting to our needs.

Here’s what we came up with:

Kitchen Table — Learn with friends

2 – 10 people. 1 hour. At home or a cafe.

The kitchen table, if it goes well, has the potential to be the most interesting event type.

Inspired by the Brooklyn Kitchen Table Coders and Mark’s insight into the value of informal, at home learning with friends, (see also Webcraft Night), the kitchen table model is super simple, low-barrier to organize, and can be repeated dozens of times with variations on whatever you’re keen to learn.

• Call your friends to come sit around your table.
• Explore a skill you want to learn. For example, try on the Hackasaurus X-Ray Goggles to start playing with HTML. Or swap in another tool or curriculum you like, such as Popcorn Maker, a Codacdemy lesson, a Scratch how-to, an MIT course, or whatever!
• Try it out yourself. Apply what you learned by making a little demo. In the Hackasaurus example, you can remix your favorite website. Share what you learned with your friends, and if you want, with the rest of the world.

Hack Jam — Make something

10 – 50 people. A day. In a spacious office or community space.

A hack jam is about teams building prototypes that create real world solutions. It works best when you mix in different skillsets and address a challenge or topic that you all care about.

We’ve been testing a variety of hack jams, and folks familiar with the tech world also know these events come in a range of flavors.

Here’s our recommended agenda, with the same invitation to hack it and make it your own!

• Race to 100 Ideas. Agree on a design challenge and rapidly sketch as many ideas you can. The students at Product Dundee have tested and documented this method to much success.
• Play with a new tool. Identify a tool or technique to help you build your idea. Teach others how it works, too. For example, you can try out Popcorn Maker if you’re interested in hacking on interactive video.
• Sprint to a minimum viable prototype. Work in teams to transform your idea into a prototype. In the Popcorn example, teams sprint to convert a filmmaker’s vision into an interactive demo for the web. Share what you made.

Pop Up — Build a community

10 – 100 people. A half day. In a school gymnasium, community space, or public library.

Recently we’re in touch with an fantastic network of people looking to seed a learning network in their city. From London to Tokyo and Toronto, and now San Francisco, Los Angeles and Pittsburgh, Hive Pop-Up events are happening everywhere.

Rising from the very real need to document the format, we recommend this agenda for throwing a learning party:

• Curate stations. Find local organizations and individuals who care about your topic and complement one another. Get them to propose table-top activities that take 5min, but can expand to more.
• Sample the offerings. Gather everyone in a large space with activities spread across stations. Invite participants to try out the different offerings.
• Play as long as you like. Participants stay at the stations as long as they like. Share back what you made at the end of the day.

I can haz learning

Laura Hilliger has written extensively about Mozilla’s learning philosophy and how it intersects with research-backed pedagogical methods.

She describes that a good lesson contains three parts:

• an orientational activity (icebreaker)
• an instructional activity (demo)
• a practical activity (design challenge)

And we realized that these learning categories fit neatly with our three agendas.

Each agenda, depending on its primary goal, focuses more or less attention to each of these activity types. A kitchen table gathering focuses on the instructional most, while a hack jam works on the design challenge. And since all of our events contain all of these learning activities, as the Mozilla Learning team continues to build out webmaker curricula, the event menu is set to grow with it.

Sweet Mockup

When it comes to mullets, it really helps to have a talented hairdresser on your team. Someone to style up the ‘do just right and get you past your skullet.

Thankfully, Jess Klein led the way and designed this landing page:

It’s not done yet, but what we really like so far is:

• a big, colorful image for each event conveying the scale and vibe
• simple navigation to toggle event types and discover the supporting materials
• a map that zooms into your location to show nearby events
• one-click event importer & creator to add to the shared calendar

And we already have a few tweaks for the next version:

• better visualize the “participation ladder” of the three events. Kitchen table is the smallest, then hack jam followed by pop up. The navigation should reflect this scale more intuitively.
• lead with what you’ll do at the event, rather than our shorthand names. For example, rather than say “kitchen table” in the nav, it should be “learn with friends”.

Obviously we’re in need of a copywriter, but that’s another story. ^^

If you click on “Find”, it’ll bring you to this page, which displays our shiny event aggregator as a huge map:

Aggregator

When people want to organize or attend an event, we’ve got to provide a simple way for them to “say, I’m doing this.” Ben Simon and I blogged before about how we need a good third-party solution and what the key feature requests might be.

We walked through our user stories again, discussing what our aggregator should support:

• A participant finding and signing up for an event
• An organizer creating an event
• An organizer importing an existing event
• Organizers and participants sharing what they made and giving suggestions for improving the program

There are deeper cuts of course to each, and I’m happy to share the details to anyone that’s curious, but the main conclusion was:

• No solution out there fits our feature requests 100%
• We need to support federated solutions. If an organizer has an online presence for an event already, it needs to be super simple to import it to the Mozilla calendar, if they choose.
• We need super simple event creation. If an organizer doesn’t have a page yet, we need a low-barrier, localization-friendly and HTML-ifable way to create an event.
• Participants must be able to search events by topic, event type, location, and date.
• Organizers must be able to communicate with participants before and after the event.
• Mozilla must be able to communicate with organizers before and after the event.
• Participants should have an easy opt-in to join the Mozilla mailings.
• The platform we use must abide by Mozilla’s rigorous privacy policy.

Given those criteria and a close examination of BlueStateDigital, the platform we currently use for Mozilla’s membership program and mailings, Ben & I realized that we already have our solution at hand.

It’s not perfect, and it will no doubt have its limitations, but given the demand to get a good aggregator up and running, plus already supporting our main user stories, BlueStateDigital (BSD) + a customized event importer seem like our solution.

How-Tos

Another aspect of running events is not only getting the right agenda, but getting help with all the nuts & bolts that go into it.

We looked at a number of event toolkits from other organizations: Maker Faire, TEDx, Mouse Corps, even Tupperware.

Our resounding conclusion was that these how-tos are way too wordy and often not relevant. People aren’t stupid, so we don’t have to explain every minute detail. But there are some frequently asked questions and places where you might get stuck.

Led by Laura and inspired by the Gidsy guide we’ve got a simple-to-use and eye-pleasing set of event how-tos, covering everything from how to get the right space, to mitigating budget items, to facilitation and documentation suggestions. (Link coming soon!)

There’s still a ways to go, especially on the road to pretty Gidsy-esque design. And I’m sure this is a resource we constantly revise. But it’s great that we can provide these how-tos as part of the event kit.

Summer campaign

And now, with all those bits above, we asked ourselves: how are people going to find out about this? How are we going to create momentum around webmaking events? How are we going to test our agendas and resources?

We’ve got a plan for a testing round from now until May, followed by a summer campaign.

Testbed

Each event agenda will be taken for a spin. Feedback and tweaks to the agendas will be rolled into the kit before launching the campaign in May.

• Kitchen Table: In late March, Mozilla staff & any interested community members will host kitchen table sessions at home with friends. Share back how it went.
• Hack Jam: Throughout March and April there are a number of Popcorn, Hackasaurus, and OpenNews hack jams on the calendar. We’re going to document how the events went in London, Cannes, Berlin, Lüneberg, Warsaw, and Buenos Aires.
• Pop Up: We’ve also got a round of pop ups on the horizon. If all goes well, we’ll have at least one tester in London, San Francisco, Los Angeles or Pittsburgh before May.

Campaign Time

From now until June, Ben & I will recruit and engage partners who might be interested in the campaign.

In early May we’ll announce the campaign officially with the /events site. Sign-ups and on-going recruitment until mid June.

In June (exact date TBD) there will be a day of webmaker action where people all over the globe host kitchen table sessions, hack jams, and all sorts of learning & making events for the web. It hopefully becomes part of the summer spirit, and people continue learning together with friends & family.

The summer will conclude with a final burst of activity with larger events in Mozspaces and with Hive networks.

Festival

All this webmaking action brilliantly sets up the Mozilla Festival, which will be Nov. 9 – 11 in London. Organizers and learners will come to London, share their experiences, and facilitate massive kitchen table sessions all throughout the venue.

What do you think about that plan?

Thanks!

It was a very productive week. A huge thanks to fellow sprinters: Jess Klein, Laura Hilliger, Ben Simon, Michelle Levesque, Lainie DeCoursy, and of course Mark Surman & Allen Gunn.

*Images: “Mullet” by Kyle Plante / CC BY-SA 3.0, and Event Site Mock-ups + Characters in Event Menu by Jess Klein.

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.

Next up in the round of event recipes, Brett & I wrote up a Popcorn learning lab.

Since publishing the Popcorn hack jams how-to, we’ve been in touch with film festivals, coder communities, and video labs from all over about running events about Popcorn.

Skill up the community

At the moment, we’re still in a resource-crunch. Even though we can help event organizers to plan and facilitate their hack jam, there’s a shortage of people who know how to use Popcorn.

The options we currently have are:

• fly around Team Popcorn, based primarily in North America
• or, skill up web developers the world over, empower them to code and facilitate, and reward core contributors with trips to cool places like Cannes and Cape Town.

The more we can train the trainers, the more we can scale these open projects.

Test Round in London

To test out the recipe and grow the European community, we’re throwing a learning lab on Sunday, March 25 in London.

We’re looking for Javascript developers and filmmakers bold enough to dabble with code. Drinks, code, and good ideas are in the mix at this one-day event led by the Mozilla Popcorn team. Please sign up to join!

Want to know what we’ll do in London, or how to host your own Popcorn learning lab? Read our howto.

Popcorn Learning Lab

A Mozilla Popcorn Learning Lab is an event to introduce developers and filmmakers to Popcorn.js, an HTML5 javascript library that integrates the web into media production.

Participants will create plugins, hack templates, and code a demo that easily remixes web content into video, using open tools and collaborative design.

You can organize a learning lab with this guide! (A huge shout-out to Julia for translating this into French)

Why Popcorn?

Well, besides it being fun Javascript library to play with, it’s a powerful tool to create web-enabled video. Christian Heilmann did a great job describing its strengths and opportunities:

• Video is typically hard to edit and change
• Video is often a black, unindexed hole on the web
• Separation allow for easier maintenance, enhancement, accessibility, and discovery
• HTML5 video is just another page element
• The timestamp is the glue
• Tap into the real-time web using Popcorn.js

Demos also speak loudly about Popcorn’s possibilities. Take a look!

What

Participants will get their hands dirty by sharing hacks and peer-reviewing projects. Demos from the Popcorn community provide inspiration and running code to build from.

The motto: Learn by sharing and making!

Learning Labs can be hosted in partnership with Mozilla, who provides facilitation experience and extensive knowledge of the software, and by community members versed in Popcorn.

Mozilla will work with partners to ensure participants leave with a deeper understanding of Popcorn’s possibilities and how to teach others.

Learning Labs can also be self-organized following this handy guide!

Who

Teams consist of:

• Web developers skilled in Javascript
• Bold filmmakers wanting to play with cod
• Experienced Popcorn.js contributors

Small teams of web developers are paired with experienced contributors. Facilitators and web designers are also key roles at the learning lab.

How

Pre-Learning Lab Engagement

Mozilla and partners contact Popcorn community members, Javascript developers, and filmmakers in the area. Through lightweight interviews with sampling of participants, the organizers calibrate the skill levels and interests of the group, fine-tuning the agenda around what people want to learn and make.

Agenda

All the participants and facilitators meet for a group demo. Popcorn contributors walk through the basics of the Javascript framework, highlighting use cases and possible avenues of development.

In the first hacking session, depending on technical skill, participants choose to:

• play with Popcorn Maker — an authoring environment for interactive video — and turn a video interactive.
• or dive into coding a plugin, a powerful way to bring in another service, like Flickr, OpenStreetMap, DocumentCloud or many others, to respond to video.

After busting a hack, the group shares back what they made. Participants give feedback, file bugs, offer help, and note ways to improve the experience.

In the second hacking session, you can:

• create your own Popcorn Maker template
• start making a demo
• keep coding your plugin
• or float & help others.

Participants code their project, giving feedback and checking in with more experienced contributors if they get stuck.

At the end of the day, a screening and party is held. Each group demos their final code, evaluates the process, and celebrates all the hard work.

Afterward, participants sign up for activities they’re interested in: joining upcoming events, contributing code to Popcorn.js, teaching other developers, or just staying informed about the project.

Resources

• At least one computer per team.
• Video-editing software as well as a fast, modern browser.
• Popcorn.js installed.
• Video files for each demo.
• Reliable wifi.
• Power outlets.
• Projector with suitable adapters
• Meals – events should be catered
• Amenities such as coffee, water, and snacks.
• Travel support to the learning lab, where needed.

Case Studies of Popcorn Events

Independent Television Service (ITVS) + Mozilla, San Francisco. http://www.wired.com/underwire/2011/10/coders-filmmakers-popcorn/all/1 Video: http://mozillapopcorn.org/the-living-docs-hack-day/

“ButterCamp”, NYC, March 2011. http://mozillapopcorn.org/videoblog-buttercamp/

Mozilla Festival, London. November 2011. http://mozillapopcorn.org/what-we-made-at-mozfest/

Photos: CC BY-NC-SA by Jonathan Mcintosh

Version 0.3

Rolling in the feedback, the latest version of the event menu is simpler still:

(PDF)

We decided to go for the Holy Triple. The menu should be streamlined and simple. There are places to share all the other crazy formats in development (see below), but when people come to Mozilla for the first time, having clear calls to action help.

The new menu now contains three event types: meet-up, learning lab, and hack jam.

Importantly, we removed the fireside chat from the core offering. I think this decision is keeping with our philosophy of interactive events (you’ll have more decentralized conversations at a meet-up than in a fireside chat). Plus we continue to face technical challenges to online discussions.

We also omitted the Mozilla Festival, as it’s not (at least at this time and in its current format) an event that an organizer would come across and run on their own.

Other changes in this version include a clearer call to action: “What do you want to organize?” and an invitation to hack the menu. We always planned for the menu to be bendable to suit an organizer’s appetite, but including an explicit invitation to do so is more with the Mozilla spirit and hopefully helps people see this tool as a guide, not a prescription.

With William Quiviger from the Mozilla Reps program, we talked about iconizing information like prep time, participant size, and estimated cost. I still think this is smart information to include, but failing good design, I wasn’t able to work it in without distracting from the menu. Perhaps the next version can play with those elements.

Very keen to hear your thoughts on this!

Mozilla Menu Extras

Seeing the success of the Hive Pop-Ups, most recently in Tokyo and forthcoming in Toronto, we’ve talked about how to better offer additional event formats that may not be our core calls to action, due to complexity, resources required, and other reasons, but still very powerful and templatable.

I see these as advanced formats, or in keeping with the menu metaphor, “extras” that can spice up a meal. There is a huge opportunity to develop resources & communities of practice that drive these formats as well, and therefore, here’s a cut at the Mozilla Menu Extras:

(PDF)

The extras include: fireside chat, idea jam, science fair, pop-up, and the Mozilla Festival.

What do you think?

Where from here?

We’re continuing to collect feature requests for an online event platform as well as conducting an audit of 3rd party event sites.

There will also be a sprint at the end of the month in San Francisco to 1) wireframe our online event presence and 2) create a punchlist of resources for event organizers.

In the meantime, Laura Hilliger is leading efforts to adapt the Hacksaurus Hacktivity Kit and our event resources to P2PU. The platform is home to a learning community that could help share and vet these resources, plus build in the peer-to-peer mentoring model we hope to grow towards. Laura is also thinking deeply about how to overlay Mozilla’s webmaker curriculum onto the event menu, which is quite exciting.

As this loooong post shows, there are lots of places where the input from experienced organizers and community members would really help focus and improve these efforts. We’d love to hear from you if this is on track, and if these tools help serve your needs!

As part of the on-going efforts to help webmakers the world over build & learn together, we’re collecting specs for event infrastructure. The Mozilla event menu is a piece of this, guiding community members to the event formats that best suit their needs and interests.

Once they’ve decided on an event type, organizers need a simple way to write up the event, spread the word, communicate with participants, and track outcomes.

Feature Requests

Thanks to conversations with Ben Simon, Jess Klein, Ross Bruniges, Matt Thompson, and others, we’re getting crisper on what features are essential to the Mozilla event infrastructure.

As an initial strawman, I proposed these features:

• super simple event creation & categorization
• localization-friendly
• easy & secure data portability
• good developer APIs
• participant email capture and ability to mail them

I also think payment support is important, but not essential. At first, I argued strongly for it, because some organizers may need to recoup costs. But perhaps this is addressed by clearer sponsorship options and encouragement to use additional payment services, rather than a core requirement of our event infrastructure.

Another bonus feature is if the tools are already widely used and familiar to our communities. I think this is important for ease-of-use and discovery. For example, my friend Johannes uses Lanyrd to explore interesting upcoming events. Just yesterday he booked tickets to a festival he just discovered on Lanyrd that day. This suggests that if we don’t use popular listing sites, we miss out on potential participants. At the very least, strategic cross-posting should be encouraged.

Ben Simon has written an excellent post in response to the feature requests strawman. In it, he argues for these additional functions:

• Ability for event organizers to organize over time: Communicate with participants before & after an event, plus allow sign-ups for single instances & repeated events
• Groups: Search & find relevant events by geography, theme, skill level, etc.

Both of these are right on the money in terms of what we want our event infrastructure to support.

Prioritizing

Big questions we have now are:

• Are the above features the most important?
• Are we missing any?
• And, once the list looks right, how to we deploy/build the infrastructure?

Over the coming weeks, I’m hoping to chat with people who’ve already organized events like the talented Heather Payne in Toronto (check out her upcoming Hive Toronto Pop-Up), Mozilla Kenyans Cliff Argwings & Alex Wafula and Product Dundee’s Jon Rogers & Mike Shorter, as well as people who’ve expressed interested in hosting something like Nick Doiron from CodeforAmerica, Christian Villum from Platform4, and Henrik Sandklef from FSCONS.

I’d like to get feedback on whether we’re prioritizing the right features and what would be helpful for them in future events.

There is also a big effort at the Mozilla Corporation to improve their event infrastructure, and we should definitely sync up & share solutions as much as possible.

3rd Party Audit

In parallel, we’re preparing for an audit of 3rd party event sites.

Considering there are companies that spend all of their time building event platforms, I argue that we should use those services, insofar they meet our needs, rather than coding something from scratch and maxing the bandwidth of our software team.

Ideally, the 3rd party site will feed into make.mozilla.org, a yet-to-be-coded aggregator for all the Mozilla webmaker activities.

On the list to investigate:

• Lanyrd
• Eventbrite
• Meetup
• 350.org
• Controlshift (still being built)
• BlueStateDigital (which we currently use for some events and for Mozilla’s membership program)
• also the Mozilla wiki, Where is Mozilla? and other in-house solutions

What other event sites do you really like? What do you use or see other people using well?

Images by Cyberdees from the Knight-Mozilla Hack Jam in Dundee.

As described in the last post, we’re working on general event types that can plug in Mozilla’s programmatic content. See the Mozilla Event Menu Lite for more background.

Brett Gaylor and I took a first stab at a hack jam kit for video-makers. This kit builds on previous workshops run by Brett & the Popcorn team together with partners like Independent Television Service (ITVS) and Bay Area Video Coalition (BAVC). This piece in WIRED summarized the recent ITVS jam quite well.

This is the draft we sent to a few film festivals and other video-related programs looking to host hack jams for Popcorn. You can also grab the PDF or check out the wiki page. Let us know what you think — and if you’re interested in getting involved!

Mozilla Hack Jam for Video-Makers

What

A Mozilla Hack Jam for Video Makers is a two-day event that teams up video makers with web developers. Interactive video projects are built from concept to running code over the course of the event, using open tools and collaborative design.

Every team is expected to make a “minimum viable product” that works, albeit roughly, by the end of the hack jam.

The motto: Less yak, more hack!

Participants will learn about the power of web cinema, how to develop projects based on their interests, and about the benefits of collaboration and working in the open.

Hack jams can be hosted in partnership with Mozilla, who provides facilitation experience and extensive knowledge of key software, in particular Popcorn.js, a Javascript library for HTML5 video.

Mozilla will work with partners to ensure participants leave with both a deeper understanding of the web as a storytelling medium and improved video projects.

Hack jams can also be self-organized following this handy guide! PDF

Who

Teams consist of:

• Video-makers with an existing project
• Web developers skilled in Javascript

Each video project is paired with at least one developer. Facilitators and web designers are also key roles at the hack jam.

How

Pre-Hack Jam Engagement

Mozilla and partners identify the participating video projects. Ideal candidates are video-makers with existing video and a vision for improving it with interaction on the web.

Through lightweight interviews, each video-maker is paired with a web developer whose interests and skill-set meets the video-maker’s vision.

The newly-formed team discusses the vision determine if any further preparation should be done in advance of the hack jam.

Agenda

All the participants and facilitators meet on Day 1 for a group briefing. Demos of web cinema, including common templates and plugins, are shown and discussed. If needed, a quick crash-course on Popcorn will be provided. Each project presents it’s vision for the hack jam.

The group breaks into the small teams and determine how they’ll work together. Some might use napkin-sketches to quickly test ideas and interfaces. Some might already have code prepared. Some might address shared problems and team up. This is where facilitators can be especially helpful ensuring each team makes the most out of the time together.

Two-thirds through Day 1, projects should be writing code and creating the broad strokes of their experience. Day 1 ends with a group recap of where each project stands and would like to achieve the next day.

Day 2 opens with a quick welcome, and teams go to work on their project. The remainder of the day is a “sprint to the finish”, always with the expectation that teams will “ship” a final project at a screening and party.

A screening and party is held in the evening of Day 2 to demo final projects, collect feedback, and to celebrate all the hard work.

Before leaving, participants should decide on next steps for their projects. Examples include: continue hacking at an upcoming event, fold outcomes into an existing project, or publish results from the hack jam. Decisions on next steps are shared with the group and key stakeholders.

Resources

• At least one computer per team.
• Video-editing software as well as a fast, modern browser.
• Popcorn.js installed.
• Video files for each project.
• Reliable wifi.
• Power outlets.
• Projector with suitable adapters
• Meals – events must be catered
• Amenities such as coffee, water, and snacks.
• Travel support to the hack jam, where needed.

Case Studies

Independent Television Service (ITVS) + Mozilla, San Francisco. http://www.wired.com/underwire/2011/10/coders-filmmakers-popcorn/all/1 Video: http://mozillapopcorn.org/the-living-docs-hack-day/

“ButterCamp”, NYC, March 2011. http://mozillapopcorn.org/videoblog-buttercamp/

Mozilla Festival, London. November 2011. http://mozillapopcorn.org/what-we-made-at-mozfest/

Bay Area Video Coalition + Mozilla (For youth), San Francisco. http://mozillapopcorn.org/bavc/

Photos: CC BY-NC-SA by Jonathan Mcintosh

The most resounding feedback was: “great to see this overview, but there’s too much stuff!”

So much of the revisions in version 0.2 are about cutting back. We asked ourselves what are the clear calls to action for participants versus an overview of all the event types the Mozilla Foundation is working on.

Version 0.2

To that end, this new version is a cleaned-up, “lite” menu (pdf).** Rather than paralyzing people with too many choices, it’s about giving simple options — which of course can be hacked and remixed as preferred. This is hopefully a step towards making this model more accessible and scalable.

Together with colleagues Jess Klein, Ben Simon & Matt Thompson, we spent a while crafting the language. Let us know what you think!

Criteria

Criteria for the event names included:

• Comprehension. Mozilla has a history of rapid neologisms. We tried to stick with words commonly used, even outside of the Mozilliverse. While we are assigning specific meaning to some of the terms, many people can at least grasp part of the word and decipher what the term as a whole could mean. This is especially important for events, which will invite in a lot of new people who may not be familiar with our jargon.
• Current Usage. That said, we didn’t want to default to names not in use at Mozilla. So we tried to strike a balance between quick comprehension and currency among existing projects. That’s why “fireside chat”, “learning lab”, and “hack jam” have been retained: we’re already using these terms in our programs.
• Localization-friendly. We recognize parts of the event names are a little Anglo-centric, but we hope that at least the general term is readily translatable into other languages. If you have suggestions or feedback about this aspect, that is particularly helpful. We hope that these events are accessible across many languages and cultures as well.

Event Types

We’ve kept the same structure as Version 0.1, but focused on five events, instead of a baker’s dozen:

• Meet Up — A fun, local gathering for people with shared interests in webmaking. Meet friends, new and old, to discuss projects in a relaxed setting. 2hr – until drinks run out.
• Fireside Chat — Thoughtful, informal presentation from a subject matter expert followed by discussion. Learn about a program or webmaking idea. Online or in person. 1 hour.
• Learning Lab — A simple learning activity for the classroom, a workshop, or the pub. Learners become teachers. Suitable as a one-off or part of a curriculum. 15 minutes – 1 day.
• Hack Jam — Design, code, and build solutions to real-world challenges. Bring skills together. Test and iterate with users. Share outputs with global community. 2hr – 2 days.
• Mozilla Festival — A yearly celebration of webmaking that blends the activities above and then some. It brings together hundreds of passionate people to explore the open web and to chart the way for the future.

Each of these events will have resources that pull from Mozilla’s webmaking programs: journalism, video-making, and youth education.

As an example, you can do a Hack Jam for video-makers by plugging in the Popcorn module into the general hack jam kit. We’ll provide quick recipes for how to do that. If you’re feeling ambitious, you can then remix the event further by adding in a youth education module or a Learning Lab kit, depending on your need and interests.

At events Mozilla directly organizes, we’ll also follow the same recipes, which not only makes life easier, but also helps us understand if these tools and resources work. Dogfooding the menu, if you will. ^^

What’s Next

My goal over the next month is to work with community members and colleagues to scope the supporting resources and the platform around events so that organizers and participants have a simple way to get involved, give feedback, and run with this stuff.

A huge thanks to Henrik Mitsch and Alina Mierlus for their suggestions on this version!

Next up, I’ll share an alpha version of the Hack Jam for video-makers kit, plus give an update about the Mozilla event calendar and plans for make.mozilla.org, our new home for webmaking galore.

Images: “Meet the Makers” by Mozilla Popcorn team and “Paper Prototyping at NYSCI hack jam” by Mozilla Hackasaurus

Together with the talented Anna Lena, we converted the Mozilla Event Menu into a stop-motion video.

We had a lot of fun producing the video: we found a good iPhone app, iTime-Lapse, to take the pics, and thanks to Tom from Betahaus/Open Design City, we drilled together a tripod to hold the phone above our scene. Then, after a scavenger hunt to find all the props, we shot the video.

(Score! That’s the first time I’ve used the < video > tag on my blog.)

I hope to keep hacking on a Popcorn-ified version of the video over the coming weeks, plus the next iteration of the event menu, thanks to a lot of great feedback from the Mozilla community.

A huge thanks to Anna Lena for all the help and to Betahaus’ Open Design City for all the gear and the create, inspiring environment.

Music: “Hustle” by Kevin MacLeod / CC BY 3.0 Unported Video: “Mozilla Events” by Michelle Thorne & Anna Lena Schiller, CC BY 3.0 Unported