|Hackasaurus Project Page|
|Owner: Atul Varma, Jessica Klein||Updated: September 2011|
|Hackasaurus helps kids hack.|
Check out our web site
Get involved now
- Attend an upcoming hack jam. Or organize a hack jam in your community. We're looking to spread to new cities beyond New York and Chicago. Get in touch through our mailing list.
- Start hacking with Hackasaurus tools like X-Ray Goggles.
- Share your own ideas, tools and resources. Through our mailing list or on twitter.
- Become a Hackasaurs partner. We're looking for learning centers, libraries, media centers and other partners to help design, develop and host Hackasaurus. Get in touch through our mailing list.
- Help develop the Hackasaurus tool set. Through our issue tracker and Github.
About this project
- The project in 5 sentences:
- Hackasaurus helps teens hack. Through tools that makes it easy for youth to explore, remix and redesign the web.
- Plus local events or "hack jams" that make hacking and digital literacy easy, social and fun.
- We're designing around the way kids learn technology, based on Mizuko Ito's concepts of hanging out, messing around and geeking out.
- Tools in development so far include HTML Pad and X-Ray Goggles, with more on the way.
- You can get involved by test-driving Hackasarus tools right now. Or attend an upcoming hack jam, organize your own event, help develop the Hackasaurus tool kit, or share your own ideas and tools.
How to host your own Hackasaurus event for Youth
- Hacktivity Kit: Step by step instructions for running your own hack jam (PDF, 2.3MB)
- Hackasaurus Slides: An HTML5 remixable slide show.
- I.T. Checklist (PDF, 164KB)
- X-Ray Goggles Cheat Sheet: A quick reference printable for the X-Ray Goggles tool, highlighted hot keys (PDF, 257 KB)
- One-page overview
- Draft in progress here: http://etherpad.mozilla.com:9000/Hackasaurus-one-pager
- Frequently Asked Questions (F.A.Q.):
- Draft in progress. Please add your questions here: http://etherpad.mozilla.com:9000/Hackasaurus-FAQ
- Draft in progress at Hackasaurus/Roadmap
- Project infographic: coming soon
- Hackasaurus "Hack Jams" are one-day and weekend events that allow kids to test and help design Hackasaurus.
- They're run through the New Youth City Learning Network in collaboration with Mozilla.
- Hackasaurus jams are designed to be modular and self-organizing. So that any teen, parent or organization can organize their own.
- Event curriculum and an organizing kit are under development.
These tools are still evolving and have rough edges, but their basic functionality is available now. They're also actively being used at jams.
"X-Ray Goggles" allow anyone to easily “see through the surface” of any Web page, and obtain an intuitive understanding of how pages are composed. They can be used anywhere on the Web one hangs out, and casual use of the tool enables one to gain a rudimentary grasp of HTML, CSS, and the Document Object Model.
Other comparable tools to HTML Pad
- WYMEditor, aka What-You-Mean-Editor (WYSIWYG editor, exposes structure similar to X-Ray Goggles)
Tools that many kids are already using to make web sites:
- Colorzilla (Firefox add-on)
- Measure It (Firefox add-on)
- Platypus (Firefox add-on)
- GreaseMonkey (Firefox add-on)
- Firebug (Firefox add-on)
- Erkie's Ad Destroyer (bookmarklet)
- Katamari (bookmarklet)
- Whatfont (bookmarklet)
- Westciv's XRAY (bookmarklet)
- DOM Monster (bookmarklet)
- Wirify Wireframing Tools (bookmarklet)
- BuildorPro (web app)
- CSSDesk (web app)
- DesignBlocks: a Scratch-like programming environment for artists interested in creating Processing programs. Working prototypes in HTML5/JS: http://www.kickstarter.com/projects/evhan55/designblocks-visual-programming-for-artists
- Bricolage: Example-Based Retargeting for Web Design http://hci.stanford.edu/research/bricolage/
- Shiftspace http://www.shiftspace.org/
Tutorials and reference materials:
These don't necessarily have anything directly to do with Hackasaurus or the Web, but we've found them helpful or inspiring in other ways.
- ilearnedtoprogram.com - Testimonials from people who learned how to program.
- 826 National - See Atul's post on What Mozilla Can Learn From 826 National for more information on why this is relevant.
- StarLogo TNG
- Taylor Bayless, YouMedia
- Jess Klein, New Youth City Learning Network
- Jack Martin, New York Public Library
- Ben Moskowitz, Mozilla
- Matt Thompson, Mozilla
- Rafi Santo, Indiana University
- Chris Shoemaker, New York Public Library
- Atul Varma, Mozilla
- Richard Milewski
Videos & Multimedia
<video class="video-js" width="480" height="270" poster="" controls preload>
<br /> <img src="http://videos.mozilla.org/serv/webmademovies/hackasaurus-still-from-dml.jpg" width="480" height="270" alt="Poster Image"><br /> [<em>There's an HTML video here—load this post with your open-video enabled browser</em>.]<br /> </video> </div> == Project Tools == *'''web site''': [http://www.hackasaurus.org/ hackasaurus.org] *[http://hackasaurus.org/en-US/goggles/ '''X-ray Goggles''']: See what the web is made of. Mess around & remix. *[http://htmlpad.org/ '''HTML Pad'''] (aka "Magic Ink"): A simple website that allows anyone to easily create a Web page, collaborate on it in real-time with friends, and share it with the rest of the world. ''More background for HTMLPad can be found in Atul's blog post entitled ''[http://www.toolness.com/wp/2010/10/prelude-to-barcelona/ ''Prelude To Barcelona.'']<br> <br> ---- *'''Drumbeat project page: '''[https://drumbeat.org/en-US/projects/hackasaurus/ https://drumbeat.org/en-US/projects/hackasaurus/] *'''wiki page:''' [https://wiki.mozilla.org/Drumbeat/Hackasaurus https://wiki.mozilla.org/Drumbeat/Hackasaurus ] *'''mailing list''' (working group; daily): [http://groups.google.com/group/hackasaurus Google Group] *mailing list (announce list; occasional): ''coming soon''<br> *planet hackasaurus blog: ''coming soon'''''<br>''' *'''twitter''': [http://twitter.com/#!/hackasaurus @hackasaurus] [http://twitter.com/#!/search/%23hackasaurus #hackasaurus] *'''facebook''': [http://www.facebook.com/#!/pages/Hackasaurus/140459162682866 http://www.facebook.com/#!/pages/Hackasaurus/140459162682866] *'''photos & visual assets '''(tag = hackasaurus)''':''' [http://www.flickr.com/groups/hackasaurus/ http://www.flickr.com/groups/hackasaurus/ ]<br> *'''issue tracker''': [http://hackasaurus.lighthouseapp.com/projects/66492-hackasaurus/overview http://hackasaurus.lighthouseapp.com/projects/66492-hackasaurus/overview] *'''source code''': Github: https://github.com/hackasaurus'''<br>''' *'''theory behind the project: Hacker Literacy''': http://ietherpad.com/wXmjT3Zes1'''<br>''' *'''presentation deck '''(draft only; in progress): http://mzl.la/hQ2h62 *chat room (IRC): irc.mozilla.org #hackasaurus (chat is archived at [http://irclog.gr/#browse/irc.mozilla.org/hackasaurus irclog.gr]) *roadmap: [[Hackasaurus/Roadmap]]<br> *community calls: ''coming soon''