Webmakers/Projects

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 fast and easy survey:

Tell us what you think

What are these "Webmaker Projects," anyway?

Learning by making. 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:

• take apart and remix web sites,
• make your own webpages, interactive videos and other cool stuff in minutes,
• sharpen your webmaking skills. From HTML and CSS to fancy stuff.

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 games, projects and recipes that are easy, social and fun. Partners and contributors will be able to share their own webmaker projects as well.

Webmaker Beta Projects: test 'em out now

Make your own meme

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:Webpage Maker Skills: HTML & CSS, design thinking Difficulty:Intermediate

Hack the web arcade

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: fix a broken map of the web arcade to unlock new missions and explore brave new webby worlds.

Tool:Webpage Maker Skills: HTML Difficulty:Easy

Make ugly '90s pages pretty

Everyone has an embarrassing moment. For the web it was 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, colors and layout to drag these webpage out of the grungey '90s.

Tool:Webpage Maker Skills: HTML and CSS, web design Difficulty:Intermediate

Remix your own TV commercial

Add your own voice to a cheesy 1950s TV commercial! Add pop-ups and commentary, change meanings, and hack pop culture using Mozilla Popcorn.

Tool:PopcornSkills: remix, web design Difficulty:Intermediate

Create your own "Inanimate Alice" story

This project uses the popular "Inanimate Alice" interactive novel and Mozilla Hackasaurus to create narrative mayhem. Youth can create their own narrative using characters and a storyline they create, learning how to remix the web along the way.

Tool:Hackasaurus Skills: HTML & CSS, writing, storytelling Difficulty:Easy

Make your own "webstructable" how-to

This project lets you create your own web page tutorial. Use your new-found HTML, CSS and Popcorn wisdom to create the world's greatest how-to. What do you want to make today?

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

How to Speak out on the Web

There are people who sit back and watch things happen, say que sera sera and leave things be. You are not one of those people, you take the bull by the horns, jump up on your rooftop and shout out loud so all the world can hear what you have on your mind. This project is for you. Remix this webpage to let your voice, concerns and complaints be heard.

Tool:Webpage Maker Skills: video, creative commons, HTML and CSS, web design Difficulty:Intermediate

So... what do you think?

Are these beta webmaker projects:

• Easy to use? Where do things feel confusing or broken? Is it easy to dive in and get started?
• Helpful for learning? Do they serve the goal of teaching HTML, CSS and other webmaking basics?
• Fun? That's crucial! Where are they most fun? Where do they lag?

Tell us what you think