Wednesday, May 9, 2012

Agenda May 9-16 - Google Sketchup

Hello all! Here is the last project we will do for the semester:  Google Sketchup.
  1. Watch these the first three video tutorials.  As you are watching them, pause the video and go into Sketchup and do what she does.  Save your work in a folder on the network called "Sketchup"
  2. I will take a “screen grade” (look at your screen) for tutorials 2 and 3, but there is no way you can do 2 and 3 without also doing 1!  Grade is for completion. Please take your time and get to know the program.  It is not a race!
  3. At the end of class, write down what video you are on and what time in the video you stopped so you can pick up where you left off next class.
  4. When you are finished with the tutorials, you will get to design your own room in a house.  
    1. Your project will be based on this tutorial.  Make a museum or room in a house that has pictures on the walls.  You may use your own pictures or use photos from the Mercy Activities Scrapbook.  The assignment will need to include the following:
      1. A picture from a Mercy event that you attended this year
      2. Design is not just a rectangular room, but includes some interesting architecture.
      3. Realistic colors in your room
      4. Design has no extra lines
      5. Drawn to scale. feet, not inches
      6. Include some accessories from the 3D warehouse.
  5. Next class I'll also give you your exam review sheet.

Wednesday, April 18, 2012

Agenda April 18 - Client Interview

Peg Edwards and her coworker will be here today to discuss what she would like to appear on her website and how it will look. Please be courteous, respectful, and make sure you ask all the questions you need to ask so you can design her a website!

Sunday, April 15, 2012

Agenda April 16 - Professional Web Design Process

Today we will begin by going through the process by which the professionals create a website for a client. I have a presentation on the Design Process to share with you. On Wednesday, we will have our client join us in class to be interviewed, and you will need to make sure you all ask at least the questions on this sheet and more. Does she want a mobile site? Does she want or need a Facebook page? We want this to be the most useful for her. I'll make copies of that worksheet for you to write on during the interview. You will be graded for your participation on Wednesday in the interview in the following ways:
  • Polite and respectful to guest
  • Ask at least one question
  • Take detailed notes
  • Maintain interest in meeting
  • Avoid other tasks during interview
I will break you up into 5 groups and each group will focus on a different part of the site. The next step of the production process is described in this document.

The timeline for completing this website is on the Class Calendar tab at the top.


Monday, April 2, 2012

Agenda April 2-4 - Java vs. JavaScript

You may have heard these two terms before, but what are they? Aren't they the same thing? Actually no.

Today we will look at both of these through a website I created and saved in the network folder. Then you will have the opportunity to add both a Java Applet and some JavaScript code to your Movie Review website before Spring Break.

We will add the following together:
Java Applet - Scrolling text
JavaScript - Snowing on Page

Wednesday, March 21, 2012

Agenda for March 21 - Continue Flash

I have checked your folders and I want to thank everyone who worked hard on Monday. I can see evidence of completed Flash Tutorials and the beginnings of Ad Banners for several people.

Here is the agenda for today:
  1. I will go around and make sure each of you have the beginning of your ad banner planned out which was your homework that was due on Monday.
  2. Anyone who is not finished with your Flash Tutorial, needs to do that first before beginning on your ad banner. If yours is too challenging, then choose another one.
  3. Continue working on your Ad Banner. Remember, you can choose which tools you use for this project. The directions are on a previous blog entry, you just have to read them.
As we discussed last week, class time is precious, so you need to do the preparation outside of class so that you can use the programs while you are in this room. I only received two emails on Monday with questions from students, so the rest of you should be ready to get down to work as soon as class starts!

Sunday, March 18, 2012

Blog Entry #10: Flash Banner

On the next blog entry you will post your Flash Banner you have created and write a description of how you developed your banner. Describe all of the Flash and Photoshop tools and effects included in your original animated ad, you should use at least 10 tools. Don't forget to describe why you have created this and why you are posting it on your blog. Who is your audience and what is the message? Assume the reader doesn't know the assignment.

Your finished blog entry will also have your ad banner inserted. Here are the directions for how to get your flash banner onto your blog. You'll have to upload it at school, but you can complete the rest of the blog entry at home if you run out of class time. This needs to be posted to your blog by Midnight on Thursday, March 22.

Tuesday, March 13, 2012

Agenda March 13 - Flash Ad Banner

Today we will first finish the tutorials that you started last time. Hopefully we will be able to share some of these by the end of class today.

Here are the directions for the Ad Banner that you will complete.

You want to maximize your class time use of the program that you don't have at home! By next class, Monday, March 19, you will have to have written down the following:
1. topic
2. exact size of ad banner (not wider than 500 px. A vertical ad might be 200 X 600. A horizontal ad might be 150 X 500 px)
3. What type of animations? Think about the 10 t00ls you might use from Flash and Photoshop.
4. What text will you include?
5. What pictures will you include? (find these photos before class)

The entire Ad Banner will be due on March 23 at midnight and it will be posted on your blog. That will give you three full classes to complete it. More about that blog entry to follow soon. Juniors going on retreat may have until Monday night, March 26.

Thursday, March 8, 2012

Agenda March 8 - Flash Practice

4th block is a day behind 2nd block, so 4th block will need to look at the agenda from last class for what we are doing today.

2nd block will first try to challenge themselves and add another feature to your animated face you created last class. Try to make eyebrows that stay still the whole time, eyebrows that go up as the eyes move, a tongue that sticks out as the face smiles, etc.

Then you will use a tutorial from this website to make another effect. Most of these effects include pictures, not shapes that you have drawn, so you will see how to use those as well. There are so many things you can do with Flash, as you will see by browsing through this massive list of tutorials! A note that 2nd period realized is that you have to be very careful in following the directions and sometimes the directions are not perfectly clear. If you have ActionScript in your tutorial, when you start your Flash Document, choose ActionScript 2.0 rather than ActionScript3.0 **unless your tutorial specifically says to use 3.0.

We will share these at the beginning of next class from your network folder. Every student should complete at least one tutorial, no repeats. Once you have decided what tutorial you want to do, sign up on this document. There are 26 pages of tutorials, so don't just look at page 1!

Monday, March 5, 2012

Agenda March 6 - Flash!

Don't worry 4th block - we will finish your website that you didn't get to finish due to the Tornado Early Dismissal last Friday.

Changing gears from Website creation, we will work with Flash for the next couple weeks. Flash is used to make animations on many websites including these:

Monday, February 20, 2012

Agenda February 21-29 - "Movie Review" Website Performance Task

First thing on Tuesday, February 21, I will need to check your practice site you have been working on. After that you can begin the next project on your own. You are going to create a website that is a review of one of your favorite movies. For more detailed information please read the rubric. You will need to do the following:

Before the end of class on Feb 23, have Mrs. Heitz check:
  1. Navigation Structure (Smart Art graphic in Word)
  2. Wireframe in Fireworks including colors, fonts and sizes.
Before the end of class on Feb 29, have Mrs. Heitz check:
  1. Root Folder for movie site
  2. Layout pages using CSS-P div tag
  3. Navigation Buttons in Fireworks
  4. External CSS Style Sheet to keep it consistent.
  5. Complete Home Page
  6. Complete entire Website

Friday, February 17, 2012

Senior Photos



For all you Juniors, if you are interested in getting a FREE photo session, apply to be a Senior Rep for Kelly Beach Photography.
Check out her Blog for details. The application is at the bottom of the page.

Thursday, February 16, 2012

Agenda February 17 - Finishing Practice Site

Today is the day we will finish up the last steps on our sample site we've been making together. You'll need to add content to the other pages of your site and make it look nice and consistent. Feel free to change the CSS file if you don't like the colors and fonts.

When you are finished, call me over and I'll check it from your screen.

Tuesday, February 14, 2012

Agenda February 15 - Hyperlinks and Navigation Buttons

Continuing with our practice site we've been working on (I promise we are almost done with this and you'll get to create one about a topic you are interested in!) we will add hyperlinks and navigation buttons.

Hyperlinks are very easy to add from the Properties panel at the bottom of the window. Navigation buttons are what you made in Fireworks on Feb 3 when I wasn't in class. Today, we will make navigation buttons that will fit in the exact spot where they need to go on your website (the "links" div). I'll walk you through it, but the Fireworks Button guide has great step by step directions for you to use later.


Wednesday, February 8, 2012

Agenda February 9 - CSS in Dreamweaver

Today we will look at adding content to our pages and keeping it consistent across the entire website. I'll take you through making CSS styles on your pages after we review what CSS can do using the CSS tutorial that you did last week.

This document and this document have screen shots that can be a help you understand the panels that I am going to show you today in Dreamweaver.

We will discuss both internal and external Style Sheets and how you can transfer from one to the other. External Style sheets let you apply formatting consistently across your entire website.

Friday, February 3, 2012

Agenda February 3 - Fireworks buttons

I will not be in class today, so please finish the CSS assignment from last class and then complete the tutorial to create navigation buttons in Fireworks. If you understand the CSS assignment, please help your classmates. I will finish explaining CSS next week.

I know you can do this. You have already familiarized yourself with Fireworks from doing the wireframes of your websites, and the tutorial is easy to follow. Save these practice buttons in your "sample" folder.

If you finish both the CSS tutorial from last time and the Navigation buttons tutorial in Fireworks, you may challenge yourself to create navigation buttons that fit the "links" div on your home page and each button should be labeled to go to the three content pages.

Tuesday, January 31, 2012

Agenda February 1 - CSS

Today you will work on your own to view and complete a CSS Tutorial where you will see what CSS can do to a website. The directions are here. When finished, you will show it to me on your screen for a grade.

Next time, you will apply CSS to the website we have been working on.

Sunday, January 29, 2012

Agenda January 30 - Finish CSS-P of content pages

Last class we did the layout of the homepage in Dreamweaver using CSS-P. Today you should finish the wireframe of your content pages from two classes ago (using Fireworks) and then make the layout of one of the content pages in Dreamweaver. Our homepage was called "index.html" so this page should be named according to the structure that your class decided on and saved in the 2B/4B folder.

Use your wireframe to finalize a color scheme for your website by coloring in the boxes and keep the colors consistent on both home and content wireframes. Do not transfer the colors over to Dreamweaver, we will do that next time.

Fill out your home page with content that you think should appear on the home page. Do not change fonts or colors, but do assign tags such as h1, h2, and p to your text (look in the properties panel at the bottom to do that). You may insert pictures as well.

We will do the content pages next time, but if you want to start thinking about the content you would put on those pages, you may. Just save photos you want to use in your folder for your website to insert at a later time.

For next class, please read the first page of this document and make sure you understand what it says.

Wednesday, January 25, 2012

Agenda January 26 - Layout of homepage with Dreamweaver

We will take the wireframe you designed in Fireworks last class and turn it into an actual webpage in Dreamweaver today. We will use something called CSS (Cascading Style Sheets) to do this. It allows pages within your website to stay consistent and allows you to change colors and fonts on your entire website with one click. If you want to know more about CSS, here's a video.


I will go through this guide for creating a home page layout and we will do the home page together. Then you can finish the Content Page wireframe in Fireworks if you didn't finish that last class.


To practice creating div tags some more, you will create a layout for one of your content pages on your own.

This is really starting to turn into a website now!

Monday, January 23, 2012

Agenda January 24 - Wireframe of Website

Today we will take the sketch that we decided on last class and each one of you will create a wireframe for your site using Fireworks (another Adobe program). We will loosely follow these directions, so you can use them if you are absent or need directions when you do it on your own for the next project.

Friday, January 20, 2012

Agenda January 20 - Home Page Design

The first thing I'd like you to do today is fill out this form, then we will discuss.

Afterwards we will look at how you plan a site. We briefly discussed how you layout the structure of a site using Smart Art graphics in Word. But what about the actual layout of the page? For that you use a wireframe. We will create a wireframe of Mercy's Website so you can see what that looks like, and then we will create a sample together.

Tuesday, January 17, 2012

Agenda January 18 - Dreamweaver Intro

At the beginning of class, please make sure that the final version of your Favorite Food site is saved on you network folder. If you took it home on a flash drive, you'll have to replace the older version. I'll take a look at these late so that today we can move into designing with a WYSIWYG editor. (Can you guess what that stands for? Hint: it allows you to create and edit websites without using HTML code.)

Here's what we will do today:
1. Overview of the Dreamweaver Workspace: Guide and Video
2. How to set up a Local Root Folder : Guide and Video
3. How to work with Text and Images: Guide and Working with Text Video, Working with Images Video
4. The Dreamweaver Insert Panel: Guide

I may or may not show you all of these videos in class, but they are great resources to help if you need a refresher later or you missed class today.


Thursday, January 12, 2012

Agenda January 13 - HTML Day 3

I'm not going to check the additional tags you added to your Favorite Food site yet. We will add more today. The notes are on how to hyperlink and add a second page to your website. Remember the Naming Conventions when you name your second page.

Here is the assignment for today which you will add more tags to your Favorite Food site.

For the future, here is a HTML Reference Sheet that shows all the common tags and what they mean.

Tuesday, January 10, 2012

Agenda January 11 - HTML day 2

Today I want to make sure that the website you created last class has all the correct tags and it is written clearly. It will make it much easier to add to your site if the first part is correct!
Today's notes are on a few more basic tags. Then we will look at how you are to name any additional webpages you create to link to your homepage (which you always name index.html) using these Naming Conventions. We will also look at how to use a Graphic Organizer (SmartArt in Word) to layout the Navigation Structure of your website.

Here is the assignment for today which you will add more tags to your Favorite Food site.

Sunday, January 8, 2012

Agenda January 9 - HTML day 1

I want to first congratulate the Seniors on finishing their Senior Service Projects! I heard great things about them.
Today,we will be going over the worksheets that the Juniors filled out last week and looking at
what makes a website effective. This website is not effective!
We will then look at these notes and discuss the history of HTML code and by the end of the day today you will actually have created your very own website!
Here are the guidelines for today's assignment.

Tuesday, January 3, 2012

Agenda January 4, 2012 - Analyzing Websites

I hope you had a wonderful break. We are going to start looking at websites this semester and eventually you will create your own. The seniors will be joining us next week, but we will get started without them and catch them up later. I want you and a partner to look at one of the following websites and analyze it by answering the questions on this Analyzing Websites worksheet. Please make a copy of this Doc and type your answers on this sheet, share them with your partner and with me. Make sure to rename the file "Block # Last Name, First Name - Analyzing Websites" Put both names on the file.

We will go over it next class when the seniors are all here.