Webmakers/Projects

From MozillaWiki
Jump to navigation Jump to search

6907867555_eeda62c030.jpg

Help test these new Webmaker Projects

Help kick the tires on the beta projects below. Are they easy to use? Helpful for learning? Fun?
Let us know by filling out this super fast and easy survey:


Tell us what you think



What are these "Webmaker Projects," anyway?

Learning by making, hacking and playing. Webmaker projects are designed to help you make something amazing on the web fast.

Using Mozilla Webmaker tools like Popcorn, Hackasaurus, and Webpage Maker, you can:

  • remix any web site to make it your own,
  • make your own pages, web videos and other great stuff in a matter of minutes,
  • learn the basics of webmaking skills like HTML and CSS along the way.

We're preparing a set of these projects for the Mozilla Summer Code Party. The goal: teach the world the basics of coding and webmaking. Through bite-sized experiences that are easy, social and fun. We'll also invite contributors and partners to share their own webmaker projects as well, creating a ginormous summer cyclone of making, hacking and ninja-fication.

Tell us what you think

We're looking for brave beta testers like you for the prototype projects below. In particular, we're looking for your feedback on questions like:

  • Are the projects easy to use? Where do things feel confusing or broken? Is it easy to dive in and get started fast?
  • Are they fun? That's crucial! Where are they most fun? Where do they lag?
  • How could they be better? We'd love to hear your specific feature requests, suggestions and aha moments.

Webmaker Beta Projects

Make your own meme

Internetfamous.jpg

Do you have what it takes to go viral and become internet famous? Prove it. This project let's you use your HTML and CSS swagger to create your own web page -- featuring a meme to conquer all internet memes. Let your inner serious cat or Ryan Gosling hey girl shine.

Tools used:WebPagemaker Skills: HTML & CSS, design thinking Difficulty:Intermediate

GO!


Play hackable games in the web arcade

Arcademap.jpg

HTML is a funny-looking language. It's written in brackets like <this> and </this> and sometimes uses quotes "like this." In this project, you journey through the world of HTML by exploring the syntax behind it. Use the comments written */ between these */ signs to navigate your way. Your goal: unlock a broken map of the web arcade to activate new missions and explore brave new webby worlds.

Tool:Webpage Maker Skills: HTML Difficulty:Easy

GO!

Webstructables: make a tutorial

Webstructables.jpg

Have you always wondered "why people don't get hand turkeys right? or why it is hard for some to sleep at night? " Well the time has come for you to make your contribution to the world of the open web and create a fine webpage tutorial using your HTML & CSS and Popcorn wisdom.

Tool:WebPagemaker Skills: HTML & CSS, Popcorn, teaching others Difficulty: Advanced

Click here to Make It

Stuck in the 90s

Stuck90s.png

Everyone has an embarrassing moment. For the Web that moment was in the 90s. Back then websites were boxy and ugly - kind of like this page! Wrangle your HTML and CSS style powers to change the content, the colors and the layout so that this webpage doesn't feel like its stuck in the 90's anymore...

Tool:WebPagemaker Skills: HTML & CSS, designing for the web Difficulty:Intermediate

Click here to Make It

Hack a Commercial

Popdiy.png

Add your own voice to an old commercial by adding popups and commentary using the Mozilla Popcornmaker. In this DIY activity, you can change meanings, extend messages, and otherwise recontextualize the video using the ever popular "Pop Up Video" template.

Tool:Popcornmaker Skills: hacking, designing for the web Difficulty:Intermediate


Click here to Make It

Inanimate Alice DIY

Iathumb.png

A user generated digital novel and Hackasaurus X-ray Goggles, what better tools to engage the future generation of webmakers! The mission is to teach the basics of coding through the lens of youth interest in storytelling. This challenge invites youth to creative a narrative based on characters and a storyline they create, while learning how to remix the web.

Tool:Hackasaurus Skills: HTML & CSS, writing, writing for the web Difficulty:Beginner

Click here to Make It