DRAFT: This module has unpublished changes.

"Website Design and Usability Using Deamweaver"

Digital Image Design

Dulaney High School, Timonium MD

DRAFT: This module has unpublished changes.
User-uploaded Content

Redesign the Dulaney High School Website

by Andrew Pierre

DRAFT: This module has unpublished changes.

Digital Image Design "Website Design and Usability" UNIT PLAN

Dulaney High School

Design a functional website in Dreamweaver based on Design Principles and Usability Rules of the web. 

 

Redesign Dulaney High School Home Page Files:

redesignDULANEY.pdf

Design Principles and Usability.pdf

 

Assessment Files: (final website)

webcrit.pdf

webselfreflect.pdf

websiteassessment.pdf

DRAFT: This module has unpublished changes.

Teaching Resources / Visuals

DRAFT: This module has unpublished changes.
User-uploaded Content

Prezi.com Presentation, Good vs. Bad Website Design

DRAFT: This module has unpublished changes.

 

Sequence Chart DID_sequence_chart.pdf

DATE

OBJECTIVE

DAILY SEQUENCE

MATERIALS

Mon

3/21

Students will research the difference between a good and badly designed website

 

  • warm up (good and bad about dulaney web site home page) discuss and write down in document what each student suggests
  • explain objective, where we are going and the steps we are taking to get there
  • show examples of good vs. bad websites
  • research, find examples, of a good and a bad website
  • discuss sites found and list of good things and bad things
  • if extra time: begin to show examples of net art
  • prezi
  • class document to write good vs. bad ideas

Tues

3/22

Students will investigate design terms and definitions to learn about how to make a successful design

  • warm up (students look up there assigned definition)
  • go over definitions of words (compare and relate to discoveries made previously)
  • objective for next few days: to redesign the Dulaney High School home page in photoshop or illustrator
  • explain what they will be doing (show website and document of what they need to include) not designing a functional website, but concentrating only on the design
  • end class with an artist image, net art example
  • prezi
  • website and “redesign dulaney” doc
  • Universal Principles of Design book

Wends

3/23

Student will work on redesigning the Dulaney High School home page, concentrating on the design elements of the page

  • warm up (worksheet definitions)
  • continue to work on redesigning web page in photoshop (do with class, create my own redesign and go through individual steps and things to include)
  • start with designing logo
  • prezi
  • website and “redesign dulaney” doc

Thur

3/24

Student will continue work on redesigning the Dulaney High School home page, combining the individual sections of a webpage

  • warm up (who is your audience question)
  • continue work on website redesign (place logo, add navigation, text, info, all other elements)
  • end with net art piece
  • prezi
  • website and “redesign dulaney” doc

Fri

3/25

Students will their redesign of the Dulaney home page and discuss why they have made the design decisions they have made

  • warm up (design words/rules within parts of the amazon web site)
  • talk about each others redesigns, what changes did you make and why, critique (praise, polish, question)
  • review design words and principles throughout
  • prezi

 

Mon

3/28

Students will learn basic functions of the program dreamweaver in order to better understand how they may use it

  • warm up (open dream weaver)
  • dreamweaver demo, create a basic functioning dream weaver page, learning organization, linking, rollovers, images, page properties as a class following step by step directions
  • prezi

Tues

3/29

Students will come up with an idea for a website they will create 

Students will create a strategy document for how to create this website so to establish their initial ideas and a basic plan for producing their website

  • warm up (in dreamweaver make a page with one link, an image and a colored background)
  • strategy/brainstorming ideas for website to create, what is the point of the website? who is the audience?
  • show examples of websites from emac class (made by students who were just learning dreamweaver)
  • create a strategy document, how will you make it? what information will you include? what colors/design elements will you use?
  • prezi

Wends

3/30

Students will plan out their web site by using wireframes and sketches to visualize their ideas and then begin to create their site in dreamweaver

  • warm up (strategy questions)
  • once you have a written strategy document you can begin to sketch your page, either on paper or in photoshop
  • wireframes and information architecture (http://www.visualcomplexity.com/vc/
  • how are you using the design words/rules that we went over?
  • begin to create website in dreamweaver
  • prezi
  • sketch paper planning paper

Thur

3/31

Students will translate there visual planning into a dreamweaver webpage in order to begin creation of a functioning website

  • warm up (open documents and materials and begin working, work day)
  • go over assessment criteria rubric
  • independent work day, continue to create website in dreamweaver
  • have home page completed in dreamweaver by end of class on friday
  • group share of what you are making, what elements you have created, and if there are any suggestions or questions
  • prezi
  • assessment criteria rubric

Fri

4/1

Students will continue work on their websites adding design elements as well as functions such as links and images

  • warm up (list two design elements you have used so far in your web site design)
  • continue work on website
  • have home page or all components for home page finished by the end of class
  • prezi

Mon

4/4

 

  • continue working on webpage

 

Tues

4/5

 

  • continue working on webpage

 

Wends

4/6

 

  • continue working on webpage

 

Thur

4/7

 

  • continue working on webpage
  • complete website (home page and two sub pages by end of class today)

 

Fri

4/8

 

  • webpage critique

 

 

DRAFT: This module has unpublished changes.