CSC101 Spring 2008 - Section 01, 02

• Classes: Room MO113, CSC101-01, 8:10 to 9:25 AM, CSC101-10, 9:35 to 10:50AM
• Office Hours: Tuesday, Thursday 11:00 - 12:30PM; PM; Wednesday 10:00 -12 noon
• Text: No textbook - Readings, Audio, and Video found on the Internet will be assigned.
• Required - PC headphones, a binder for class notes, USB flash drive for assignment backup and software downloads.
• Prerequisite:  High School level computer experience
• Class attendance is required. Three unexcused absences, Maximum grade F.
• Grades:  (No credit for work more that one week late)
  • Midterm grade:  Weekly WebCT quiz/workbook 33% (The lowest grade will be dropped), Assignments  33%, Midterm exam 33%
  • 2ed Half grade: Weekly WebCT quiz/workbook 33% (The lowest grade will be dropped), Assignments  33%, Final exam 33%
  • Final grade: (Midterm grade + 2ed Half grade) /2
• A 10 minute webCT workbook/quiz will be given the first 10 minutes of class every Thursday.
• ALL material on your web pages that you have not created must be footnoted. Include the material's source link and the date. Grade penalty if you forget to do this.
• To correct systems problems call the SCSU help desk 392-5123 or email hlpdsk@southernct.edu

There will be a practice quiz on Thursday

Week 1 Startup

Assignment 1

• Set up your CSC101 homepage
• Include a picture from http://www.southernct.edu/  or a similar site.
• Add links to Assignment 2, 3, 4 etc..

• Read
• Help > Dreamweaver Help> Dreamweaver Contents > Introduction
• Getting Started with Dreamweaver –
• Introduction
• Dreamweaver Basics Help > Dreamweaver Live Docs > Using Dreamweaver or See http://livedocs.adobe.com/dreamweaver/8/using/wwhelp/wwhimpl/js/html/wwhelp.htm
• Read
• Getting started with Dreamweaver.
• Dreamweaver Basics

Assignment Notes

• Setting Up a Dreamweaver Site
  • Site>New Site
    • What would you like to name your site? - Answer - Any appropriate name  example: Mikes web site
    • What is the HTTP address? - Answer - http://home.southernct.edu/~your account name
  • > Next
    • Do you want to work with server technology?
    • Select "No I don't want to use server technology"
  • > Next
    • How do you want to work with your files during development? Select "Edit directly on server using local network"
    • Where do you want to store your files? Enter - .www
  • > Next
    • How do you connect to your remote server? Select Local/Network
    • What folder on your server do you want to store your files in? Enter - U:/www/
  • >Next
    • Do you want to enable checking in and checking out files....?  Select No
  • >Next
  • >Done

Dreamweaver features

• Property Inspector  - Windows > Property Inspector
• Tables -
  • Insert > Table
  • Modify > Table
• Links - select the link name then enter link in Link example: http://www.ibm.com
• Lists - select the list, click unordered list button or the ordered list button or
• Working with images in Dreamweaver and Fireworks
  • To copy a screen press the "Print Screen" key
  • Paste the image into Fireworks
  • Crop and export the image that you wish to use  File > Export
  • In Dreamweaver Insert>Image
• Use Dreamweaver to create a CSC101 homepage named CSC101.htm
• See sample page at - http://home.southernct.edu/~harriganm1/   - http://home.southernct.edu/~marinom6/

  http://home.southernct.edu/~sternc1/ - http://home.southernct.edu/~mayockl1/

  http://home.southernct.edu/~cristinok1/ - http://home.southernct.edu/~karicaj1/

  http://home.southernct.edu/~paolettij1/ - http://home.southernct.edu/~werboffa1/

• If you do not already have one create your SCSU homepage Include on this page your name, a picture and a link to your CSC101 homepage
• The address of your homepage is:
• http://home.southernct.edu/~your account.htm --- NOT - HTML
• If you have a SCSU homepage add a link to your CSC101 homepage.
• Check that your page works - View http://home.southernct.edu/~workmanr1/CSCStudentsSpring2008.html Be sure that your link on this page works.
• Include on this page A heading with your name class and section
• A table similar to the course syllabus with Week number and date
• The names of the CSC101 assignments
• Enter your page title near the top of  the Dreamweaver window

• Practice Quiz  - Take the CSC101 Vista practice quiz  http://vista.southernct.edu

CSC101 Homepage Notes

• Be sure to give your homepage and all other pages a Title.
• For your homepage create a table  with 9 rows and 4 columns - Insert > Table
• To change the color of the table select the table and use the Bg Color box to change the background color of the table
• To change the table Modify > Table and make changes such as merge  or split cells, and insert or delete rows or columns
• Include in the last row links to four sites that interest you

Week 2 Web Resources

Week 2 Assignment Part 1

Work with one or two other students

• At the top of the spreadsheet add a title and the names of the students who worked on it
• Look up on six web sites the cost of three texts that you bought or will be buying. Two of the sites should be http://www.amazon.com and http://www.half.com  Find two other text book sites.  Search http://www.google.com using “text books” or similar key words.
• Create a table using Excel 2007. Include the name of the text, course, price you paid, where you bought it, web site name, and price at that web site. Add columns for shipping and tax, total and percent difference from the price you paid.   If the text is not available enter the code NA.

• Display the total savings if any
• Comment :

• Do you feel that the web is a good place to buy texts
• What are the pros and cons.

• Save your spreadsheet as an Excel 2007 file (xlsx) and as a .htm file. Add a link on your CSC101 homepage the the .htm file, Week 2 Part 1
• Check that your page works.

CSC101 Week 2 Spring 2008  Web Resources    -  webCT quiz Thursday

• Homepage
• Be sure to give your homepage and all other pages a Title
• Have me check that your homepage works.

• Excel – Textbook study
• To format cells with lots of text
• home > format cells > alignment > wrap text
• Working with Excel tables
• insert > table  click my table has headers
• Try sort and filter
• Try the format painter
• Example - Web resources Skype - http://en.wikipedia.org/wiki/Skype  also Google Skype - http://search.conduit.com/ResultsExt.aspx?ctid=CT1060933&SearchSource=3&q=skype
• HTML -In Dreamweaver click spilt
• <p> <head> </head>  <body> </body>
• <title>CSC101 Spring 2008</title>
• <link rel="shortcut icon" href="favicon.ico" >
• <a href="http://www.google.com/">Google</a>
• Working with others - Some File Sharing Options
• Flash Drive
• S: drive – the public drive only at Southern
• Gmail attachment
• Gmail shared documents

---

 

• Week 2 Assignment Part 2Work with one or two other students.  Include the names and class of those who worked on the slide show

• View http://www.zdnet.com/  Create a slide show using PowerPoint 2007.  The slides should define the meaning of the nine tabs or menus under in the Zdnet web site.
• For zdnet.com example- blogs, white papers, downloads, reviews, CIO Sessions, podcasts, mobile, webcasts, case studies
• Include a footnote on each slide, stating where you obtained the information
• Example: CSC101Assignment2.ppt
• Save your slideshow as a PowerPoint 2007 file and as a .htm file. Add a link on your CSC101 homepage the the .htm file, Week 2 Part 2.
• Include a first slide that titles your work - "Web Resources" and includes your name class and date.
• A way to find definitions is to Google "wiki and what you are looking for.
• For example "wiki white paper"
• The tabs and links under the tabs will be answers to most of this weeks webCT quiz.

If time

Search a technology company’s web site using one of the CSC101 web resources words such as podcast, blog, white paper, case studies.

For example the IBM site had 19,000 hits on the word “podcast”, 25,000 hits on “blog”,  69,000 hits on the word “white paper”, and 184,000 hits on “case study”. Microsoft has 696,000 hits on “white paper”, apple had 500 hits on “blog”.

Some web sites to try  http://www.ibm.com – http://www.microsoft.com  - http://www.apple.com – http://www.utc.com  - http://www.adobe.com  - http://www.ge.com

Read or listen to an example on one web site in each of the four example categories. Use Word 2007 and report on what you learned.

Week 3 PC Management

CSC101 Week3 PC Management                             Administration

Class notes

Save Excel files as .xls or .htm  files.  Check that your links work.

Examples works –

http://home.southernct.edu/~akomahappiv1/ xls file

http://home.southernct.edu/~johnsonm24/  xls file

http://home.southernct.edu/~palmerk2/ - htm file

Does not work - http://home.southernct.edu/~beattye2/

SCSU notes: Links to Change Password, and free McAfee VirusScan may be found on mySCSU - http://myscsu.southernct.edu/cp/home/loginf  Pass word reset information in on the HelpDesk homepage -  http://helpdesk.southernct.edu/  . 

For the Thursday Quiz - Read – http://support.microsoft.com/kb/306084

System Restore - rolls back system files, etc to a previous configuration.  This link describes how to use System Restore. An easy way to restore a PC is to search “Help and Support Center” using “system restore”. Then click “Run the System Restore Wizard”.

For the Thursday Quiz - Read - “Using a Windows XP PC? Here are essential things you need to know to keep it running well and to help protect your data.”  Get started with computer maintenance  - Organize files and folders  -  Delete files you don't need anymore - Back up your files

Assignment 3- Use Word 2007 to take about half a page of notes on each of these topics.
Save your document as a Word 2007 file (docx) and as a .htm file. Add a link on your CSC101 homepage the the .htm file, Week 3

• System Restore - http://en.wikipedia.org/wiki/System_Restore -
• Keeping hackers out. - What do firewalls do? What are the features of some firewall products?
• Keeping data private - What are some of the things that you can do keep your data private?  http://en.wikipedia.org/wiki/Data_privacy
• Data shredding  - data shredding - Google Search
• Antispyware - antispyware - Google Search

Other

Primary Day - Clinton - McCain - Obama - Romney

Mardi Gras  - http://www.bahia-online.net/Carnival.htm

Week 4 Images

There are six parts to the Week 4 Image assignments.  Add links in week 4 on your homepage to each part of the assignment.

Assignments 1,2,3,4 are due on the web Thursday February 21.

Part 1 Editing text with Fireworks

• Open Fireworks
• Click - Create New Fireworks File
• Windows > Toolbar > Main
• Windows > Styles
• Select the text tool and a fat font and type CSC101 - 01 or 02 or your name or something else
• Modify > Canvas > Fit Canvas
• Windows > Styles
• Try these text design commands Use undo in the main toolbar to return to the previous text if desired
• Try 10 variations of each of the following
• A - Filters
• B - Texture
• C - Auto Shape Properties
• D - Styles in the styles window
• E - Blend mode
• F- Opacity
• G – Text Tool
• H - Font
• J - Fill options” found to the left of “bold”. 
• Save three text samples  File > Export
• Insert each sample into your Week 4  Dreamweaver page  Insert > Image
• Add a link to Week 4 Part 1

.

Part 2 Favicons – Create and add a Favicon to your homepage

• Favicon – http://en.wikipedia.org/wiki/Favicon
• Examples – http://home.southernct.edu/~workmanr1/CSCIconDemo.html
• Create a Favicon image using Fireworks.  Save the image in Desktop.
• Assignment - Generate and install a Favicon for your homepage. - see http://www.html-kit.com/favicon/
• Make sure that favicon.ico is in your .www directory
• Add - <link rel="shortcut icon" href="favicon.ico" >  HTML tag to your web page between <head> and </head>
• Note: favicon.ico is the name of your icon.  It can be changed to other name such as csc101.ico

Part 3 Assignment Fix the photographs. Show the before and after pictures.

• Photo 1 – Fix the redeye
  • Redeye removal Use the Fireworks “Redeye removal” tool to fix the photo RedEye.jpg  Add the original and fixed photograph to your Week 6 web page.
  • Select the Red-eye Removal tool from its pop-up menu.
  • Set the attributes in the Property inspector:
  • Tolerance determines the range of hues to replace (0 replaces only red; 100 replaces all hues that contain red).
  • Strength sets the darkness of the grays used to replace reddish colors.
  • Click and drag the cross-hair pointer over the red pupils in the photograph.
  • Control X undoes changes Control Y redoes the change
• Photo 2 – Adjust brightness and contrast.  Use – Filter – Adjust Color – Brightness/Contrast. Also try Auto Level and other options. Identify the person.
• Photo 3 – Adjust brightness and contrast.   Identify the place.  See - Mitla Wiki

Thursday

Part 4 – Animated GIFs

• Add Add animated GIF text to your assignment page. http://www.3dtextmaker.com/image_editor.html
• Add  a GIF animation – example - Smiley Faces from Feebleminds. Or see gif animation free - Google Search

Part 5 Dreamweaver Starter Pages

Try a Dreamweaver Starter Page – File > New > Select “Starter Pages”

Then select a page such as Travel – Home Page

Add your own pictures, text, and links

==========================

Adding more links to a Dreamweaver starter page

• Vertical Links

• Example – Travel – Homepage
• Make a backup copy of the page that you are working with.
• Highlight the top link, in this example the link is named “destinations”
• Change to code view
• Highlight the HTML code starting with <tr> and ending with the last </tr>
• Copy and paste the row after the last </tr> in the table and in front of </table>
• Check that this worked
• Note 
• <tr> starts a row in a table and </tr> end the row
• The table starts <table… and ends </table>
• <td…</td> contains the contents of the row

• Horizontal links
• To add horizontal links highlight the links. Switch to code view and copy the entire row starting with <tr bgcolor=”#  and ending with </tr>
• Past this below the </tr>
• This will add a new set of horizontal links.  Changing the numbers after bgcolor will change the row background color.

Part 6

Flash Frame by Frame Animation - Create an animated valentine - http://www.angel9oh7.com/flashvalind.html -

http://www.youtube.com/results?search_query=valentine&search_type=   

Assignment - Week 4, Part 6

• Create a 10 frame animation
  • Each frame in the animation should be a key frame  Press F6 or Insert > Timeline > Keyframe or right click the mouse and select Insert Keyframe
  • Saving Flash
  • Save your  .fla file  File > Save
  • Save your .swf file File > Export
  • Add your .swf file animation to your Assignment 4 page
  • In Dreamweaver
    • Insert > Media > Flash

If time

Panoramic View See - Panobuilder

Week 5 Office 2007

Assignment 5 Office 2007, Word 2007

 Part 1 - Talking notes with Word 2007. Office 2007

• Use Word 2007 to talk notes on the topic “What’s New in Office 2007”.
• Demonstrate in your document - Page Layout > Watermark,  Page Color, and Page Borders
• Take notes about the new features of Word 2007, Excel 2007, and PowerPoint 2007. see - http://office.microsoft.com/en-us/default.aspx
• Include in your notes three to six most important new features for each product.  
• Find a book about each product and include it in a bibliography. -  References > Manages Sources  
• Add the bibliography to your document.
• Save your work as both a docx and htm file.
• Add a link on your Assignment 5 page to your htm document.

Part 2 – Creating Business Cards with Word 2007, Avery Wizard Software, or
Free

• Word 2007 - Office Button > New > Business Cards choose a Business Card
• Enter your own information - Name, position, address e.g. 501 Crescent St etc.
• Copy and paste your personal information into all the business cards on the page.
• OR
• at home download the Avery Wizard Software and create a page of business cards - http://www.avery.com/us/software/index.jsp
• Free online Software
• See - http://www.businesscardland.com/home/ 
• This application creates a .pdf file.  If you this at home be sure that you have the latest version of Adobe Reader.
• What is a pdf file see: http://en.wikipedia.org/wiki/Portable_Document_Format

Part 3 - Mail Merge - Use Word 2007 create customized letters to three state representatives from near your home

Read http://www.foxnews.com/story/0,2933,312018,00.html  . Should social networks be regulated to try to help prevent such tragedies?  Write a brief two paragraph letter expressing your opinion for or against legislation regulating social networks. 

• Mail Merge instruction - http://office.microsoft.com/en-us/word/CH100626281033.aspx
• Create recipient list - Mailings tab > Select Recipients >
• Find the state representatives address using  - http://www.votesmart.org/
• Add the names and addresses to the recipient list
• The mail merge process entails the following overall steps:
• Set up the main document..- Open a blank document.
• Select Mailings > Start Mail Merge > Letters
• Connect the document to a data source. – Select Recipients > Use Existing List CSC101MailMergeList on S: drive
• Add address block
• Add Greeting Line
• Type letter as necessary Add placeholders, called mail merge fields, to the document. Preview and complete the merge.
• Preview each copy of the document
• Save your letter file as a docx file and as an htm file
• Add a link to your htm file.
• Letter Format
• Upper right senders name and address
• Below on the left
• Address Block include recipients name and address
• Date
• Greeting Line – Dear Mr. etc.
• Letter ends with sincerely, and your name a few spaces below.
• Other – Dummy text generator
• Text generator - http://en.wikipedia.org/wiki/Lorem_ipsum
• Create text  - http://www.lipsum.com/ 

Week 6 Hardware - Assignments 1, 2, 3, 4, and 5 due

Assignment 6 – Use Open Office Writer to summarize information in Tables 1,2,3, and 4.  Work with 1 or 2 other students and share what you have found. Each person in your group should create one or two of the required tables

OpenOffice Free Download - http://www.openoffice.org/  Languages - http://projects.openoffice.org/native-lang.html

Languages and Operating Systems - http://download.openoffice.org/other.html

• Required Tables
• Desktop Computer,
• Notebook Computer
• All-in-one Computer
• Mobile phone – Blackberry, iPhone
• Final Document
• The names of the people who created it
• Tables for desktop, notebook, all-in-one, and e-bay.
• A picture of each type of computer
• A statement about what you would be most likely to buy if cost were no object
• Fireworks text. Heading
• Save your work as a .doc file.  Add a link on your homepage.

 Table 1. Desktop Computers

Table 2. Notebook Computers

Table 3. All-in-one Computer

Table 4. Mobile Phones

Hardware Web Sites

• Retail Computer Systems Manufactures
• Dell - HP United States - Computers - Apple
• Hardware manufactures
• Intel  - Welcome to Intel - Teraflops Research Chip
• AMD - Advanced Micro Devices
• Nvidia - NVIDIA
• Components
• CPU – Central Processing Unit  - Central processing unit - Wikipedia –
• Arithmetic logic unit ALU -  Arithmetic logic unit - Wikipedia 
• Control Unit - Control unit - Wikipedia
• Storage
• RAM temporary high speed storage - Random access memory - Wikipedia
• Hard disk - Wikipedia –USB flash drive
• CD - Compact Disc - Wikipedia – DVD - DVD - Wikipedia – Blu-ray - Blu-ray Disc - Wikipedia
• USB Flash Drive USB flash drive - Wikipedia
• Ports - Computer port (hardware) - Wikipedia – color coding
• USB –  Universal Serial Bus - Wikipedia     FireWire - FireWire - Wikipedia  Hotplugging Speed 480 Mbits/s

Week 7 Searching the Web, OpenOffice Slideshow

Working with one or two other class members, create a slideshow using OpenOffice Impress on the topic “Where I would go if I could during Spring Break”.

 Assignment 7 – OpenOffice Slideshow

Use a free OpenOffice Impress template downloaded from a site such as - http://technology.chtsai.org/impress/  or -  http://www.smalldataproblem.org/ooextras/  or Google “Impress template” for other download sites. 
Save your slideshow as an odp (Open Document Presentation)  and a ppt file add links on your homepage

• Slide 1 – Slideshow name and the names of its creators.  For the title use outline text: highlight text > right click > style > contour
• Slide 2 – A little about the place that you will visit using information from a full text article found in the EBSCO database resource.
• Go to  http://www.library.southernct.edu/newdbs.html
• Login if necessary
• Click on “E”
• Click on “EBSCO databases”
• Select the History Reference Center
• Search using the name of the place you will visit
• Add a sentence about the place to your slideshow
• Cite the reference that you used.  Using the MLA format found in Word 2007.
• Slide 3 Title “Hotel Costs”
• Create a table showing estimated hotel costs for 4 nights using - Bidding for Travel - http://p070.ezboard.com/bpricelineandexpediabidding
• Orbits
• A hotel’s web site
• Slide 4 Title “Airfare”
• A table showing estimated airline ticket costs using  -  http://www.kayak.com/
• Price from an airlines web site.
• Price from Southwest if they fly there - http://www.southwest.com/
• Slide 5 Title – the name of where you are going
• A picture of the place
• A link to a YouTube move about the place.  Insert  > Hyperlink  http://www.youtube.com
• Slide 6  “The End”

OpenOffice Free Download - http://www.openoffice.org/ 

OpenOffice Languages - http://projects.openoffice.org/native-lang.html

Week 8 Assignments 7 and 8 Due, Midterm

Assignment 8

Plan a round the world trip. Include a stop in Accra, Ghana.  See - http://www.staralliance.com/en/travellers/fare_products/round_the_world_fare.html  Include a "print screen" image or other evidence that your itinerary works with star alliance.  Also see - http://www.oneworld.com/ow/flight-info/itinerary-planner  Which planner do you think is better? Why?

Week 9 Webpage addins - Google Gadgets, Working with Numbers

Assignment – Add Google Gadgets from the following categories to your Week 9 webpage.  Try each gadget to be sure that it works (Free services only). See - Google Gadget Demo

There are 38,000 gadgets to select from.

Be sure that your copied code starts with <script and ends with </script>

Put a horizontal line between each gadget. HTML code -  <hr/>

See http://www.google.com/ig/directory?synd=open&source=gghx&cat=all  for Gadget directory.

Required gadgets - “What’s my IP address, ISP, country, proxy” and Multiple RSS Reader -   Be familiar with these terms:

• IP Address - http://en.wikipedia.org/wiki/IP_address
• Hostname - http://en.wikipedia.org/wiki/Hostname
• ISP - http://en.wikipedia.org/wiki/ISP
• Proxy - http://en.wikipedia.org/wiki/Proxy_server
• RSS - http://en.wikipedia.org/wiki/RSS_(file_format) 

Include a gadget from each of these categories. Check that the free gadgets works.

Week 10 Interactive Web, Image Map Hot Spots, Programming Flash Buttons

Flash Button Tutorial - http://www.echoecho.com/flashbuttons.htm

Flash Examples

http://svt.se/hogafflahage/hogafflaHage_site/Kor/hestekor.swf

http://home.southernct.edu/~workmanr1/CSC101collisionDetection1.fla  

http://home.southernct.edu/~workmanr1/CSC101bigproject9_9_3.fla

http://home.southernct.edu/~workmanr1/CSC101SlideShow.fla

Flash Maps

http://www.jetblue.com/wherewefly/

http://www.southwest.com/travel_center/routemap_dyn.html?ref=wwf_fgn

http://www.starwoodhotels.com/sheraton/index.html

http://www.flysas.com/Default.aspx?epslanguage=EN 

http://www.siemreapairways.com/routemap/

http://www.directferries.co.uk/routes.htm

http://www.ryanair.com/site/EN/dests.php?flash=chk&pos=HEAD

http://www.easyjet.com/EN/routemap/

Flash Slide Show

http://www.honda.com/hondajet/?ef_id=1097:3:c_913fcb9c9f966e0808dd4cf73d0aa205_841615408:dtBkOUGvMUIAAHFGfiIAAAAD:20080303013951

Assignment 10 Part 1 -  Place hotspots on an image with three or more objects (for example - countries, people, cats)  When the hotspot is clicked  link to an appropriate web page.

• Assignment 10 Part 2 - Embed Twitter Widget on you Week 10 page- http://www.crunchbase.com/company/twitter What is Twitter? - http://twitter.com/ Optional – Sign up and try it.
• Assignment 10 Part 3 - Programming Flash Buttons
  

CSC101 Week 10 – Interactive Web Pages using Flash

Assignment 10 Part 1 - Place hotspots on an image with three or more objects (for example - countries, people, cats) When the hotspot is clicked link to an appropriate web page.
Assignment 10 Part 2 - Embed Twitter Widget on you Week 10 page- http://www.crunchbase.com/company/twitter What is Twitter? - http://twitter.com/ Optional – Sign up and try it.
Assignment 10 Part 3 - Programming Flash ButtonsFlas

• Assignment 10,  3.1  Flash (Do the following or similar)
• Place logo buttons on a map of the US about where each of final four schools is located. (Men do men’s final four, women do women’s final four.)When the button is pressed open the college’s web site.  Be sure to site where you got the map. School logos - http://collegebasketball.rivals.com/content.asp?CID=699690  

·    Assignment 10, 3.2  Flash -  This assignment is the same as Assignment 3.1 except that when a button is rolled over display one of the school’s colors, when the button is pressed display the school’s other color and  play the school song. School songs - http://fightmusic.com/ 

• Flash set up
• Open Flash and create a new Flash document.
• Create two layers – name the bottom layer “background”, another layer “buttons”
• Create a map background
• Find a map of the United States – at http://images.google.com/images?hl=en&q=map+usa&btnG=Search+Images&gbv=2  for example: http://www.united-states-map.com/50states.htm
• Save the map on your desktop – Right click >  Save Picture As
• Import the map into Flash -   File > Import > Import to Library
• Select the background layer and drag the map onto it
• Create four buttons
• Get four college logos
• Copy a screen from http://collegebasketball.rivals.com/content.asp?CID=699690   into Fireworks.  Crop to get the school logo.
• Crop out a school logo
• Import the image into Flash  - File > Import > Import to Library
• Create a button
• Click on Frame 1 in the button layer
• Insert > New Symbol > Button  - Name the button appropriately example UBC button
• Drag the college logo onto the center of the stage
• Click “Scene 1”
• Click the Action window the top of the Action window should say “Actions - Button”
• Type into the Action Window
• on (press) {getURL(“http://www.unc.edu/” );}
• Test your movie – Control >Test Movie
• Add two more college buttons

• Save your movie as a .FLA and a .SWF file
• File Save As > this will save a .FLA file.  You can edit this file with Flash
• File > Export > Export Move This will create a .SWF file.  This file may be added to your Assignment 10 web page.
• Add your Flash Movie to the Web.
• In Dreamweaver, create a new Assignment 10 page
• Insert > Media > Flash – then click on your movie.  Resize and center the movie
• Flash Assignment 2 notes Create a button that changes when it is rolled over and when it is pressed.
• Click on Frame 1 in the button layer
• Insert > New Symbol > Button  - Name the button appropriately example UBC button
• Drag the college logo onto the center of the stage
• Insert a key frame in the frame under the word “Over”.  Draw a colored circle
• Insert a key frame in the frame under the word “Down”. Draw another colored circle. Click “Scene 1”
• Click the Action window the top of the Action window should say “Actions - Button”
• Type into the Action Window - on (press) {getURL(“http://fightmusic.com/mp3/acc/North_Carolina__North_Carolina.mp3” );}
• Test your movie – Control >Test Movie
• Add three more buttons. Save and export your Flash movie. Add the .swf file to your Week 10 web page

Other related sites

“Widget” options - http://www.billboard.com/bbcom/widgets/widget_config.jsp

• http://sportsillustrated.cnn.com/2008/basketball/ncaa/women/specials/ncaa_tourney/2008/03/22/full_roundup.ap/index.html

http://www.ucla.edu/ - http://www.memphis.edu/ - http://www.ku.edu/ - http://www.unc.edu/  -  http://www.rutgers.edu/  -  http://www.uconn.edu/  - http://www.lsu.edu/   – Maryland – Stanford – Tennessee -  Texas A&M

• Logos – See http://tarheelblue.cstv.com/sports/m-baskbl/unc-m-baskbl-body.html  Click on “Interactive Bracket”
• http://www.expressdistributing.com/00_towing/recvr_tube/ReceiverCovr_College.html also try - http://fightmusic.com/ 

Week 11 Collaboration with Twitter and Google Docs - Assignments 9, 10, and 11 due Thursday 4/11/08

Other

• Web page templates - http://www.dreamtemplate.com
• Bookmarks - tagging, social networking
• http://en.wikipedia.org/wiki/Del.icio.us
• http://del.icio.us/
• Google Calendar
• Twitter
• the movie  - http://twitter.com/
• embed -   http://twitter.com/badges
• help - http://help.twitter.com/  

---


follow csc101 at http://twitter.com

---

 

Assignment Part 1 - Twitter – a practical real-time messaging system for groups and friends. It works on the web or on phones.  Messages are limited to 140 characters.

 

• Read the Twitter guide -  http://www.webware.com/8301-1_109-9697867-2.html

 

• Signup for Twitter – http://twitter.com/  - Select a username that starts with MO113 our class room
• To add a friend go to their Twitter page and click the “Add” link.  If the account is private send a friend request. Try “Find and Follow” and send an Email Invitation
• After you select three or four classmates to follow go to settings and select “Protect my updates”. When this box is checked only people you authorize can read your messages.
• The address of your Twitter page is twitter.com/username
• Exchange 4 or 5 twitters with a few classmates.  Suggested topics: sports, fashions, lunch, Dreamweaver hotspots, Flash buttons
• To turn off Twitter send Off, Sleep, or Stop.  On, Wake or Start turns Twitter on.
• Twitter can be installed as a Google Desktop Gadget. http://desktop.google.com/plugins/ 

 

Assignment Part 2 – Collaborating with Google Documents

• Signup for a Google Mail account. http://mail.google.com
• Open Gmail
• Select “Documents”, Select “New” , Select “Document”
• Select “Share”, Select “Share with Others”
• Invite two other classmates as collaborators.  Place the names of the people that you are working with at the top of your page.
• Together write a one page paper about Tweeter and microbogging.
• Answer these questions: What is Twitter?  What does it mean to follow someone on Twitter?  What are some Twitter applications? How has it been used by politicians?, What social networking sites do you use?  How do they compare with Tweeter?  Do you ever feel “too connected”?
• Save your document. When your document is finished add me as a viewer – workmanr1@gmail.com , send me an email with the document pasted into the email message. 
• Copy your document into your Week 11 web page and add a link on your homepage

Sign up -  http://twitter.com/ - http://en.wikipedia.org/wiki/Twitter - http://www.pbs.org/mediashift/2007/05/for_the_uberconnectedyour_guid.html

http://www.thestandard.com/news/2008/03/27/opinion-10-net-services-will-succeed-and-10-will-probably-fail?page=0%2C12

Twitter Help - http://help.twitter.com/index.php?pg=kb.book&id=1

 

Other

FORGOTTEN FOUNDATIONS

John Lienhard presents guest Frank Tavares

Click here for audio of Episode 2360

 

Week 12 Maps

http://www.southwest.com/travel_center/routemap_dyn.html?ref=wwf_fgn



....CSC101AnimatedButton.fla

 

Review  http://www.delicious.com  -

• Bookmarks - tagging, social networking
• http://en.wikipedia.org/wiki/Del.icio.us
• http://del.icio.us/

 

Map examples - http://www.jetblue.com/wherewefly/  - http://www.ryanair.com/site/EN/dests.php?flash=chk  - http://www.directferries.co.uk/routes.htm - http://www.siemreapairways.com/routemap/

http://www.hopstop.com/  10033 – 11206 Brooklyn

http://www.ctwine.com/map.html - http://www.vpa.org/index.html

 

 

Assignment Part 1 - Create a Microsoft live map. Copy the map to your Week12 web page.

• Open Microsoft Maps http://maps.live.com/
• Find Southern, Search 06515 and locate Southern
• Zoom in and pan to the Southern campus
• View Live Search Maps > Help
• Try Road, Aerial, Hybrid, and Bird’s eye view
• In Aerial view, (Scale 250 yards = 2 inches) Add pushpin (right click – add pushpin) for 3 places on campus that you would recommend for a tour.  For example Baseball, Football, and Softball field.
• Create a title for each pushpin.
• Copy the screen (Print Screen)
• Crop the image in Fireworks and paste it onto your Week 12 page. 

Assignment Part 2 – Add animated Flash buttons to your map.
View Flash Button tutorial – Simple buttons only http://www.echoecho.com/flashbuttons.htm 

• Create a background and button layer in Flash
• Create a two frame Movie Clip - Insert > New Symbol select Movie Clip
• Place a small red circle in frame 1 and a smaller yellow circle in frame 2
  Go back to Scene 1
• Create a button – Insert > New Symbol select Button
• Drag the Movie Clip into the up frame of the button. Return to Scene 1
• Drag the button onto the map. Program it to open an appropriate web site.
• Add two more animated buttons.
  
  Save your Flash work as an .fla file and export it as a swf file  File > Export > Export Movie.  Add the swf file to your web page  Insert > Media > Flash
  
  

Week 13 Video Editing

 

• Assignment 1 - Downloading videos from the web
• Use  www.keepvid.com   -
• Download 60m Hurdles Final World Indoor Championship from YouTube http://www.youtube.com/watch?v=kNF_EP3jQxQ&NR=1 or any other 30 second video
• Save  as an .flv file (Low Quality)  Note that the video will be named “get_video” change this to a more meaning name ending with .flv
• Test that the video works with Flash
• Open Flash
  • Import > Import > Import Video
  • Select Progressive download from a web server 
  • Test that your movie works
  • Add a title to the movie using the Text Tool, for example “ 60 Meter Hurdles Final Word Indoor Championship copied from YouTube http://www.youtube.com/watch?v=kNF_EP3jQxQ&NR=1 “
  • Export your work as a .swf file
  • Add a link on your Week 13 page
• Download another very short video, import it into Flash, add a title, and a link on your Week 12 page

 

• Assignment 2 - Flash video slide shows
• Open CSC101VideoSlideShow.fla
• Select topic and create  a meaningful title page (Scene 1)
• Import videos into scenes 2, 3, and 4. Add titles
• Export as a .swf file add a link on your Week 13 page.

 

·  Assignment 3 - Windows Movie Maker

• Import two .avi  clips into Movie Maker.
• Add two video effects Tools>Video Effects
• Examples -
  • Examples – LIUPaulG1.avi – Soccer2001AviGoala.avi – Soccer2001TimGoal1.avi – AsafaPowell.avi
  • CSC101hurdles.avi
  1. Add a Title overlay –”CSC101 Fall 2007”  - Tools>Titles
  2. Add a Transition - Tools>Video Transition
  3. Add Title overlay – “The End”
  4. Upload you movie to YouTube.com or a similar video site.
  5. Add a link to your movie to your Week 13 page

 

 

Other

http://www.jumpcut.com supports online video editing

http://vixy.net   - http://www.flvix.com/ and www.zamzar.com -  can be used to a .flv file to ,avi format 

Remote login  - https://remote.southernct.edu/

---

CSC101 Video 2

 

• Prewritten Flash Buttons
• Window > Common Libraries > Buttons -  Select - Playback Flat
• Drag the button onto the stage
• Try Buttons Rect Bevel, Playback Flat, Pushbuttons,  Arcade
• Coding examples
• Finding Code
• MovieClip Control – on
• Timeline Control – stop, play, nextFrame, gotoAndPlay, nextFrame
• Browser/Network – getURL
• Code
• on (press) {gotoAndPlay(20);}
• on (press) {getURL("http://www.ibm.com");}

 

Sample websites with Flash Content

 

 

• Leona Lewis - http://www.leonalewismusic.co.uk/index.php/index
• Flo Rida - http://floridaraps.com/
• Sara Bareilles - http://www.sarabmusic.com/
• Chris Brown - http://www.chrisbrownworld.com/

 

Flash example with buttons – CSC101FlashButtons.fla

 

Week 14 Web Design

Share on Facebook

Fireworks menubar with clickable hotspots

---

---

Menu from http://www.flashvortex.com/

---

Hit Counter


Search Engine Optimization

 

Week 14 Assignments include on your Week 14 page:

 

• Animated Flash Button menu  Links to Assignments Weeks 12 and 13  use http://www.flashvortex.com/ or similar - http://search.conduit.com/ResultsExt.aspx?ctid=CT1060933&SearchSource=3&q=flash+buttons  - For horizontal buttons set “Buttons per line” to 2 or more
• Fireworks gradient image with text and hotspots (Three links)
• Last updated code from - http://www.slis.indiana.edu/faculty/hrosenba/www/Demo/javascript/6update.html
• Facebook link - Add a link or button to your site to make it easier for your content to be shared on Facebook. http://www.facebook.com/share_partners.php NOTE: The Facebook icon must appear..
• hit counter - Search “web hit counter” - http://www.freecountersnow.com/  or similar http://search.conduit.com/Results.aspx?q=web+hit+counter&SearchSourceOrigin=3&SelfSearch=1&hl=en&ctid=CT1060933 
• Optional – Guestbook – Search “web guestbook” http://search.conduit.com/ResultsExt.aspx?ctid=CT1060933&SearchSource=3&q=web+guestbook  - Example - http://www.smartguestbook.com/
• Optional PayPal eCommerce  - WebAssist.com PayPal eCommerce Toolkit - to add eCommerce to your business web site.
• Extra Optional Redirection - Do not use unless redirected to another Week 14 page.  - Place the following code inside your <head> tags <meta http-equiv="refresh" content="2; url=http://www.NewWebSite.com"> - http://www.scriptomizers.com/html/html_redirection

 

 

Fireworks menu bar notes:

Fireworks – Menu rectangle with text and hotspot links

Draw a rectangle, Select gradient and click on the color selector. Select and adjust presets.

Add text using the Text Tool

Add Drop Shadow Text – Filters > Shadow and Glow > Drop Shadow

Fit Canvas

Select > Select All   and Modify > Group

Save Image

In Dreamweaver Insert > Image and add hotspot links

 

Website Design

http://search.conduit.com/ResultsExt.aspx?ctid=CT1060933&SearchSource=3&q=web+design

http://thetop10webdesigners.net/webdesign.htm

Open Source Web Design – free templates - http://www.oswd.org/

 

Week 15 - Last Class May 6 - Assignments 12, 13, and 14 Due

CSC 101 Week 15  - 2ed Half Assignments

 

GIS Mapping

 

Chicago transit authority -  http://ctabustracker.com

 

http://ctabustracker.com/bustime/home.jsp

 

ArcGIS Explorer

http://services.arcgisonline.com/440/explorer/help/index.htm#whatyoullseeonthescreen.htm

 

Adding real-time data in ArcMap

http://webhelp.esri.com/arcgisdesktop/9.2/index.cfm?TopicName=Adding_real-time_data_in_ArcMap

 

Applying custom VB actions in real time

http://webhelp.esri.com/arcgisdesktop/9.2/index.cfm?TopicName=Applying_custom_VB_actions_in_real_time

 

Paper 3018 Comprehensive GIS Application for West Nile Virus ...

eventual human cases of WNV, the Chicago Department of Public Health began.

development of a real-time WNV spatial data repository and surveillance system.

http://gis.esri.com/library/userconf/health04/papers/pap3018.pdf

 

Real-time Pavement Management - Articles

Loyola University Chicago- Geographic Information Systems

 

 

1st Half Assignments and MidTerm Outline

 

Week	Topic	Done	Software	Links
1	Homepage Setup		Dreamweaver	Your homepage
2	Web Resources Book Costs Resource Types		Excel 2007 save as xlsx and htm PowerPoint 2007 save as pptx and htm.	Add link to .htm file
3	PC Management Word 2007		Word 2007 save as docx and htm	Add link to .htm file
4	Images Text Favicons Animated Text Photo editing Dreamweaver Starter Pages Flash Animation		Fireworks Flash – save as fla and swf file. Insert the swf file on your web page. Online icon and text editors. Place the Favicon on your homepage	Place Text, Animated Text, Photos, and Flash animation on Image.htm. Also add a link to your starter page.
5	Office 2007 Word 2007 – watermarks, page color, boarders Business Cards Mail Merge		Word 2007 – save as docx and htm file	Add a link to your.htm files
6	Hardware Hardware notes		Open Office Writer	Add link
7	Searching the Web Search notes		Open Office Impress	Add link
8	Fix  your homepage, be sure that all links work. Midterm –The midterm webpage requirements will be available on web/CT/Blackboard - Tuesday, March 8 from 8:00AM to 5:00 PM.  The page requirements will be selected from the course exercises. Add a link to your homepage named “MidTerm”
9	Spring Break

 

 

 

2ed Half Assignment Summary

 

Week	Topic	Done	Software	Links
9	Webpage addins Google Gadgets		Google Dreamweaver
10	Interactive Web Pages Image with three HTNL Hotspots Embedded Twitter Widget US Map with Flash logo buttons		Fireworks Dreamweaver Flash
11	Collaboration Twitter Google Docs		Twitter Google Docs
12	Maps MS Live Map with pushpins and animated Flash buttons		MS Live Map Flash
13	Video Editing Video download Flash video slide shows Windows Movie Maker		Keepvid.com YouTube Flash Movie Maker
14	Web Design Animated Flash Menus Fireworks/Hotspot Menus Hitcounter Last updated		Flashvortex.com Fireworks Dreamweaver

 

Final Exam

 

Topic Connecticut Wine Tour - http://www.ctwine.com/

1. Create a Final Exam web page include on the page:
1. Text “CSC101 Final Exam your name” using an interesting font on a gradient background
2. A “last updated” message.  See note below
3. A horizontal animated Flash button menu bar with links to:
1. Your CSC101 homepage
2. The CSC101 homepage - http://home.southernct.edu/~workmanr1/  
3. The Connecticut Wine Trail homepage http://www.ctwine.com/ 
4. See  http://www.flashvortex.com/ 
4. Two wine related Google gadgets
5. A grape shaped purple Favicon
6. An embedded wine related YouTube video
7. Change your page background color to a color other than white
8. Flash Movie an .swf file with these requirements
1. Flash movie requirements
1. A road  map of Connecticut from http://maps.live.com/
2. Fireworks
1. Crop the map and place small semitransparent mark on each of your three assigned vineyards. See  for your assigned vineyards
2. Use a semi transparent color to the roads to take on a tour of the three vineyards
3. Flash
1. A movie clip of a grape that flashes white grape color and red grape color
2. A button in the shape of a small grape.  When the button is rolled over, the button flashes between a white and purple grape.
1. Place the animated buttons near the location of each of your assigned vineyards
2. When the button is clicked open the vineyard website
4. Add your Flash movie (.swf file) to your Final Exam web page.

 

---

Note:

Last document code with selected font color - http://www.slis.indiana.edu/faculty/hrosenba/www/Demo/javascript/6update.html

 

<script language="JavaScript">

<!-- Hide JavaScript...

var LastUpdated = document.lastModified.fontcolor('red');

document.writeln ("This page was last updated.fontcolor('red') ".fontcolor('yellow') + LastUpdated);

// End Hiding -->

</script>

 

Note colore may be selected using “#rrggbb” example “#00FF00” equals green

 

 

 

Sample MidTerm Exam

 

Create a web page with the required features. Select a page for one of these presidential candidates or pick a unique approved topic of your choice.

Clinton - McCain - Obama

 

• Dreamweaver Setup
• Use the Dreamweaver Home Entertainment, home page, starter page
• Heading – your name and CSC101 midterm exam
• Tagline – the name of the candidate
• Pictures
• Top left picture – your name and CSC101 MidTerm in Fireworks text on a starry background
• Right side pictures - Two pictures of the candidate. Relevant headings and text. Change the “read more” link to link to the site you got the pictures from
• Text
• Text 1,text related to the candidate
• Text 2, a four item bibliography (two books and two web sites) in APA format, pasted from Word 2007
• Links – label the links
• A labeled link to your homepage
• Two labeled links to relevant YouTube videos
• Two labeled links to relevant sites.
• An email address for the contact link – Insert > Email Link
• A red, white, and blue Favicon
• Add a link on your homepage named MidTerm Exam

CSC101 Sections 01 and 02 Midterm Exam

 

Create a web page with the required features. Select a page for one of these presidential candidates or pick a unique approved topic of your choice.

Clinton - McCain - Obama

 Exam requirement checklist.  Ten points off for any missing requirement. Pages and all assignments are due Thursday, March.

 

Midterm Grading # 10 points each		Requirement	Done
1	Dreamweaver Setup	Use the Dreamweaver Home Entertainment, home page, starter page
2	Heading	Your name and CSC101 midterm exam
3	Tagline	The name of your topic
4	Pictures	Top left picture – your name and CSC101 MidTerm in Fireworks text on a starry background
5		Right side pictures - Two pictures. Relevant headings and text.
	Links below pictures	Change the “read more” link to link to the site you got the pictures from
	Text	Text 1- text related to your topic.
6		Text 2 - a four item bibliography (two books and two web sites) in APA   format, pasted from Word 2007
7	Links	A labeled link to your homepage
8		Two labeled links to relevant YouTube videos
		Two labeled links to relevant sites
9		An email address for the contact link – Insert > Email Link
10	Favicon	A red, white, and blue Favicon
	Homepage Link	Add a link on your homepage named MidTerm Exam