CourseIntro
Course Description
An introduction to the principles of visual and graphic design as they
relate to electronic media with an emphasis on web page construction
and design, creating electronic documents, and production and
dissemination of electronic information. Students will be introduced to
various graphics programs, web authoring tools and other technologies
used to produce electronic documents and images. Assignments will
allow hands-on experience and experimentation.
Prereq: none
Course Objectives
Upon completion of this class students will:
1.
Understand the process of web design
2.
Understand the principles of design in electronic media
3.
Demonstrate the skills needed to create web graphics
4.
Demonstrate the ability to construct web sites with effective and
aesthetically pleasing designs
5.
Understand the limitations of electronic publishing as they relate to the
World Wide Web
Instructor
Rebecca Hall
Email: rjhall@uwm.edu
Ph: 414.229.2855
Skype: rebeccahall
Office Hours: By Appointment
This is me 
What I do 
Course Requirements
HIGHLY RECOMMENDED TEXT
Jennifer Niederst Robbins. (2012). Learning Web Design: A Beginner’s Guide to
HTML,CSS, JavaScript and Web Graphics. O’Reilly Media, Incorporated.
4th Edition
RECOMMENDED
Jason Beaird & James George. (2014). The Principles of Beautiful Web Design
SitePoint Pty. Ltd.
Patrick J. Lynch & Sarah Horton. (2009) Web Style Guide 3rd Edition
Available: http://webstyleguide.com/wsg3/index.html
OPTIONAL
Robin Williams, John Tollett. (2006). Robin Williams Design Workshop
PeachPit Press. 2nd Edition
ARTICLES & ADDITIONAL READINGS AS ASSIGNED
ADDITIONAL BOOKS AND RESOURCES - listed on the course website
Course Requirements
PROJECTS & ASSIGNMENTS
Attendance & Participation (5%)
5 Exercises (15pts each – 15%)
5 Assignments (25pts each – 25%)
Mid-Term Exam (75pts – 15%))
Graduate Research Project (50pts – 10%)
Final Web Site Development Project (40% | 30%)
Part 1: Project Profile
Part 2: Information Architecture
Part 3: Interface Design
Part 4: Final Site Production
Part 5: User Testing
See course syllabus for details and deadlines
*Graduate Students: Expectations will vary slightly on assignments and additional
requirements will be distributed and discussed in class.
Content Delivery
D2L – UWM’S COURSE MANAGEMENT SYSTEM
http://d2l.uwm.edu/
Weekly course content will consist of lectures, demonstrations and
hands-on activities. The weekly course schedule will run from Sunday Saturday. Course content will be loaded to the course website each
week by no later than noon (12:00pm CST) each Sunday.
Course Website: https://pantherfile.uwm.edu/rjhall/685/online
File Storage
PantherFile
https://pantherfile.uwm.edu/
Google Drive, Dropbox, SugarSync, others…
Software Access
In this course, students will use the following software programs: Adobe Illustrator, Adobe
Photoshop, Adobe Dreamweaver and Adobe Acrobat. All SOIS labs and most campus labs
have this software available. Students can also access this software using the SOIS
Virtual Lab.
SOIS Virtual Lab
The SOIS Virtual Lab allows off-site students remote access to a SOIS computer from any
location.
Written/video documentation for access to and instructions on using the virtual lab environment
http://www4.uwm.edu/sois/resources/it/virtuallab/
http://www4.uwm.edu/sois/resources/it/virtuallab/howto.cfm
To access to the virtual lab, please use the following
ePanther ID: [ex: “rjhall”]
ePanther Password: ePanther password
Purchase (student Discount) | Free Trial Software
A free trial of this software is available from Adobe Systems:
http://www.adobe.com/downloads/
Students may choose to use these trail versions for this course; however no technical support will be provided for the
installation/maintenance of this software on your system. It is the student responsibility to read and follow all system requirements and
guidelines for its use.
Value of Digital Communication Skills
DIGITAL AGE
Digital Communication is a foundation skill
In most careers, individuals will be required to:

use technology to communicate effectively

think critically to design a communication that meets the needs of a
specific audience

Select the best media for their message (web, video, audio, print, or
multimedia)

have the technical expertise to design, implement and deliver their
message

http://www.adobe.com/education/presentation/digital_communication/
Aho, K (2005) Digital communications for All Students Macromedia White Paper available:
http://www.adobe.com/education/resources/hed/whitepapers/
enGauge 21st Century Skills: Literacy in the Digital Age
http://www.ncrel.org/engauge/skills/skills.htm
Course Description
Basic Design Principles
Computer Graphics for digital communication
Graphics Programs (Illustrator | Photoshop)
Interface Design Concepts
Web Development Process
Web Team: Client | Project Manager | Content Manager | Information Architect | Interface Designer | Graphic Designer |
HTML Developer | Programmer | Other
Website design
HTML & CSS | (Dreamweaver)
Electronic Publishing & Digital Communication (Adobe Acrobat)
Course Description
Final Course Project
Web Development Process
Web Team:
Client | Project Manager | Content Manager | Information
Architect | Interface Designer | Graphic Designer | HTML
Developer | Programmer | Other
Web Development Process
Site Construction is
one of the last steps
The Site Development Process
http://webstyleguide.com