This course is scheduled to be designed in the summer and taught and evaluated in Fall 2006.

Monday, July 10, 2006

Research and Content Development

I have concentrated most of my week in reading the next few chapters of the Baehr book.

I had already considered the following information:

Baehr argues that a web site must be designed for the needs to the user:
1. pages must be able to stand alone
I have decided to put all information about certain content on one page. The left navigation will be repeated so that users can move to different pages in the particular unit from any page. The top navigation will allow them to move to any particular unit from any page.

2. content flexible and readable across broad user habits, browsers and system settings
The content text will be easily printable and accessible on any computer.

3. pages read in non-sequential order
Pages will be able to be read in any order and the student will be able to navigate to any page within the unit. Links which take the user to external sites will be opened in new windows so that the student will always have the course page available.

4. content must be chunked
I will keep this in mind as I write content for my students. I have also designed the site so that the content does not extend from one side of the screen to another. I know that I dislike sites which have text covering the whole width of the screen because it is easy to lose track of the line. I consider myself a pretty proficient reader and if I have problems reading lines that are that long, I'm sure others have the same problem. I have included the center column for the content information. It will cover about half of the screen so that users do not have to read from one side of the screen to the other.

5. chunks liked via "associative relationship"
As I work on the content pages and activities refer to previews units, I will add navigation links to take the student to the particular page. Because I want to keep the units separate, I will provide students to a way to return to their original page by having the link open in a new window.

6. provide meaningful labels
I will provide meaningful labels that students are likely to have heard used in other classes. I will also provide a video overview of the website to orient the students who may be unfamiliar with specific terminology and its function. I will repeat the labels at the top of the pages so that navigation will be clearer.

7. multimedia and audio allow user to visualize concept and interact with content
The multimedia components that I will be adding to the page should fulfill this requirement.

Users dislike:
1. excessive scrolling
Because students do not like scrolling, for longer pages I will provide links to content chunks within one page. I need to go back and add the return to top link so that students don't have to scroll up when they are finished with a particular chunk.

2. longer chunks of text
As I write the content, I need to be especially careful about the size of the chunks. All literature recommends 5-7 chunks per section.

These are the principles that I considered when designing the course shell:

Principle: Discernment of Depth
Baehr argues that elements on the screen become visual elements which tell the user how the site is organized and thus provide contextual details. Once the user is familiar with the context, they will turn their attention to the content.

It was important to me to keep the context similar throught the site so that the user would not have to restrategize for each particular unit. I also wanted for all the global/overall unit information to be visible on the screen. What I think will be most important for them will be the supplemental media resources and the deadlines. What will be useful will be the information found on a specific page.

Principle: Fixation solves a problem
The user will seek elements which help solve a specific need
I think that the media resources will fulfill this. The search engine can also help.

Principle: Vision is selective
Users focus on examing specif chunks of text or graphics to determine what they mean and how they can be used

Because the context will be the same in all the units, the student will know from unit to unit what to expect from the site. He will also know what are of the page he must focus on to get the information he needs.

Principle: Shapes are concepts
Shapes provide meaning and suggest function to users and help them make decisions about navigation and strategies for filtering information.

Since shapes are concepts but I have to extra careful about images (WebCt already has them), I decided to use color to help for the shapes to help the students navigate. I have the blue navigation bar to the left will take students to other pages relevant to the unit and the orange navigation to the right will help them navigate within one page.

Principle: Complete the incomplete
User construct a meaningful whole picture of the site. Users "think visually, spatially about the meaning, location, and function of content to help act, read, and interpret content."
Because my navigation structure repeats througout the site, I think it will be relatively easy for students to get a whole picture of the site using the components I have provided.
Content Analysis
The content of the site will be organized by units. Each unit will have specific content.
Media resources will be the first component. Media will be either video or audio which will supplement the text information provided on the pages or will provide additional instruction.
Reading resources will provide students will links to reading materials and instructions for the units readings.
Grammar resources will be links and instructor produced resources to help students with grammar questions. I will be adding video tutorials in this section to target weaknesses which I see in several students.
Site map--I need to add a site map so that students can see a one page structure of the course with links to relevant pages. This will need to be updated as new material is added. The site map will part of the main template page.
Web search--I have a basic keyword search but haven't been able to make it work. I have to trouble shoot that. I also have to see how that work within WebCt.

Sunday, July 02, 2006

Course Design (Again!)

Well, I thought I had finished the design but it seems like I haven't yet.

I decided that I wanted to work with templates. One of my goals is to be able to share my design so I decided to teach myself about Dreamweaver templates.

I set up a teaching notes page on my site with the following info:

Teaching Notes:

Teaching Notes:

Design Overview

This course site is designed using templates and nested templates.

I used templates because they allow me and any user the flexibility to place different texts on different levels of the nest in order to be more efficient. The following is the design of the site nest and what you can edit by designing documents using different templates.


Site Architecture Explanation

Main Index Page --This page

  • has all the layout design and can be edited.

  • if used as a template for a new document, the new document will have the top and bottom bars locked. To edit those, you must open the index template and make the changes there. The changes will appear in all other documents.

  • the top and bottom bars are the only navigation bars which will not change throughout the site.

  • it also includes instructor information which will not change throughout the site. This allows one to go in and change the instructor information only once for the entire site.

  • the blue navigation bar stays editable because that will serve as the main navigation bar for each unit which will have links to different resources and tags to different parts of the portfolio page.

  • content and on this page information should not be edited on this page.


Course Info Templates--This page

  • was created using the Main index page template.

  • has all the layout design but has the top and bottom bars locked.

  • this template was used to create the course info pages.

  • to edit the blue navigation bar for this particular unit (course info), open the template page.

  • all unit or course info pages will show the new information.

  • content and on this page information should not be edited on this page.

  • creating a page using this template will lock the blue navigation bar (since all unit pages should have the same navigation bar to point students to the same resources as they work on the unit assignments); on this new page you will be able to edit content and on this page information.

Unit/Portfolio Template--This template page

  • was created using the Main index page template.

  • has all the layout design but has the top and bottom bars locked.

  • this template is used to create the portfolio pages.

  • to edit the blue navigation bar for this particular unit (portfolio), open this template page.

  • all portfolio or unit pages will show the new information.

  • each portfolio or unit has its own template; editting portfolio 1 template will not change portfolio 2 pages.

  • content and on this page information should not be edited on this page.

  • creating a page using this template will lock the blue navigation bar (since all unit pages should have the same navigation bar to point students to the same resources as they work on the unit assignments); on this new page you will be able to edit content and on this page information.

  • note: this page Teaching Notes.html was created using the Portfolio 1 template. If you open this page the top, bottom and left navigation bars are locked and only content and on this page information can be edited.

Site Architecture Picture

  • Main Index Page Template

    • Course Info Template

      • Course Info Page

      • Expanded Description

      • Grading Criteria

      • Learning Outcomes

      • Materials

    • Portfolio 1 Template

      • Portfolio 1 page

      • Media resources

      • Assignment Details

      • Discussion Details

      • etc.


    • Portfolio 2 Template

      • Portfolio 2 page

      • Media resources

      • Assignment Details

      • Discussion Details

      • etc.

    • Portfolio 3 Template

      • Portfolio 3 page

      • Media resources

      • Assignment Details

      • Discussion Details

      • etc.

    • Portfolio 4 Template

      • Portfolio 4 Page

      • Media resources

      • Assignment Details

      • Discussion Details

      • etc.

    • Final Essay

I still haven't worked out how I'm going to work out my pages in WebCt. I thought I had figured something out but it turned out to be a dead end. I tried Jeff's (I don't know who he is) and played with the header settings in the WebCt Page. But the headers can be set for the first page or for the whole class site. What I wanted to do won't work. I'll figure something out.

The course shell is online at www.janiesantoy.com/CompositionI/index.html