Skip to Navigation | Skip to Content

MAT 235 - Web Design 3: Site design and Architecture

Menu

Class Syllabus

 

Course Description

This course emphasizes user experience (UX) and user interface (UI) design and production. Students learn to plan, design, and develop complex, real-world, professional-level websites in a team environment using modern web standards, best practices, and workflows. Topics include site planning and research, content strategy, information architecture development, user personas and user scenarios, usability analysis and testing, programming and production techniques, and emerging industry trends.

Student Learning Outcomes

The MiraCosta faculty believe that students who complete one or more certificates or degrees are systematic, critical, creative thinkers and clear communicators who are intellectually curious, technically proficient, professional, and aesthetically literate. To that end, the faculty has identified seven Student Learning Outcomes (SLO's) that apply directly to the high-level skills you are expected to possess in the workforce: Technical Skills, Application of Discipline Skills, Critical Thinking and Problem Solving, Communication, Professional Behavior, Aesthetic Literacy and Appreciation, and Global Awareness and Responsible Citizenship.

To achieve this goal, you are expected to achieve competency in the following course-level Student Learning Outcomes, each of which help you achieve one or more of the above outcomes:

  1. Plan, design, and produce effective information architectures and graphical user interfaces for web enabled applications within a team environment.
  2. Create web page designs for complex, professional-level websites utilizing web editing and graphic software tools and techniques.
  3. Examine, analyze, and evaluate websites for design, usability, and functionality.

Course Objectives

Students learn how to develop professional-level websites using modern Web standards and best practices. They explore site architecture, interface design, content strategy, and advanced production techniques and workflows. The course will provide hands-on experience with the tools and techniques used by designers to create effective interfaces and sophisticated web and multimedia products. Students will learn to:

  1. Define the complete process of designing and producing an interactive web project.
  2. Develop user experience strategies and apply appropriate site information architectures.
  3. Design effective user interfaces.
  4. Identify and apply appropriate web standards and best practices.
  5. Define and apply project programming techniques.
  6. Utilize software tools for efficient workflow.
  7. Evaluate web designs for usability and effectiveness.
  8. Demonstrate ability to work within a structured team environment as a productive and complementary team member.
  9. Plan, design, and produce a comprehensive website project.

Design skills, design process, personal expression, content development, project management and trends in visual communication as they relate to interactive media will be emphasized along with the learning of tools and techniques.

Class Materials and Reading

Class Materials

  • USB Flash Memory Drive/Key
  • A sketchbook or notebook

Recommended Reading

  • Assigned web pages and articles


Optional Reading

  • A Project Guide to UX Design: For User Experience Designers in the Field or in the Making by Ross Unger and Carolyn Chandler (New Riders)
  • Interactive Design: An Introduction to the Theory and Application of User-Centered Design by Andy Pratt and Jason Nunes (Rockport)
  • UI is Communication by Everett N. McKay (Morgan Kaufman)
  • Transcending CSS: The Fine Art of Web Design by Andy Clarke (New Riders)
  • CSS Mastery: Advanced Web Standards Solutions by Andy Budd (Friends of Ed)
  • Information Architecture for the World Wide Web by Louis Rosenfeld and Peter Morville (O’Reilly)
  • MTIV: Process, Inspiration and Practice for the New Media Designer by Hillman Curtis (New Riders)
  • Web ReDesign 2.0: Workflow that Works by Kelly Goto and Emily Cotler (Peachpit Press)
  • jQuery - Pocket Reference by David Flanagan (O'Reilly)
  • Dreamweaver CC: The Missing Manual (O’Reilly)

The instructor can suggest other books and reference material.

Grading and Evaluation

Your final grade is based on your performance on class exercises, investigations, and homework as documented in your website sketchbook; the quality of your work on two major website projects; an instructional presentation; and class participation.

Total Possible Points = 100

  • Website Sketchbook Exercises/Investigations/Homework: 30 points (30%)
  • Charity/Service Organization Team Project and Process: 35 points (35%)
  • Design Spring Project/Prototype and Process: 25 points (25%)
  • Instructional Presentation (with Team or Partner): 5 points (5%)
  • Class Participation and Attendance: 5 points (5%)

Exercises/Investigations

Exercises, investigations, process work, or other homework will be assigned to support course lectures/demonstrations and project development. Each student will maintain a website sketchbook or blog where they can post and document their work (including work in process) during the course of the semester. This class will be largely paperless and writing, exercises, and other investigations related to the course will be done within or linked to from your own "sketch blog." Moreover, your work will be "open source" and will be linked from the class website, available for both the benefit and critique/comments of your classmates.

Projects

You are required to complete two major website projects in this class including:

  • Charity/Service Organization Website (Team Project)
  • Student Choice Project (Team or Individual)
    (with proposal and instructor approval)

Project details are available on the projects page.

The design process for your projects will contribute to your course grade. You will produce creative briefs and information architecture documentation for each website project that will layout the specific details of the project (objectives, look and feel, content, architecture, flow-chart, etc.). These proposals will serve as your design plans and will help guide your projects' development. You will also complete project research, client surveys, thumbnails, wireframes, graphic investigations, and design comps as part of the design process.

Project grades are based on the quality of your work in the following areas: content/concept, form, function, and technique. For information on the specific grading considerations related to each of these areas, see Making The Grade.

Instructional Presentation/Activity

In recognition of the unique knowledge and skills that each student brings to the class, you are encouraged to help your fellow students and contribute to the collective intelligence of the class. You will be asked to prepare and lead a 20-minute instructional presentation, demonstration, or activity for the class. To accompany (and complement) your oral presentation, you will be required to create an online article, tutorial, or learning object that details your chosen topic and provides links to additional information and resources. The instructor can provide ideas for appropriate topics or you can choose your own topic (with instructor approval). If you choose, you may partner with another student for this presentation/activity.

See Instructional Actvitity Ideas

Administrative

Lab Hours
Computer lab hours are available to students in the Library and Information Hub. The library is generally open:
Mon – Thurs, from 8 a.m. – 9:30 p.m.
Friday from 8:00 a.m. – 3:00 p.m.
Saturday from 10:00 a.m. – 5:00 p.m.

Class Participation
Participation in class will be considered as part of your course grade. Students are expected to attend and be on time to every class. If you decide to withdraw from the course, you must file the appropriate paperwork or risk receiving an “F” in the class.

Due Dates
All work is expected to be completed by the due dates. Late work may be lowered by one letter grade for each week that it is late.

Prerequisites/Advisories
MAT 125 and MAT 165 and considerable computer and desktop experience are recommended.

MAT Tutoring and College Support Services
The Tutoring and Academic Support Center (TASC) and Writing Center (WC) assist students by providing free tutoring and drop-in appointments, both on campus and online. Additional student support services are also available including health services and personal counseling, academic and career counseling, and veterans’ services. See miracosta.edu/studentservices/ for links and phone numbers to the wide variety of student services available to you.

Disability Accommodations
Students with a disability may be entitled to appropriate accommodations and are encouraged to notify the instructor and contact the Disabled Students Programs & Services (DSPS) office as soon as possible. The DSPS office is located in Building 3000, adjacent to Parking lot 3C, and can be reached at 760‐795‐6658.

LGBTQIA+ Resources
MiraCosta College has an expressed commitment to equity and inclusion for students, faculty, and staff who are lesbian, gay, bisexual, transgender, queer, questioning, intersex, and asexual. For information about LGBTQIA+ campus resources and services, visit: miracosta.edu/lgbt.

Administrative Dates
2/2 is the “Add” and “Drop” deadline (without a “W” recorded). 2/21 is the “Pass/No Pass” option deadline. 4/24 is the “Withdraw” deadline (with a “W”).

Conduct
All students are expected to follow the administrative rules and standards of conduct detailed in the University catalog. In particular, plagiarism may result in a failing grade and other consequences. Students are expected to produce original work. A student may not use or copy by any means another's work (or portions of it) and represent it as his/her own. Quotations, photographs, or other artwork used by a student should be given appropriate credit or reference.