CEIS 100 Week 6 Lab Assignment Help | Devry University
- Devry University / CEIS 100
- 09 Apr 2019
- Price: $27
- Other / Other
CEIS 100 Week 6 Lab Assignment Help | Devry University
HTML
and Scratch Programming
Lab
Report
DeVry University
College of Engineering and Information Sciences
Exercise Title:Animation Programming
OBJECTIVES
Get a basic understanding of programming animation.
ASSUMPTIONS
In
this lab, you will access Scratch from your Raspberry Pi desktop and create an
environment where a character will animate on your screen.
Part A:
SHORT TUTORIAL
1. Turn on your Raspberry Pi computers and log
in.
2. Use startx to access the desktop.
4.
The screen is divided into four areas.
·
Stage (top right)
·
Sprite list (bottom right)
·
Scripts Area (tall middle panel)
·
Blocks Palette (left)
5.
Sprite List—these are the characters in the game. You can
make these characters do things.
6.
Blocks Palette—essentially, this is the programming language.
These are commands that you can use to animate your sprite.
7.
Scripts Area—this is where you create your program.
Essentially, it is just a matter of pulling blocks from the Block Palette into
this area to create your program.
8.
Stage—this is where all of the action takes place.
9.
Experimenting with Scratch is quite easy and a lot of fun.
Try out different blocks. You can do that by simply clicking on them in the
Blocks Palette. For example, if you click on the block “move 10 steps,” you
will see your sprite move forward. If your sprite ends in a position on the
screen that you don’t want, you can simply mouse over the sprite and move it to
another area.
10.
Not all blocks will work. Some have to be combined with other
blocks. Also, be patient. There could be
a significant lag between clicking on one command and then trying another.
11. Creating a script is easy. Just drag a block from the blocks Palette to the scripts area. You will note that the blocks seem to fit into one another like a puzzle. And you can easily grab one and move it around. Below is a short script that I created. If you read the blocks, it simply.
sets the sprite to x position 0 and y position 0 on the screen. The sprite then moves forward 45 steps, turns clockwise 15 degrees, and moves another 45 steps. And so on. By clicking on the “set y to 0” block, the script activates, and I can see the sprite move according to these directions.
12. You can save your work simply by using File and Save As at the top of your screen. You can also create a link.
PROCEDURE
1.
Research the Internet for more information on Scratch.
2.
Create a script that animates two objects on the screen.
Take a screenshot of your game below and share your project online. This will give you a link to share.
Part B
1. Createa website with the Raspberry Pi, showing off
your scratch project.
2. In this lab, we will create a simple website with the Pi. We will be using HTML and creating a website to advertise your new scratch game.
Some of the commands that we will use are below (from
webmonkeyhttp://www.webmonkey.com/2010/02/html_cheatsheet/
):
Basic Tags
<html></html> Creates an HTML
document
<head></head> Sets off the title and
other information that isn’t displayed on the web page itself
<body></body> Sets off the visible
portion of the document
Body Attributes
<body bgcolor="pink"> Sets the background
color, using name or hex value
<body text="black"> Sets the text color,
using name or hex value
<body link="blue"> Sets the color of
links, using name or hex value
<body vlink="#ff0000"> Sets the color of
followed links, using name or hex value
<body alink="#00ff00"> Sets the color of links
on click
Text Tags
<p></p> Creates paragraph text
<hl></hl> Creates the largest
headline
<h6></h6> Creates the smallest
headline
<b></b> Creates bold text
<i></i> Creates italic text
<tt></tt> Creates teletype, or
typewriter-style text
<cite></cite> Creates a citation,
usually italic
<em></em> Emphasizes a word (with
italic or bold)
<strong></strong> Emphasizes a word (with
italic or bold)
<font size="3"></font> Sets size of font, from
1 to 7
<font color="green"></font> Sets font color, using
name or hex value
<ul></ul> Creates a bulleted list
<li></li> Precedes each list
item, and adds a number or symbol depending upon the type of list selected
<imgsrc="name"> Adds an image
Links
<a href="URL"></a> Creates a hyperlink
<a href="mailto:EMAIL"></a> Creates a mailto link
<a href="URL"><imgsrc="URL"> </a> Creates an image/link
<a name="NAME"></a> Creates a target
location within a document
<a href="#NAME"></a> Links to that target
location from elsewhere in the document
We
will start to create a simple website. Turn on your Raspberry Pi. Click on
Menu-> Accessories-> Text Editor. This will open the text editor. You can
type all of your code in here. Save it in your /home/pi home directory as mywebpage.html.
The
example below is about the scratch project that I created. Type the following
code into the text editor. Replace "your name" with your name.You
will notice that each opening tag also has a closing tag. Be sure that when you
are creating your website that you include a closing tag.
<html>
<head>
<title>Your name
website</title>
</head>
<body>
<h1>My Scratch Program</h1>
</body>
</html>
Save it as mywebpage.html. Open the web browser by
going to Menu->Internet->Web Browser. Click on the gear in the upper right-hand
corner and choose Open.
Choose the mywebpage.html.Open the webpage. (Note: On some browsers, pressing ctrl + o will allow you to open a file.)You should see something like the following:
Now we want to add some
more elements:
We will add paragraph
text, change the text color, add bold or italics for emphasis, add a list, a
hyperlink, and an image. The image must be in the same directory as the
mywebpage.html. We will use the tags listed above to accomplish these tasks.
<html>
<head>
<title>Gina Cooper's website</title>
</head>
<body>
<h1>My Scratch Project</h1>
<p>Check out my <b>awesome</b>
game that I made with scratch! I thought it would be fun to have a bee chase a
cat in scratch, so I added an additional sprite (the bee) and a <font color="orange">desert background.</font></p>
<p>In my game, the cat will
move around in circles, then move towards the mouse. While it moves, a pen will
draw the route. The bee will follow the cat. Hopefully, the cat won't get
stung! Here is the link to my project:
<a href= "https://scratch.mit.edu/projects/83947834/"> link</a></p>
<ul>Some of the actions in
scratch that I chose are:
<li>Repeat loop (5 times)</li>
<li>Forever Loop</li>
<li>Pointing towards the other
sprite</li>
</ul>
<p>I also took a screenshot
of my game, too! I hope that you enjoy playing it! </p>
<imgsrc="scratch.png">
</body>
</html>
The following image is the web page in the browser. Add in your own information and create your website on the Pi! Take a screenshot using scrot, and paste the code and screenshot below: