Syllabus

Course Syllabus*

Graphic Design 67
Web Design 3

*The content of this course may change depending on time constraints. The order of the topics listed may vary.

Design Technology Website Design

Current sites
Entertainment Technology  (http://academy.smc.edu)
Graphic Design  (http://academy.smc.edu/grdes/)
Interior Architectural Design (http://www.academy.smc.edu/intarc/)

Project site

http://www.smcgrdes.com/

Discovery (Weeks 1-3)

Week 1

Topics: Web Design: What is Interaction Design?, Review: Domain Name Registration, Web hosting, CMS: WordPress, Gathering Information
Deliverable: Client Survey

Assigned Reading:
Chapter 2:  “Core Process Overview”
Chapter 3: “Phase 1: Define the Project” (pg 40-59)
Stylin’ with CSS – Chapter 2: “How CSS Works”

Week 2

Topics: Understanding the Audience, FTP, CSS Review, CSS Selector Types, CSS3, Website Critiques

Deliverable: User Profiles (Personas)

Discuss Reading:
Chapter 3: “Phase 1: Define the Project” (pg 40-59)
Stylin’ with CSS – Chapter 2: “How CSS Works”

Week 3

Topics: Analyzing the Industry, Understanding Discovery, Image Slicing & Optimization, HTML/HTML5, Web Critiques

Deliverable: Competitive Analysis

Discuss Reading:
Chapter 3: “Phase 1: Define the Project”(pg 59-61)
Chapter 10: “Analyzing your Competition”

Clarification & Planning (Week 4)

Week 4

Topics: Determining Overall Goals, Preparing a Communication Brief, Creating a Project Plan, Setting the Budget, Creating Schedules, Assigning the Project Team, Setting Up Staging Areas, Planning for User Testing, Kicking Off the Project

Deliverable: Communication Brief
Deliverable: Budget
Deliverable: Schedule

Discuss Reading:
Chapter 3: “Phase 1: Define the Project”(pg 61-85)

Content Plan (Week 5)

Week 5

Topics: Auditing Existing Content, Outline New Content, Create Delivery Plan, The Grid, 2 & 3 Column Layouts, Web Critiques

Deliverable: Content Audit

Discuss Reading:
Chapter 4: “Phase 2: Develop Site Structure” (pg 86-95)
Stylin’ with CSS – Chapter 5: “Basic Page Layout”

Structure Site (Week 6)

Week 6

Topics: Create site map, Set naming conventions, 2 & 3 Column Layouts

Deliverable: Site map

Discuss Reading:
Chapter 4: “Phase 2: Develop Site Structure” (pg 96-105)
Stylin’ with CSS – Chapter 5: “Basic Page Layout”

Structure Pages (Week 7)

Week 7

Topics: Create wireframes, Address navigation, Naming & Labeling, Midterm Project Assignment

Deliverable: Wireframes

Discuss Reading:
Chapter 4: “Phase 2: Develop Site Structure” (pg 106-116)
Stylin’ with CSS – Chapter 6: “Designing Interface Components”

Create (Weeks 8-10)

Week 8

Topics: Review Site Goals, Develop Concepts, Design for the User, Navigation and Interface design, CSS-based navigation menus, Typography for the Web

Discuss Reading:
Chapter 5: “Phase 3: Design Visual Interface” (pg 120-140)

Week 9

Topics: Design for the User, Web Standards, W3C Discussion, Accessibility issues, What is Social Media?

Deliverable: Design Comps (2-3 directions)

Week 10

Topics: Midterm Presentations: Thursday, November 3, 2011

Deliverables:

  1. Sitemap for entire site
  2. Design Comps (2 directions) 
  3. Home page (HTML/CSS)
  4. First-level page for one of the sections. Commonly referred to as the “landing page.” (HTML/CSS)
  5. Posting your thoughts and decision-making process for this project on your WP blog.

Build (Weeks 11-16)

Week 11

Topics:  How WordPress Works, Installation, The Dashboard, Embedded Media, Creating and Modifying Themes, Plugins

Week 12

Topics:  What are the differences between mobile websites and mobile Apps?, What are current best practices for mobile design?

Deliverable: Mobile Website Design Comps

Week 13

NO CLASS – Thanksgiving: Thursday, November 24, 2011

Week 14

Topics: Create WordPress protosite,  jQuery, Video formats for web, In-class lab time

Discuss Reading:
Chapter 6: “Phase 4: Build and Integrate” (pg 140-176)

Week 15

Topics: In-class lab time

Week 16

Topics: Final Presentations: Thursday, December 15, 2011

Deliverable: 10-12 page WordPress site
Deliverable: Mobile Web/App Design Prototype
Deliverable: All supporting deliverables from Weeks 1-8
Deliverable: Screencast presentation of project