Webmaker/pet website: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(7 intermediate revisions by one other user not shown)
Line 1: Line 1:
<div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;">
<strong>Because pets need web love, too! </strong> Use the handy "<a href="https://www.scrollkit.com/s/6034">Scroll Kit Editor</a>" to create a cute pet page fast, then share it with the world.
<h1>How to write the next episode of Inanimate Alice</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;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>
<img class="alignnone" title="I am dog!" src="https://wiki.mozilla.org/images/c/c6/I_am_dog_I_like_balls.png" alt="" width="536" height="314" />
 
<h3>Get started</h3>
[[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>
<ol>
 
<li><strong>Check out these current pet page examples using the</strong> <a href="https://www.scrollkit.com/s/6034">Scroll Kit Editor</a>. It works like a slideshow -- just click on the right-hand arrow to advance.</li>
[[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>
<li><strong>Add your own.</strong> Once you reach the end of the examples, click the "<strong>+ add to the scroll</strong>" button.</li>
</div>
<li><strong>Start editing.</strong> Upload pictures of your pet. Bring their personality to the web!</li>
<div style="width:80%;display:block;">
<li><strong>Publish and share your creation.</strong> <a href="http://take-a-screenshot.org/ ">Take a screenshot</a> of your work for easy sharing. Be sure to tweet your screenshot with the <a href="https://twitter.com/#!/search/realtime/scrollpet">#scrollpet</a> hashtag!</li>
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].
</ol>
 
'''Step 1:'''Dive into an [http://inanimatealice.com/ existing episode] of Inanimate Alice.
 
'''Step 2:'''Install the Hackasaurus [http://hackasaurus.org/en-US/goggles/ X-Ray Goggles].  
 
'''Step 3:''' Outline your own episode. Things to think about include:
*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:
*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.
*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:''' [http://take-a-screenshot.org/ Take a screenshot of your work]. Tweet your screenshot with the #hivebuzz hashtag.
 
 
</div>
</div>
</div>

Latest revision as of 20:13, 6 July 2012

Because pets need web love, too! Use the handy "<a href="https://www.scrollkit.com/s/6034">Scroll Kit Editor</a>" to create a cute pet page fast, then share it with the world.

<img class="alignnone" title="I am dog!" src="I_am_dog_I_like_balls.png" alt="" width="536" height="314" />

Get started

  1. Check out these current pet page examples using the <a href="https://www.scrollkit.com/s/6034">Scroll Kit Editor</a>. It works like a slideshow -- just click on the right-hand arrow to advance.
  2. Add your own. Once you reach the end of the examples, click the "+ add to the scroll" button.
  3. Start editing. Upload pictures of your pet. Bring their personality to the web!
  4. Publish and share your creation. <a href="http://take-a-screenshot.org/ ">Take a screenshot</a> of your work for easy sharing. Be sure to tweet your screenshot with the <a href="https://twitter.com/#!/search/realtime/scrollpet">#scrollpet</a> hashtag!
Retrieved from "https://wiki.mozilla.org/index.php?title=Webmaker/pet_website&oldid=448319"