Flash Talking Animals

Make sure you have your speakers on, and click the round circles to see and hear the marvelous animals.

Here at Passy World, we recently saw a very popular free app on the IPad, where infants can tap a thumbnail clipart of an animal, and then the screen can go full size, showing a photo of the animal and making the sound the animal makes. We decided we would make a similar game in Adobe Flash using Actionscript 3.0 .

We built the project up gradually in steps, using videos from YouTube to find out the technical bits we needed to include in our project. Step by Step building and testing is always a great approach to creating new apps, and we thoroughly recommend this methodology.

First we needed a project where we can click a thumbnail and then have the picture go full size. We found the following YouTube project that fitted this requirement.



So our first stage of building the project was to make some small 70x70 pixel button images with animal names written on them like Cat, Dog, Pig, Cow, Bird, etc, as well as find some good pictures of these animals on Google Images. The pictures can be resized in Flash, however for file size optimisation we resized them first using Photoshop to around 450x450 Pixels.

We got some nice button template backgrounds off the web, and then used Fireworks to make our buttons. It is important to make the button edges smooth by making the background transparent, and then painting around the button edge (use soft rounded brush) in the same hex color as the Flash background is.

We made our Flash project 540x360 pixels, so that it would easily fit on our blog page, and made a heading and changed the background color.

Next we followed the YouTube video and got our project going to that we could click a button, and have the image of that animal displayed on the stage.

Note that we found in CS3 we do not have the "chain link" resize option in properties, and so had to use the Flash resize tool (3rd down on tools side bar).
However, we later realized that CS3 has this same function when you have the size padlock undone in the properties.

It is also important to remember on the pictures layer in Flash to label the frame in the properties as pic1, pic2, pic3, etc.
This completed Step 1 of our Project. We tested it and our buttons and pitures worked well.


Step 2 of the Project

The next task was to get some MP3 animal sounds from the web. We found the following great websites with free sounds. If they fail to downlaod, then just use right click "Save Target As" on the download icon for each one.

http://www.freesound.org (have to join up using an email address, but it's totally free) and http://www.freeinfosociety.com .

We used Roxio Media Creator to edit and convert WAV and FLAC sounds into MP3's where required. (Flash works best with MP3s).

The mp3 sound files do NOT go into the Flash Library. Instead, they have to be stored in the same location as the Flash SWF file. This can be a folder on the PC for testing, and later on at our website on the Internet.

There is a PDF document later in this blog post which has the Actionscript Code for importing in the sounds, and making them play when buttons are pressed.

Here is our Step 2 Flash Project that contains Fireworks buttons in it, and our animal sounds.

Step 3 of the Project

The third and final step that could be done to this project would be to make our buttons a bit fancier. However to do this, we found that we needed to replace the buttons we made in Fireworks, with some Flash buttons, so that we could introduce lighter colored rollover states and so on.

Here is a Video that shows how to make these type of Flash buttons. Click on the 360p bottom right hand controller and watch it in HD as Full Screen.



However, we found that we could edit our Fireworks buttons in our existing project. All we have to do is double click the "btn1" object in the Library, and this will take us into button editing mode, just like in the YouTube movie.

We copy into the "Over" state frame, and then we click on the button, and in the Properties, change the color box to be "brightness" and set the slider up to 30%. This will make a lighter color button as our rollover button.

However, because we colored in around our round buttons in blue, our buttons now become squares when moused over and don't look so good. We therefore decided to abandon the Fireworks buttons.

So we really need to modify our project, and remake the buttons in Flash. (Font used in Flash was a simple Century Gothic size 22).

The approach was to remake the buttons in Frame 1 of the buttons layer, get them working, and then F6 Insert keyframe copy them into frames 2 and 3.

Now that we had new Flash buttons, we went in as per the YouTube Video and made them go darker when moused over, by clicking on the rectangle**, and changing it to a darker blue, like the guy did in the video. Note that we can click the button on the stage, or in the library to get into edit mode on it.

**We found we had to click off the button and then back onto it while in the button editor to get to the rectangle. Note that we made our "rectangles" so rounded that they became circles, we did this by setting the roundness to 34, back when we drew them.

This third version of the Project is the one that is actually at the start of this blog post.

Here is a PDF document showing the Actionscript Code:

If you would like to have your own full size copy of this PDF, then simply click the save disk icon button on the PDF viewer, and you should be able to save it to your own hard disk.

Alternatively, you can view or save the full size PDF by clicking the link below:

Click here to open or save the “How to Make a Flash Message” PDF

If you would like to download a zip file of the final version of our project, then click here.
Choose the save option in your web browser, and save this to your hard drive.

http://www.passyworld.com/AS3Animals/Animals.rar

Winrar is a free download that can then be used to extract the .FLA flash project file. Get "Winrar" for free at http://www.cnet.com/topic-software/winrar.html

So that's enough Doctor Doolittle-ing with the talking animals for now.

Enjoy,
Big Passy Wasabi

Parental Friday Funny

Image Source: http://cdn.yusrablog.com

This Friday Funny goes out to all the parents who are spending quality time with their kids over the Christmas holidays.

The title of this first video says it all.



Here is another video along the same lines. But really can you blame the parents for just wanting to play with their kids?



Being a dad has certainly changed over the years, and here's proof of that.

Fathers Then & Now

Fathers of 1900 didn't have it nearly as good as fathers of today; but they did have a few advantages:

In 1900, fathers prayed their children would learn English.
- Today, fathers pray their children will speak English.

In 1900, a father's horsepower meant his horses.
- Today, it's the size of his minivan.

In 1900, if a father put a roof over his family's head, he was a success.
- Today, it takes a roof, deck, pool, and 4-car garage. And that's just the vacation home.

In 1900, a father waited for the doctor to tell him when the baby arrived.
- Today, a father must wear a smock, know how to breathe, and make sure film is in the video camera.

In 1900, fathers passed on clothing to their sons.
- Today, kids wouldn't touch Dad's clothes if they were sliding naked down an icicle.

In 1900, fathers could count on children to join the family business.
- Today, fathers pray their kids will soon come home from college long enough to teach them how to work the computer and set the VCR.

In 1900, fathers pined for old country Romania, Italy, or Russia.
- Today, fathers pine for old country Hank Williams.

In 1900, a father smoked a pipe.
- If he tries that today, he gets sent outside after a lecture on lip cancer.

In 1900, fathers shook their children gently and whispered, "Wake up, it's time for school."
- Today, kids shake their fathers violently at 4 a.m., shouting: "Wake up, it's time for basketball practice."

In 1900, a father came home from work to find his wife and children at the supper table.
- Today, a father comes home to a note: "Jimmy's at baseball, Cindy's at gymnastics, I'm at adult-Ed, Pizza in fridge."

In 1900, fathers and sons would have heart-to-heart conversations while fishing in a stream.
- Today, fathers pluck the headphones off their sons' ears and shout, "WHEN YOU HAVE A MINUTE.."

In 1900, a father gave a pencil box for Christmas, and the kid was all smiles.
- Today, a father spends $800 at Toys 'R' Us, and the kid screams: "I wanted X-Box 360!"

In 1900, if a father had breakfast in bed, it was eggs and bacon and ham and potatoes.
- Today, it's Special K, soy milk, dry toast and a lecture on cholesterol.

In 1900, a Father's Day gift would be a hand tool.
- Today, he'll get a new iphone app.

In 1900, a happy meal was when Father shared funny stories around the table.
- Today, a happy meal is what Dad buys at McDonald's.

In 1900, a father was involved if he spanked the kid now and then.
- Today, a father's involved only if he coaches Little League and organizes Boy Scouts and car pools.

In 1900, when fathers entered the room, children often rose to attention.
- Today, kids glance up and grunt, "Dad, get out of the way of the television."

In 1900, fathers threatened their daughters suiters with shotguns if the girl came home late.
- Today, fathers break the ice by saying, "So...how long have you had those face piercings and full body tattoos?"

In 1900, fathers were never truly appreciated.
- In 2011, fathers are never truly appreciated.

Jokes Source: http://www.ahajokes.com

Today we may have all the mod cons, but there is still a lot of Bad Parenting going on out there.


Image Source: http://media.ebaumsworld.com

Here are a couple of wonderful crusaders of all things good, showing us exactly how we can help re-educate all of those bad parents.



But when all else fails putting up with the kids on holidays; desperate times call for desperate measures.


Image Source: http://images.paraorkut.com

We need to trust our evolutionary instincts, and remember it's all about the whole family thing.


Image Source: http://images.paraorkut.com

In this difficult day and age, it's up to the parents to take control and teach their kids all the right things.

Things My Mother Taught Me

• My Mother taught me LOGIC..."If you fall off that swing and break your neck, you can't go to the store with me."

• My Mother taught me MEDICINE..."If you don't stop crossing your eyes, they're going to freeze that way."
  
  
• My Mother taught me TO THINK AHEAD..."If you don't pass your spelling test, you'll never get a good job!"
  
  
• My Mother taught me ESP..."Put your sweater on; don't you think that I know when you're cold?"
  
  
• My Mother taught me TO MEET A CHALLENGE..."What were you thinking? Answer me when I talk to you...Don't talk back to me!"
  
  
• My Mother taught me HUMOR..."When that lawn mower cuts off your toes, don't come running to me."
  
  
• My Mother taught me how to BECOME AN ADULT..."If you don't eat your vegetables, you'll never grow up.
  
  
• My mother taught me about GENETICS..."You are just like your father!"
  
  
• My mother taught me about my ROOTS..."Do you think you were born in a barn?"
  
  
• My mother taught me about the WISDOM of AGE..."When you get to be my age, you will understand."
  
  
• My mother taught me about ANTICIPATION..."Just wait until your father gets home."
  
  
• My mother taught me about RECEIVING...You are going to get it when we get home.
  
  
• and my all time favorite thing - JUSTICE..."One day you will have kids, and I hope they turn out just like YOU..then you'll see what it's like."

Jokes Source: http://www.ahajokes.com

Here is an excellent summary diagram of how this whole passing on of all things valuable occurs within the modern close-knit family unit.


Image Source: http://4.bp.blogspot.com

But it's not all nasty unhapiness, and there are still plenty of fun times to be had for the modern family.

For example, parents just love to dance and so do their kids.
Because Dancing is fun... right?



Let's hope you all get to enjoy some quality family time this weekend.

Enjoy,
Big Passy Wasabi

Wii Grand Slam Tennis

Image Source: http://www.wiids.co.uk

At one of the recent post Christmas sales, we picked up a heavily discounted copy of Wii Tennis. This game has been out for a while, and friends of ours had said it was good. They were not wrong! This is a great game and is so realistic and addictive, it even surprised us here at Passy World.

We highly recommend getting it if you have a Nintendo Wii. If you don't already have a Wii, then get one, because they are great fun, especially when friends come over to visit, or if you want to play against all sorts of random people online.

Here is Grand Slam Tennis Intro video by EA Sports.



The game has lots of famous players and tennis courts from all around the world. There is even the Austalian Open with the real commentators such as John Newcombe and Pat Cash. In addition, there is a pro shop where you can pimp up your players.

This next video is a Grand Slam tennis in depth tutorial by EA who are the makers of the game.



Serving is tricky for beginners. You need to use the Wii controller to toss up, and then just swing down and flick your wrist at the end to get a powerful serve. So basically you toss up, and serve all with the one hand. This is the only part of the game that is different to real tennis. Everything else in playing the game is just like the real thing. It is indeed an awesomely realistic game.

Here is a video that gives some useful advice about Serving, and moving in to the net, to play serve/volley style games.



One thing not mentioned clearly in any of the tutorials we have seen thus far, is using the A and B buttons. Eg. With our controller we found we were able to press the A button to do a high Lob, and use the bottom of controller back button to make shots land in short close to the net. This is very useful to know, and definitely helps win points.

With the Australian Open Tennis coming up this month here in Melbourne, it is the perfect time to be playing this game here at Passy World.

So let's swing those controllers and serve up some aces!

Enjoy,
Big Passy Wasabi

CS3 Flash Modern Slideshow

This post is all about making your own basic Photo Slideshow using Adobe Flash CS3. Below is a Photo Slideshow we made here at Passy World.

(It is 1 MB is size and may take a little while to load in).

Click the controller in the top right hand corner to progress through the photos. (Right hand double arrow = Autoplay continuously).



Making the above slideshow involved using an existing template that comes with Flash Cs3. When it runs full size it is 640x480 pixels in size, and the caption text at the bottom of each photo is a little larger and easier to read.

In CS3 Flash, to access the free template and get started we simply do:

File > New > Templates tab > then More.. > 'Photo Slideshows' > 'Modern Photo Slideshow' .

We can then do Control > Test Movie, (or Ctrl-key + Enter), to run the sample slideshow and try it out.

The default Flash project had a big ugly controller, and so we did some editing** to remove most of it, and end up with a small streamlined controller in the top right hand corner of screen.

** This editing involved a lot of picking and clicking to find each of the items that we wanted to delete or modify.

If you would like a ZIP file containing our modified Template .FLA file, then click the link below and save the zip file to your own hard drive.

Winrar is a free download that can then be used to extract the .FLA flash project file. Get "Winrar" for free at http://www.cnet.com/topic-software/winrar.html

Download our Passy World Slideshow Template by clicking the link below, and then saving the file to your hard drive using your web browser.

http://www.passyworld.com/passyMisc/PassySlideshowTemplate.rar


Resizing our Photos to 640x480 Pixels for Flash

The one drawback for this slideshow is that we have to have all the pictures we are going to use saved as JPG's and all sized at 640x480 pixels.

However, if we have Adobe CS3 Photoshop, resizing is very quick and easy. The Crop tool can be set to 640px x 480px maximum size, and provided our photos are bigger than this required 640x480 size, we can crop a section of photo, save it as .JPG, and it will be the exact correct size for our Flash project.



Note that we saved each of our 640x480 photos in Photoshop using "Save for Web and Devices" as JPG type, with quality set to "High".


Replacing the Default Flash Project Photos

To replace the default photos with our own photos, we have to go to the Library in Flash, (Window > Library), and then click on the "photos" folder.

Next double click on the tree icon next to the first photo, which should bring up the following panel:



Now click the Import button, and on this panel, navigate to our own photo, and click "open" to have it replace the default photo. We also have to manually rename the photo to change its name in the Library.

Next we need to change the caption at the bottom of the photo. First we need to click the correct black dot keyframe on the "pictures" layer to get our desired photo is displayed.

We then click on the same position black dot in the "Captions" layer, and this should take us into edit the caption. We then need to click on the "T" text tool, then click our mouse into the caption and edit it:



After the caption is edited, simply change off the "T" tool and onto the black pointer arrow tool, and then click off the caption area, and we are done.

We can repeat this process for the next three photos we have, since the default project comes with a total of four photos.


Adding Extra Photos to the Slideshow Project

Firstly we need to add each of our 640x480 photos into the Flash Library. Do
File > Import > Import to Library > then navigate to the photo we want, and click open.

(It sometimes takes a couple of seconds for the photo to be imported). We then need to drag the photo from its place in the Library into the "Photos" folder.

Next we have to click at the top of the Flash Timeline and highlight in red all of the last frames like this:



We then do Insert > Timeline > Frame, (or Press F5), which will produce a set of blank frames at the next position at the end of the current timeline.

We now click onto the "Picture" Layer, where the new empty rectangle shaped frame is, and do Insert > Timeline > Keyframe, (or press F6). This will make a duplicate copy of the last photo in the animation. We now click on this photo on the Stage, and in the properties panel we click the "Swap" option.



On the resulting panel we can click the new photo we just imported, and it will be swapped in onto the stage. All we have to do now is the Caption.

Click onto the Caption at the last current frame, and do Insert > Timeline > Keyframe, (or press F6). This will make a duplicate copy of the latest caption.
We then click onto the "T" text tool in Flash, and we can then edit in a caption for the new photo we have just added.

We now repeat the following process for all of the photos we need to add:

• Import our next photo to the Library, and move it to the Photos folder.

• With all of the last frames highlighted in red, Press F5, (or do Insert > Timeline > Frame).

• Click on the Pictures Layer and Press F6, (or do Insert>Timeline>Keyframe).

• Click the picture on the stage, and in the properties panel do the Swap to bring in our new picture.

• Click on the Captions Layer and Press F6, (or do Insert>Timeline>Keyframe).

• Use the "T" tool to edit the caption for our new photo.

Deleting Photos

Click on the top of the timeline of the frames you want to remove, and do
Edit > Timeline > Remove Frames.


Making the Slideshow Start Automatically

If we want to have the slideshow start by itself as soon as the page loads, then we need to change some of the Actionscript Code. This is detailed in the following PDF. Click the link below to access the PDF instructions document.

http://www.passyworld.com/passyPDFs/SlideshowAutoStart.pdf

If you would like to download our Passy World Auto Slideshow Template, then click the link below, and then save the file to your hard drive using your web browser. (Use Winrar to expand the .RAR file out to the .FLA file).

http://www.passyworld.com/passyMisc/SlideshowTPauto.rar


Putting the Slideshow onto a Web Page

Our Slideshow with 12 photos ended up just under 1 meg in size, and so it takes a few seconds of load time on the web page or blog.

We could use Dreamweaver to make a new HTML page, and then use Insert function to put our Flash onto the DW page. However for our Blog post here we have uploaded the .SWF file to our live "Passy World" website and then used the following blog post insert code:

(Note that the actual code needs to go continuously across the page and must not have the large spaces between items shown here. It also must not have any line returns, and needs to run continuously as one big long line of text.).



So that's it for making a Photo Slideshow using Flash CS3.

If you would like a much more sophisticated and easy to use Flash Slideshow maker, then we suggest you use Wondershare's "Flash Gallery Factory Deluxe".

Click the link below for details on how to buy this great software that we use right here at Passy World on a regular basis:

http://www.wondershare.com/pro/flash-gallery-factory-deluxe.html

Enjoy,
Big Passy Wasabi

Making Drop Down Menus

Shown above is a new drop down menu we have added to our "Passy World" website. We created these menus using Dreamweaver's Spry functionality.

Making a Spry Drop Down Menu Using Dreamweaver

Dreamweaver has very useful "Spry" functionality, which allows a quick way of building a set of drop down menus. We have used Dreamweaver DW CS3 to create our menus shown in the image above, but this can probably be done in newer versions of DW as well.

This first video shows the basics of how to make a Spry drop down menu.



Here is a more detailed Video on Horizontal Spry Menus.
(Don't worry laddies and lasses, you will get used to this guy's accent quickly).

After pressing Play, make sure you increase the resolution from 360p to 720p and go full screen to get a very clear high definition video.



Here is a follow-on video about how to customise the Spry Menu.

After pressing Play, make sure you increase the resolution from 360p to 720p and go full screen to get high definition imagery that shows the CSS code clearly.

Watch this video very carefully, and do exactly what the guy says, especially when putting in your own repeating gradient backgrounds.



On our Passy World site, we decided we would make an APDiv to put the menu inside, so that we can easily mouse drag and reposition it on our page using Dreamweaver.

We then inserted a Spry Menu Bar into the APDiv, and adjusted it (as per the YouTube videos we had watched), to have all the headings we wanted across the top of our page.

This process automatically created a new "Spry Assets" folder in our site definition, that we then needed to upload to our live website, along with our new copy of the Index Page.

The CSS modifications were a bit tricky, and for some of the links we had to go into code view and manually add target="_blank" to make each listed link open as a new page.

We created a gradient see-through background "blueGrad130x40.PNG" using Fireworks, as per the Scottish guy's video, and used this as our background for the menu bar. It is very important to set this background to "Repeat" or we end up with white bits on our longer submenu names.

We also had to make all background colors transparent, and replace all the "SpryMenuBarDown.gif" and "SpryMenuBarDown.gif" images for backgrounds, with our own "blueGrad130x40.PNG" image.

Also on each new link we make for a menu item, we need to click on the text for the menu item, paste in the link, and then underneath this box in proerties, set target to "blank" so that is opens in a new page.

With the CSS it is a matter of trial and error, try changing things to bright red and preview in a browser, to work out what part of the bar they effect. Eventually we got something we liked, but it took about 2 hours to figure it all out.

The CSS changes all get written automatically to a file called: "SpryMenuBarHorizontal.css" in the "SpryAssets" folder, and this whole folder needs to be migrated along with Index.html, and the menu image "blueGrad130x40.PNG", to our live website in the USA.

Here is the final CSS that we ended up with for the Passy World Spry Menu:

If you would like to have your own full size copy of this PDF, then simply click the save disk icon button on the PDF viewer, and you should be able to save it to your own hard disk.

Alternatively, you can view or save the full size PDF by clicking the link below:

Click here to open or save the “Spry Menu CSS Code” PDF

There was only one minor problem with the upload to our live site. Eg. Because the "PWorldImages" folder does not live under a "PworldHome" folder on the real site, and so we had to go and edit all the paths in the CSS code and remigrate it.

We also found out how to remove the annoying white border around our website by setting up this code in the Index page HTML:



Testing of the new Homepage with Spry menu was done in Firefox, IE, and also Safari on the iPad, and they all came up okay.

Click the following link to check out our new Spry Menu on the Passy World homepage for yourself:

http://www.passyworld.com/

This "Passy World" website is one that we are slowly developing so show how Dreamweaver and Fireworks can be used for website building.
It also supplies some quick and easy links to some of our Facebook photos.

Here are some links to some other blog posts related to the building of our Passy World site:

Design-homepage-in-fireworks.html

Make-homepage-in-dreamweaver.html

Make-contact-us-webpage.html

Making-an-iframe-web-page.html


Finally, here are some additional videos we found for making Tabs and Menus in Dreamweaver by coding your own HTML and CSS, rather than using the built in Dreamweaver Spry functionality.

They claim that these type of menus are faster than the DW Spry ones. The videos certainly offer a good insight into how the CSS works to style up lists into nice menus, and are definitely worth watching for learning value.


Making Tabs in Dreamweaver using CSS

This video shows how to make a set of horizontal tabs that can link to other pages.
It uses raw HTML code and CSS code, and is very clearly explained step by step.

Not sure if this is exactly what we could use on our Passy World page, but it is interesting. Here is the Part 1 of 2.



And here is the second part of this video.




Making a Menu with Drop Down Links using CSS

This video shows really well how to use raw HTML and CSS, (instead of inserting a Spry), to create a Horizontal roll over drop down list menu.
The tutorial is in two parts. Here is Part 1.



And here is the second part of this video.




So that's it, now we can easily update our Menus with new drop down items and links as we need them. Very Nice.

Enjoy,
Big Passy Wasabi

Senam otak

Banyak cara dilakukan untuk dapat membuat awal hari menjadi bersemangat, salah satunya dengan latihan otak sederhana di pagi hari. Berolahraga otak di pagi hari dapat membantu Anda merasa lebih siap menghadapi hari dan juga meningkatkan energi dan kegembiraan.
Latihan otak beberapa menit sebelum keluar kamar tidur untuk mandi atau saat berdandan dapat membangun pikiran dan indera Anda untuk siap menjalani aktivitas dan rutinitas sepanjang hari. Latihan tersebut bisa berupa latihan fisik, mental atau kombinasi keduanya.

Dilansir Livestrong, Selasa (21/12/2010), berikut beberapa latihan otak sederhana yang dapat dilakukan di pagi hari:

1. Bernyanyi sambil melakukan aktivitas lain
Bernyanyi atau bersenandung saat Anda sedang berpakaian atau menyiapkan sarapan dapat menjadi latihan yang merangsang otak 'bangun' di pagi hari.

Latihan ini dapat meningkatkan jumlah dendrit atau garis sel saraf di otak yang memungkinkan otak untuk berfungsi, sehingga mengaktifkan lebih dari satu fungsi sensor yang dapat merangsang aktivitas otak.

2. Ubah rutinitas
Menurut Lawrence Katz, profesor Neurobiologi di Duke University Medical Center, mengubah rutinitas dan cara-cara hidup baru dapat mengaktifkan koneksi otak yang sebelumnya tidak aktif.

Latihan yang bisa dilakukan misalnya, bila Anda selalu menuju kamar mandi saat bangun tidur ubah menjadi minum kopi dulu, sikat gigi sebelum berpakaian atau mencoba menu sarapan baru yang belum pernah sebelumnya.

3. Olahraga Sederahana
Latihan fisik dapat meningkatkan kesehatan otak, karena dapat meningkatkan aliran darah ke otak. Lakukan olahraga sederhana, misalnya peregangan, yoga, bersepeda, jogging atau jalan santai.

Menurut Stanford Center on Longevity and the Max Planck Institute for Human Development, latihan fisik dapat meningkatkan perhatian, penalaran dan memori.

4. Latihan sensasi
Libatkan otak dengan gerakan setelah bangun dan sebelum Anda keluar dari tempat tidur. Mulai dari kaki, gerakkan jari, kontraksi otot betis dan kemudian kencangkan lutut.

Fokus pada bagaimana otot-otot merasa saat Anda bergerak. Gerakan tubuh akan menginstruksikan otak untuk fokus pada berbagai bagian tubuh sampai mencapai wajah. Mengencangkan bibir, mengerutkan hidung dan kemudian mengangkat alis dapat merangsang otak dan organ internal.

Scratch Programming 3

Make sure you have sound turned on for this one.

Click the top right hand corner Green Flag to start the animation, and click the round stop sign to finish it.

This post is all about using Scratch to animate your Name in interesting ways.

We built this first project: "Animate Your Name: Passy Rocks" as follows.

First we obtained some raw images of letters off the Internet. For each letter we obtained two images: the normal letter, and then another “old style” version of the letter. We then used Photoshop to reduce their size to 50x50 and saved them to our PC as .GIF files.

We then set up our first sprite for the letter P, and imported two costumes for it, containing the normal letter, and the surprise “old style” version.



We then set up the following Script on the letter P, to make it rock forward and back, and then pause on the surprise letter, and keep repeating forever. Later on we fine tuned the numerical values, but the script structure was kept the same.



To create the remaining letters, it was just a matter of right clicking this Sprite in the Scratch work environment and selecting “Duplicate” and then modifying it to be a different letter in the costume, and dragging it to its position on the stage.

We then created an additional Sprite containing a picture of a Guitarist, and made him appear only when the second set of letters appear by setting up his scripting as follows:



This worked fine in the Scratch Environment, but the timing was out when it was played online on the web page here. We managed to fix this by creating a Broadcast message to the Guitar Sprite to appear when the letters change costume.

To fix this we do NOT need to create a new variable called "LettersChanged". Instead we simply bring out a "Broadcast" control block, and we can define the message name of "LettersChanged" right there, via "new" on the control block.

We set up the letter P to broadcast "LettersChanged", and the guitar sprite to receive this and act upon it by appearing on the stage. (Show/Hide commands).

We also needed a restarting message, so that the guitarist could hide afterwards. We set this up in the letter P script as well.

On the Guitarist Sprite, we then imported a Scratch "cymbal crash" sound into the project, and set up for it to play whenever the guitarist appears.

For the Letter P sprite we introduced Drums, but had a problem with the Guitar Sprite turning them off, and so we had to add a receiving broadcast message statement to reactivate the drums.

We then played around with some timings, and were done. Note that adding sounds took our project from 287K up to 432K in size.

For the Stage background, we just used one of the “Indoors” backgrounds that comes with Scratch.

However, when we put it on our website and played it online, the sounds did not quite sync up, and so we had to adjust the timings loop numbers etc again.
Eventually we got it all working in time.

Here is the final Letter P script:



And here is the finished script for the Guitarist Sprite:



The other letters of our name each have the following script on them:





Making a Musical Name - Version 1

This project was adapted from a Project made by "atyo-dickerson" that we found at the MIT site at: http://scratch.mit.edu/projects/atyo-dickerson/514178

It uses X and Y coordinate positions of the mouse to create different pitched notes, when the mouse is moved across the background.

Click the top right hand corner Green Flag to start the animation, and click the round stop sign to finish it. Now Drag the mouse all over the screen to paint the name and hear some wonderful music. Press the Space Bar to clear the screen at any time.

To build this animation, four copies of the original name text were created as separate costumes.



The following code was then used to alternate through the costumes while repeatedly cloning them with the "Stamp" command. The number 16 "Dulcimer" sound was used, as per the original MIT project.





Making a Musical Name - Version 2

Make sure you have sound turned on, then click the top right hand corner Green Flag to start the animation. Then move the mouse across the letters to play the piano note for each letter.

Changing the bottom right hand corner speed will vary the sustain of the notes. (Space Bar Clears all line drawings).

The main parts of this project were taken from a similar project by “Duckey355” from the MIT site at: http://scratch.mit.edu/projects/Duckey355/57592

First of all the animation has some introductory instructions text contained in the costume for "Sprite1". The script for Sprite1 contains the "ghost" effect which immediately fades the text away as soon as the green Start flag is clicked.



The letters for our name were all obtained by Photoshopping an Alphabet we got from Google Images, and saving each cropped letter as a transparent .PNG file.

The Background has Scripting to set the "Speed" variable to an initial value of 0.2. There is also coding for space bar to clear the pen drawings at any time.



The Speed variable icon was then right clicked on the Stage and set to "Slider" so that a range of values could be chosen between 0 and 1. Large values make long music notes, and short values make short stacatto type notes.

The Letters are each set up the same. The coordinates of their start position in the script are obtained by reading off the values of where they are on the screen when moved to their stage positions during the build.

When we click on the "Play Note" values it gives us a Piano keyboard to pick the note number. We used the notes for our letters as Middle-C=60, D=62, E=64, G=67, High-C=72. So by pressing the letters P, A, and S, on our name in the right order, we can actually play "Mary Had a Little Lamb".

There is also code to make the Pen drawn lines and the letters return to their original start positions each time.





Getting R2D2 to Say Our Name

Make sure you have sound turned on, then click the top right hand corner Green Flag to start the animation. Type your text into the bottom of screen input box, and then click the tick mark to hear R2D2 say your message.

We got this project by "Leylosh" from the MIT site at http://scratch.mit.edu/projects/complex/924468

This project came with the alphabet of R2D2 sounds already imported, (one sound for each letter of the alphabet). When we type our name in the Input Box, the Script goes through each letter from left to right, making the appropriate R2D2 noise each time.

All we did at Passy World was create a new red R2D2, to match a Background we saved from Google Images and Photoshopped to the standard Scratch background size of 480x360.

Here is the Script that runs for the whole R2D2 translator.



So that's our name done to the max in Scratch.

Enjoy,
Big Passy Wasabi