Thursday, November 17, 2011
Hello Mozillians
Last weekend I had the opportunity to go to MozCamp EU in Berlin . It was a truly inspiring experience- meeting community members from all over the world. I really learned a lot about localization. It was at once exciting and educational for me to learn to the extent that I did about how to reach a global community with my work from a global community. There were so many new faces and names, I just wanted to take this opportunity to say hello and how honored I am to be amongst you.
Monday, November 7, 2011
Prototyping Win for Hackasaurus at Mozilla Festival
This past weekend the Hackasaurus team was part of the Media, Freedom and the Web conference in London. 3 days = Hive London Pop Up for youth, 3 design challenge sessions + 2 game prototypes for the project. Whew! I thought it would be fun to re-hash the design challenge that we did with participants, because we ended up with 2 really useful prototypes that got me thinking about the future direction of the project.
We framed our design challenge prior to the festival as:
We had over 2 dozen participants- including teenagers, teachers, developers, designers, journalists, community activists and game-makers
HACK THE DANCE
The workshop started with our hack-the-dance icebreaker that we do with youth at hack jams. We did this because a) it's a whole lot of fun and b) we wanted to set the tone that we were building playful interactions for youth to learn HTML and CSS using the Hackasaurus X Ray Goggles.
BRAINSTORMING
After we got loose, we kicked off with a brainstorm game. Everyone broke into groups and were given three cards- a learning goal, a mechanic and an end product and they had to come up with a concept for a Hackasaurus learning project based on that. We played 3 rounds, and in each round the participants were given the chance to write - in more and more information on the cards.
As a result- we came up with about 7 different ideas for what we could prototype. We defined prototyping really loosely- it could be a storyboard, a sticky sketch, a tweet, an interactive website- whatever you needed to do to just communicate your IDEA.
Participants self-organized into groups and by the end of the day we had two distinct projects: Doctor Web and Hacker Battle.
Even though the groups started out with 2 ideas- after numerous iterations and sketches, the concepts morphed. For example, one group- started out with this idea for a Popcorn.js curated Hack gallery for users to display their remixed websites- however, after pitching to our group and getting feedback and iterating on the concept- that exact idea turned into a Hack Battle game where participants could post their hacked websites up on to a challenge page and compete against other users who changed the code on the same website.
THE PROTOTYPES
Title: Doctor Web
Concept: You are a doctor responding to a medical emergency! Your interns incorrectly fixed a patient (Website Master) and now he is a complete mess. It's your job to dig into his HTML and CSS to fix him up- but hurry up before his health completely depletes!
Interactive Prototype:
Concept: After learners remix a website - they can submit their hack into the Hack battle where website visitors vote on the best hacked version of whatever website the learner started from.
Interactive Prototype: here
DEMO + BEYOND
We demo-ed the prototypes at the Mozilla closing circle and received some positive feedback. So what now? I feel very excited about the possibility of these prototypes because they fill two voids in our project: Doctor Web gives users a playful introduction to both the X-Ray Goggles and HTML/CSS and Hack Battle provides a social, community space for users to collaborate and communicate.
We need to continue building out these prototypes. One of the great things about the Festival was that we had the end-user in the room with us developing, that is- a teenager. Also- we had a plethora of experts helping to design these experiences. Let's continue to work together- because, clearly, the power of numbers and the diversity of community members engaged in webmaking and media-making has proven to be a huge win for us.
We framed our design challenge prior to the festival as:
Interested in making a hackable comic book featuring superheroes of the open web? Or maybe an interactive story embedded with quests for webmakers? We want you to bring the spirit of the Hackasaurus design jam- online -- with a self-directed learning experience on www.hackasaurus.org. This is an opportunity to think creatively about how to teach HTML and CSS to middle school aged youth (10-15 year olds). We have designed a toolkit for Web designers and developers, that will give you all of the assets that you need to create an engaging online activity.WHO SHOWED UP?
We had over 2 dozen participants- including teenagers, teachers, developers, designers, journalists, community activists and game-makers
HACK THE DANCE
The workshop started with our hack-the-dance icebreaker that we do with youth at hack jams. We did this because a) it's a whole lot of fun and b) we wanted to set the tone that we were building playful interactions for youth to learn HTML and CSS using the Hackasaurus X Ray Goggles.
BRAINSTORMING
After we got loose, we kicked off with a brainstorm game. Everyone broke into groups and were given three cards- a learning goal, a mechanic and an end product and they had to come up with a concept for a Hackasaurus learning project based on that. We played 3 rounds, and in each round the participants were given the chance to write - in more and more information on the cards.
As a result- we came up with about 7 different ideas for what we could prototype. We defined prototyping really loosely- it could be a storyboard, a sticky sketch, a tweet, an interactive website- whatever you needed to do to just communicate your IDEA.
Participants self-organized into groups and by the end of the day we had two distinct projects: Doctor Web and Hacker Battle.
Even though the groups started out with 2 ideas- after numerous iterations and sketches, the concepts morphed. For example, one group- started out with this idea for a Popcorn.js curated Hack gallery for users to display their remixed websites- however, after pitching to our group and getting feedback and iterating on the concept- that exact idea turned into a Hack Battle game where participants could post their hacked websites up on to a challenge page and compete against other users who changed the code on the same website.
THE PROTOTYPES
Title: Doctor Web
Concept: You are a doctor responding to a medical emergency! Your interns incorrectly fixed a patient (Website Master) and now he is a complete mess. It's your job to dig into his HTML and CSS to fix him up- but hurry up before his health completely depletes!Interactive Prototype:
Title: Hack Battle
Concept: After learners remix a website - they can submit their hack into the Hack battle where website visitors vote on the best hacked version of whatever website the learner started from.Interactive Prototype: here
DEMO + BEYOND
We demo-ed the prototypes at the Mozilla closing circle and received some positive feedback. So what now? I feel very excited about the possibility of these prototypes because they fill two voids in our project: Doctor Web gives users a playful introduction to both the X-Ray Goggles and HTML/CSS and Hack Battle provides a social, community space for users to collaborate and communicate.
We need to continue building out these prototypes. One of the great things about the Festival was that we had the end-user in the room with us developing, that is- a teenager. Also- we had a plethora of experts helping to design these experiences. Let's continue to work together- because, clearly, the power of numbers and the diversity of community members engaged in webmaking and media-making has proven to be a huge win for us.
Subscribe to:
Posts (Atom)