bDES:340 sec 4

Design Fundamentals for the Web

M, W 5:10-8:30pm

Week One

Monday January 12th

  • In Class
  • Review Syllabus
  • Presentation on: Getting to know HTML and CSS
  • In class activity: Follow along to create basic html page. Download folder

  1. For Next Class
  2. 1. Read over syllabus
  3. 2. Watch: HTML Essential: 2.Basic Page Structure 26 min
  4. 3. Review tutorial sites
  5. w3school
  6. SitePoint
  7. CodeCademy HTML

Wednesday January 14th


  1. For Next Class
  2. 1. Have E1 uploaded to your searver space
  3. 2. Start making a list of website designs you like.

Week Two

Monday January 19th

  • In Class
  • No Class

  1. For next class
  2. 1.

Wednesday January 21st


  1. For next class
  2. 1. E1 Due: Turn in zipped folder of site to cybox and upload to server
  3. 2. E2 Due: Turn in zipped folder of site to cybox and upload files to E2 folder in homepage website on server.
  4. 3. look over css-positioning-101
  5. 4. Keep making list of website designs(Layouts, Web Fonts, Niffty features, ect)

Week Three

Monday January 26th


  1. For next class
  2. 1. Reading:Where am I?
  3. Look over 5 vertical menu examples

Wednesday January 28th

  • In Class
  • Laura gone at conference
  • Presentation:By Graphic Design Professor Alex Braidwood
  • In class Work time on E3

  1. For next class
  2. 1.E3 Due: upload to cybox and push to ISU server.
  3. 2. Read A List Apart: On Web Typography
  4. 3.
  5. 4.

Week Four

Monday, February 2nd


  1. For next class
  2. 1.See above

Wednesday, February 4th


  1. For next class
  2. 1. Come to office hours on friday 11am-2pm if you need help catching up on any exercises.
  3. 2.Continue visual research of websites you like.

Week Five

Monday February 9th

  • In Class
  • Turn in E4
  • Presentation:Designing for the Web
  • Activity: Analyzing existing websites
  • -- Print off the site and trace a grid structure over it. How do you think the typography, color, layout, grid studcture, architecture and content are working? What could be improved? Define who the user of the site is and what information they will want.
  1. For next class
  2. 1. Read:Website Design Analysis Of Ten World Class Brands
  3. 2. Print out of your website Analysis

Wednesday February 11th

  1. For next class
  2. 1. Look at:I Heart WireFrames
  3. 2. Print out of your Archetecture and Wire Frames
  4. 3. Pick 2 different color pallets to chose from
  5. 4. Pick two font systems of two fonts each to chose from
  6. Reminder: Office hours on friday will be 12:30pm - 3:00pm or later by appoitment.

Week Six

Monday February 16th

  • Critique of Wire frames and Archetecture
  • Start Hi-fedelity designs
  1. For next class
  2. Print out Hi-fedelity Designs
  3. Pick color pallet
  4. Pick font system

Wednesday February 18th

  • Critique of Designs
  • Refine Designs
  • Start Coding
  1. For next class
  2. Push whatever code you have to your live site

Week Seven

Monday February 23rd

  • In Class
  • Review Progress
  • Work Time
  • --Desk Critiques
  1. For next class
  2. 1.Push updated code to your live site

Wednesday February 25th

  • In Class
  • Work Time

Week Eight

Monday March 2nd

  • In Class
  • Final Critique
  • Work Time

Wednesday March 4th

  • NO Class
  • Public lecture by our ‘designer-in-residence’, Osamu Okamura