objectives

• Complete 3 portfolio-ready (and ideally competition-ready) web sites showing variety in approach and execution
• Establish a strong web presence and understand how to market your work using Social Media
• Learn the standard process of web site design and development from concept to execution
• Acquire essential Adobe Creative Suite software and XHTML / CSS coding skills used in the industry
• Become comfortable navigating available Design+Technology resources for further inquiry
• Expand the definition of Design+Technology beyond applicable Web Design within the larger context of interdisciplinary fields

semester topics

• Brief History of the Internet and Web Design
• Information Architecture, Hierarchy and flowcharts
• Interface Design, Grids and Wireframes
• Photoshop for the Web and Interface Design
• Image File formatting and compression for the web
• Better Web Typography and Dynamic Fonts
• File management and file backup methods
• Current trends in Web Design and Technology
• HTML/CSS development
• Standard browser differences and QA testing
• JavaScript/jQuery for dynamic web sites
• Troubleshooting techniques
• Web Hosting / Domain Names
• The brave new world of Mobile Web Design
• Networking and Social Media
• Experience Design beyond Web

description

This course prepares students for the role of a professional web designer.

It focuses on both essential Design and Technical skills necessary to complete a successful web site. Students are expected to muster the foundations of Interface Design, Usability principles, Web Typography and Information Architecture, as well as become technically proficient with writing clean and functional XHTML, CSS and jQuery code. Through hands-on projects, exercises and lectures students will learn how to follow the typical web design process from the initial research, to design/development, to implementation and troubleshooting.

Additionally, this course examines the place of technology and design within the context of contemporary cultural, social and media landscape. For this purpose the course will host a guest speaker from a non-web design filed, and will embark on a filed trip to the local advertising agency AKQA.

green teaching

This is a Certified Green Course. This means, for example, that I will not hand out any printed materials, but I will use Blackboard extensively to post handouts, collect assignments, and provide you with feedback on assignments.

To help make our class as green as possible, I encourage you to buy used books, minimize paper use by submitting assignments electronically as instructed, and read course readings online rather than printing copies. If you choose to print, please print double-sided, and recycle the paper after the end of the semester.

e-mail policy

I eagerly invite you to write me at sakellio@american.edu Allow at least 24 hours for response, though I will often get back to you within 1-3 hours.

Please note that I will not respond to technical question sent vie e-mail the day before a project is due!

Make good use of my office hours and address all issues early on.

office hours

Open office hours: Tuesdays and Fridays from 1:00pm to 2:00pm in room 204 or office 220
By appointment: Wednesdays

supplies

• Personal domain name and web hosting service package (I will suggest providers in class, plan on spending ± $90)
• Reliable Flash drive (minimum 2GB). Please do not bring in external drives unless you have tested them in our labs before. They tend to have permission and other issues.
• File Backup space (design server, BB, external disks - the more the merrier)
• Sketchbook 8.5 x 11 designated for our class (do not bring lined paper as your sketchbook)
• CD-RW and/or CD-R. Make sure you always have at least two blank disks when coming to class.
• Black (disposable or not) technical pen and/or Mechanical Pencil (0.5)
• Glue stick (to place your printouts in sketchbook)
• Access to necessary programs and internet outside of class (Adobe suite)

readings

• Don’t Make Me Think: A Common Sense Approach to Web Usability, Krug, Steve. 2005. **also available in PDF
• Stylin’ with CSS: A Designer’s Guide (2nd Edition), Wyke-Smith, Charles. 2007. **also available in PDF
• Additional required readings will be assigned during the semester. Those readings will be posted to Blackboard or distributed in class.

resources

• Blackboard Resources, Readings and Tutorials section. Check back often, as the resources are constantly updated
• Lynda.com tutorials (log into my AU first) https://my.american.edu/content.cfm?load=/apps/lynda/index.cfm
• w3chools.com http://www.w3schools.com/

grading

Applied Projects are weighted heavily, and must show all the intermediate steps of the design/development process. Completion of all required projects is mandatory to pass the course. The instructor will lower the final project grade one full letter value for any intermediate deadline missed (comps, research, etc). Always come to class with projects looking better than they looked last time. A project is never finished and can always be improved.

Any project not seen in progress will receive an “F”, even if the final is delivered on time.

• Applied Projects (3 total): 60%*
• Technical and Design Exercises: 10%
• Quizzes: 15%
• Web Topics Presentation: 5%
• Participation, attendance, personal progress: 10%

There will be 0% tolerance towards “lost files.” Set up a reliable workflow for backing up your work.
BACKUP YOUR WORK!

attendance

Attendance is required during the scheduled class periods. Punctual arrival, effective use of the full class period, and participation in assigned work is required. For this course, only one absences for the session is acceptable.

Any additional absence, if justified, must be documented promptly. Unjustified or undocumented absences will lower the final grade for the course at a rate of 5 points in a scale of 100, or equivalently, one letter grade degrees per absence (I.e. from A to A- and so on).

The allotted absence is to accommodate routine illness, weddings, car trouble, etc. Doctor appointments, advisor conferences, trips to supply stores and labs, employment, etc. should not be scheduled to conflict with class, but if unavoidable must be documented PROMTLY. Students should obtain verification of prolonged illness from a physician, and should do so as soon as possible, rather than waiting till the end of the semester. Such cases may require a grade deferment or withdrawal if the student cannot complete the work in a comprehensive and timely manner. Excessive tardiness, early departures, excessive break time, and lack of participation in assigned class activities will count as equivalent to an absence (2=1 absence). Tardiness that exceeds 1/2 hour will be counted as one absence.

deadlines

This course is structured so that all work can be completed during a normal academic session. The instructor will not issue an incomplete grade without a serious, documented excuse.

No late projects are accepted without a valid and documented excuse. A student must submit his/her work as by the due date, and the grade will be issued accordingly.

Re-submissions will be collected twice during the semester. Project 1 must be resubmitted no later then Nov. 1st, and Project 2 must be resubmitted no later then Dec. 1st. No re-submissions will be accepted pass the due dates.

classroom policy

No cell phones are allowed in class. You may turn off the phone or set it to vibrate but there will be no answering the phone while we are in class. There shall be no stepping into the hall to answer your phone.

Do not surf internet for personal purposes during the class. I occasionally ask you to put your machine to sleep during lectures or demos. The monitor MUST be off during that time.

No Food. Food consumption is only allowed during the class breaks, and not in the classroom.

re-submissions

Students are allowed to re-submit two of their applied projects for a better grade. They are collected twice during the semester (midterm and final dates). To be considered the work must show significant improvement. Simple act of re-submission will not earn you a better grade, but better work will.

grade explanation

• A 100–96
  This grade indicates work which is clearly superior. It does not mean “satisfactory” or “adequate.” Such work must reflect an excellent understanding (and communication) of the material and, if a paper (project), must be presented in a clear and logical fashion (concept and design principles) and in nearly flawless written English (craft and technique).
• B 88–84
  This grade implies work that is more than merely satisfactory. Such work will reflect an above average understanding (and communication) of the material and, if a paper (project), will contain only minor errors in grammar, syntax, usage, and spelling (craft and technique).
• C 74–70
  This grade indicates work which is competent, adequate, and satisfactory in presentation. Such work reflects effective understanding of the majority of the material covered and, if a paper (project), will not contain excessive errors in grammar, syntax, usage, and spelling (craft and technique).
• D 64–60
  This grade is awarded to work which is unsatisfactory, not competent, or inadequate in terms of presentation or in terms of fulfilling the assignment. Papers (projects) which contain many serious errors in grammar, syntax, usage, or spelling (craft and technique) will normally be awarded this grade.
• F below 60
  This grade is assigned for failure to complete an assignment in both a timely and competent manner.

integrity

Standards of academic conduct are set forth in the University’s Academic Integrity Code. By registering, you have acknowledged your awareness of the Academic Integrity Code, and you are obliged to become familiar with your rights and responsibilities as defined by the Code. Violations of the Academic Integrity Code will not be treated lightly, and disciplinary actions will be taken should such violations occur. Please see me if your have any questions about the academic violations described in the Code in general or as they relate to particular requirements for this course.

• Come to every class, be here on time, and stay for the whole class.
• Do the reading and homework assignments; take notes on key concepts, steps or ideas.
• Use the class time well; get work done in class so if you have any problems or questions, I’ll be there to help!
• Follow along and take notes during lectures, explanations, demonstrations, reading and exercises. If information is repeated, chances are it is especially important!
• Ask questions if and whenever you don’t understand something or if you would like me to go over something again.
• Save any computer files with frequency and in at least two locations... just in case.
• Quizzes and tests may focus on one specific area, but they may have cumulative questions. Pay attention and take good notes during quiz reviews. Then STUDY!
• Take pride in your work and spend the necessary time on your work to do it well and do it right.
• When completing projects/exercises and assignments, look carefully at the required items and the specifications that are outlined for the assignment. Before submitting, use the list of requirements or specifications as a checklist and make sure you have addressed/completed all parts required. Complete each project fully and to the specifications.
• Always cite images, text and ideas you use from another source.
• Some assignments have portions that are up to your own tastes/interests. Try to make the projects fun and enjoyable for yourself!
• Many portions of this class allow you to be creative and experiment. Give yourself the time to do that for each project.
• Remember that the computer labs and the classrooms can fill up and there are lots of other people that use them. Do your work ahead of time so you aren’t pressed to find a free space at the last minute. Be respectful of the classrooms, labs, your classmates, and the equipment that is here for everyone to use. Clean up after yourself.
• Critiques are important; make suggestions for other students, listen to what is being said about others’ projects to see if it applies to your project (possibly take notes), and ALWAYS take notes when your own project is being critiqued.
• Take pride in your work and spend the necessary time on your work to do it well and do it right.
• If you have any questions, problems or concerns, let me know! Let’s meet during office hours, or you can e-mail me. (office hour schedule to come)