nsf north mississippi gk-8 program ‘til you drop brenteria travis nsf north mississippi gk-8
TRANSCRIPT
NSF North Mississippi GK-8
Program ‘Til You DropBrenteria TravisNSF North Mississippi GK-8
NSF North Mississippi GK-8
What are Programs?
Programs are a detailed set of instructions that tell the computer what it is that needs to be solved.
It tells the computers what to do and tells other humans what it is that you want the computer to do.
NSF North Mississippi GK-8
Things that are programmed Video games ATMs Cash registers Washing machines Microwaves Drink/snack machines Casino games
NSF North Mississippi GK-8
Languages
Programming Languages are the ways we communicate with the machines.
We learn the language. We write the program in a
language. There are many, many
programming languages in existence.
NSF North Mississippi GK-8
Programming Languages BASIC Pascal Fortran Cobol C C++ Java Perl Python
MatLab HTML ActionScript JavaScript SQL
NSF North Mississippi GK-8
What do you think is the most important concept for writing
programs?
NSF North Mississippi GK-8
Exercise:
How to Create a Peanut Butter and Jelly Sandwich
NSF North Mississippi GK-8
Important Things to Remember:
Be Specific! Be Very Detailed! Computers are not Humans
They do not have common sense!!!
NSF North Mississippi GK-8
Project Objectives
Activity 1: Create an Advanced HTML
Webpage Frames Applets
Activity 2: Create an Introductory 3-D
Graphics Program
NSF North Mississippi GK-8
Activity 1: HTML
NSF North Mississippi GK-8
What is HTML?
Hyper Text Markup Language
Tag-based language used to code WebPages for the Internet
NSF North Mississippi GK-8
HTML Code and Page <html> <head> <title> Example Page </title>
<body> <h1 align ="center"> Example Page
</h1>
<hr align ="center" width ="50%">
<p> This is an example of an HTML page. It shows how to create this page
using the tag format. </p>
<p> For further details on how to write an
HTML page using an editor and the tags, go to
http://smartweed.olemiss.edu/nmgk8. </p>
</body> </html>
Paragraph Tag
NSF North Mississippi GK-8
How Do We Create HTML?
Option 1: Manually type each line of code in a
text editor.
Option 2: Use software tools that allow you to
build Web pages without writing code.
NSF North Mississippi GK-8
HTML Tools and Editors
Programming Tools Microsoft FrontPage Netscape Composer Macromedia Dreamweaver
Program Editors TextPad UltraEdit Notepad
NSF North Mississippi GK-8
What will we do?
HTML Tool:Microsoft FrontPage
NSF North Mississippi GK-8
Microsoft FrontPage
Microsoft FrontPage is a tool created by Microsoft that allows for the creation of Web pages using drag-and-drop operations.
FrontPage functions are very similar to Microsoft Word.
Difference: When saving a file, it converts all the contents to the HTML tag format.
NSF North Mississippi GK-8
Microsoft FrontPageMenu Bar
Tool Bar
Canvas
NSF North Mississippi GK-8
Applets
NSF North Mississippi GK-8
Java: Applet
A small program written in Java and included in a HTML page.
It is independent of the operating system on which it runs. (Windows or Mac)
An applet can be used to display scrolling text in a specific area, special effects, animations, or calculations.
NSF North Mississippi GK-8
Example:********************************************************// Snowman.java Author: Lewis and Loftus// Demonstrates basic drawing methods and the use of color.//******************************************************import java.applet.Applet;import java.awt.*;
public class Snowman extends Applet{ //----------------------------------------------------------------- // Draws a snowman. //----------------------------------------------------------------- public void paint (Graphics page) { final int MID = 150; final int TOP = 50;
setBackground (Color.cyan);
page.setColor (Color.blue); page.fillRect (0, 175, 300, 50); // ground
page.setColor (Color.yellow); page.fillOval (-40, -40, 80, 80); // sun
page.setColor (Color.white); page.fillOval (MID-20, TOP, 40, 40); // head page.fillOval (MID-35, TOP+35, 70, 50); // upper torso page.fillOval (MID-50, TOP+80, 100, 60); // lower torso
page.setColor (Color.black); page.fillOval (MID-10, TOP+10, 5, 5); // left eye page.fillOval (MID+5, TOP+10, 5, 5); // right eye
page.drawArc (MID-10, TOP+20, 20, 10, 190, 160); // smile
page.drawLine (MID-25, TOP+60, MID-50, TOP+40); // left arm page.drawLine (MID+25, TOP+60, MID+55, TOP+60); // right arm
page.drawLine (MID-20, TOP+5, MID+20, TOP+5); // brim of hat page.fillRect (MID-15, TOP-20, 30, 25); // top of hat }}
NSF North Mississippi GK-8
If we want an applet, do we have to write code all the time?
Answer: No!
NSF North Mississippi GK-8
Anfy
NSF North Mississippi GK-8
Anfy
Is a programming tool that allows us to create Java applets without directly writing code.
Gives the opportunity to add
exciting graphical applets to our websites with simple “Click” and “Add” functionalities.
NSF North Mississippi GK-8
Anfy’s Opening Page
NSF North Mississippi GK-8
Anfy Demo: Open Anfy Choose the following Categories
and Menu Items. Click the “Preview” button for
the following: Banner/Slideshow & MOSAIC Fractals/Alife & FLOZOIDS Image Effects & ANSTRETCH Image Effects & LENS Other & ANPUZZLE
NSF North Mississippi GK-8
Activity 2: Beginner’s Programming
NSF North Mississippi GK-8
How do we learn to program? Option 1: Sit in front of a computer
with a book and type code Option 2: Sit in front of a computer
with a book and type code Option 3: Download a beginner’s
programming software tool and learn the initial concepts of programming using 3-D graphics!!
NSF North Mississippi GK-8
Alice Alice is a tool created in Java that
teaches programming concepts to beginners using 3-D animations.
Alice was created at Carnegie Mellon for the purpose of enticing beginner programmers into programming.
It allows the user to create 3-D “Worlds” incorporating objects, environments, and actions with drag-and drop programming techniques.
NSF North Mississippi GK-8
Example: Alice World
Environment
Object
NSF North Mississippi GK-8
Alice Demo:
Double-click the “Alice” icon on your desktop.
On the opening pop-up screen, click the “Examples” tab.
Double-click the “IceSkater” icon on that screen.
Click the “Play” button in the upper left-hand corner of the screen.
NSF North Mississippi GK-8
Alice: CodeScene
Methods
Built in Properties
Objects
NSF North Mississippi GK-8
What we want to accomplish Create new web pages using
Microsoft FrontPage
Create a Java applet for the webpage using Anfy
Create 3-D programs using Alice
NSF North Mississippi GK-8
Sources: Dann, W., S. Cooper, and R. Pausch. 2005.
Learning to Program with Alice: Beta Version. Upper Saddle River, NJ: Pearson Prentice Hall.
Lewis, J. and W. Loftus. 2001. Java Software Solutions: Foundations of Programs
Design. Addison Wesley Longman, Inc. Alice v2.0: Learn to Program Interactive 3D
Graphics. 1999-2005. Accessed 2005 November 14. <www.alice.org>.
Anfy Homepage. 1997-2003. About Anfy Team. Accessed 2005 November 14.
<http://anfyteam.com/services.html>. Microsoft Office Training. 2005. Designing a
Website with FrontPage. Accessed 2005 November 14. <www.office.microsoft.com>.
NSF North Mississippi GK-8