canmove, Confirmed users, Bureaucrats and Sysops emeriti
2,104
edits
Webmakers/events/kitchen table: Difference between revisions
Jump to navigation
Jump to search
→Decide what you want to make
No edit summary |
|||
| Line 25: | Line 25: | ||
==Decide what you want to make== | ==Decide what you want to make== | ||
* We’ve built some '''fun projects''' to get you started with making on the web. You can follow these ideas or swap in whatever activities you like. | * We’ve built some '''fun projects''' to get you started with making on the web. You can follow these ideas or swap in whatever activities you like. | ||
* Be sure to think about the interests and skill levels of your group. Adapt accordingly! | * Be sure to think about the '''interests and skill levels''' of your group. Adapt accordingly! | ||
<div style="-moz-border-radius: 10px;width:25%;height:400px;background-color:#A2BFF4;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Make your own meme</h2>[[Image:internetfamous.jpg |270px]] <p>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.</p> | <div style="-moz-border-radius: 10px;width:25%;height:400px;background-color:#A2BFF4;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Make your own meme</h2>[[Image:internetfamous.jpg |270px]] <p>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.</p> | ||
* '''Tools used:'''Webpage Maker | * '''Tools used:'''Webpage Maker | ||
* '''Skills:''' HTML & CSS, design thinking | * '''Skills:''' HTML & CSS, design thinking | ||
* ''' Difficulty:'''Intermediate | * ''' Difficulty:'''Intermediate | ||
* [http://toolness.github.com/friendlycode/?p=/mission-slurp%3Furl%3Dhttp%253A//jessicaklein.com/betatest/internetfamous.html Do it!] | |||
</div> | </div> | ||
<div style="-moz-border-radius: 10px;width:25%;height: | <div style="-moz-border-radius: 10px;width:25%;height:400px;background-color:#FFDD73;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Hack the web arcade</h2>[[Image:arcademap.jpg |270px]]<p>Fix a broken map of the web arcade to unlock new missions and explore brave new webby worlds. </p> | ||
* | * '''Tool:'''Webpage Maker | ||
* | * '''Skills:''' HTML''' | ||
* | * Difficulty:'''Easy''' | ||
*[http://toolness.github.com/friendlycode/?p=/mission-slurp%3Furl%3Dhttp%253A//jessicaklein.com/betatest/webarcademap.html Do it!] | |||
</div> | </div> | ||
<div style="-moz-border-radius: 10px;width:25%;height: | <div style="-moz-border-radius: 10px;width:25%;height:400px;background-color:#FF9D73;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Make ugly '90s pages pretty</h2>[[Image:stuck90s.png|270px]] <p>Wrangle your HTML and CSS style powers to drag these webpages out of the grungey '90s.</p> | ||
* | * '''Tool:'''Webpage Maker | ||
* | * '''Skills:''' HTML and CSS, web design | ||
* | * ''' Difficulty:'''Intermediate | ||
* [http://toolness.github.com/friendlycode/?p=/mission-slurp%3Furl%3Dhttp%253A//jessicaklein.com/betatest/elements.html%2523 Do it!] | |||
</div> | </div> | ||
* If you tried something different, [[#Feedback | let us know how it went!]] | * If you tried something different, [[#Feedback | let us know how it went!]] | ||