Webmakers/Projects/MeemooClock-DIY: Difference between revisions

(Created page with "<div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;"> <h1>How to write the next episode of Inanimate Alice</h1> {{anchor|Intr...")
 
No edit summary
 
(9 intermediate revisions by the same user not shown)
Line 1: Line 1:
<div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;">
<div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;">
<h1>How to write the next episode of Inanimate Alice</h1> {{anchor|Intro}}
<h1>How to hack a clock app with Meemoo</h1> {{anchor|Intro}}
<div style="display:block;background-color:#ffffff;-moz-column-gap:20px;padding:20px;margin-top:20px;-moz-border-radius:10px;">
<div style="display:block;background-color:#ffffff;-moz-column-gap:20px;padding:20px;margin-top:20px;-moz-border-radius:10px;">
<div style="display:block;float:right;">


[[Image:Hive.png|300px|right]]<br/><div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;">Project by Hive NYC</div>
What is Meemoo?


[[Image:alice.png|300px|right]]<br/><div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;">Go to Inanimate Alice to choose an episode</div>
Meemoo is an easy way to wire together mini applications to make an output. You can make a [http://meemoo.org/iframework/#example/cam2gif stop-motion animated GIF], [http://meemoo.org/iframework/#example/camdoodle paint on webcam] images, draw a [http://meemoo.org/iframework/#gist/3002307 picture with math], or make custom clocks!


[[Image:supergirl.png|right]]<br/><div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;">Remix text and images with the Hackasaurus X Ray Goggles</div>
Each wire shows how data (image, text, or number) travel through the app. To add a wire, drag from one port to another. When you start dragging a wire, the compatible ports are highlighted. To delete a wire, just unplug it by the handle.
</div>
<div style="width:80%;display:block;">
Create the next chapter for the transmedia novel Inanimate Alice, while learning how to remix the web with the Hackasaurus X-Ray Goggles.  A DIY project from [http://explorecreateshare.org/ Hive NYC].


'''Step 1:'''Dive into an [http://inanimatealice.com/ existing episode] of Inanimate Alice.
Check out the different kinds of clocks that you can hack, and make your own clock app. A DIY project from [http://meemoo.org/ Meemoo.org]: hackable web apps.  


'''Step 2:'''Install the Hackasaurus [http://hackasaurus.org/en-US/goggles/ X-Ray Goggles].  
'''Step 1:''' Check out the example clocks and chose one as a starting place.


'''Step 3:''' Outline your own episode. Things to think about include:
[[File:Meemoo-hackable-analog-clock.png|500px]] 
*Character- it could be Alice, it could be anyone!
*Location-pick a country, any country!
*What happens next- is it a mystery the character is trying to solve, new friends the character meets, something new the character learns?


'''Step 4:''' Create a storyboard or story elements using new or remixed multimedia:
The analog version, start from: http://meemoo.org/iframework/#gist/2760122
*Drawings
*Images
*Video
*Words


'''Step 5:''' Create your chapter using Hackasaurus! Remix a news website, a blog or a social media site by adding elements to tell your story.
[[File:Meemoo-hackable-digital-clock.png|500px]] 
*Go to a website, activate the X-Ray Goggles bookmarklet.
*With the bookmarklet activated you should be able to inspect elements of the page that you want to change.
*Once you have figured out what you want to change, click R to remix. Remix that asset.
*Publish.
''Example: Remix a Facebook page to include status updates from Alice.''


'''Step 6:''' Publish your hacks and share the links. Tweet your links with the #hivebuzz hashtag.
The digital version, start from: http://meemoo.org/iframework/#gist/2923185


'''Step 2:'''
* Analog version: Experiment with changing the images in each of the image-in modules. Try changing the values in the transform modules.
* Digital version: Experiment with changing the font, color, and other values in the text modules.
'''Step 3:''' Experiment with adding modules [+module]. Can you add a webcam image to your clock?
'''Step 4:''' Save your app and share the links. Tweet your links with the #meemoo hashtag.


</div>
</div>
</div>
</div>
</div>

Latest revision as of 11:42, 29 June 2012

How to hack a clock app with Meemoo

What is Meemoo?

Meemoo is an easy way to wire together mini applications to make an output. You can make a stop-motion animated GIF, paint on webcam images, draw a picture with math, or make custom clocks!

Each wire shows how data (image, text, or number) travel through the app. To add a wire, drag from one port to another. When you start dragging a wire, the compatible ports are highlighted. To delete a wire, just unplug it by the handle.

Check out the different kinds of clocks that you can hack, and make your own clock app. A DIY project from Meemoo.org: hackable web apps.

Step 1: Check out the example clocks and chose one as a starting place.

Meemoo-hackable-analog-clock.png

The analog version, start from: http://meemoo.org/iframework/#gist/2760122

Meemoo-hackable-digital-clock.png

The digital version, start from: http://meemoo.org/iframework/#gist/2923185

Step 2:

  • Analog version: Experiment with changing the images in each of the image-in modules. Try changing the values in the transform modules.
  • Digital version: Experiment with changing the font, color, and other values in the text modules.

Step 3: Experiment with adding modules [+module]. Can you add a webcam image to your clock?

Step 4: Save your app and share the links. Tweet your links with the #meemoo hashtag.