The aim of Graphic Design for Web is to apply principles of typography, layout, color theory and symbol design to create and develop user-oriented interactive content for the internet. The course is designed to learn HTML5 and CSS3 languages in order to better understand front-end (designer) and differentiate from back-end (programmer) design terminology and processes. While learning code will be a necessary portion of this course, our main focus will be the designing of content for the internet including web pages, social media, and app design and development. Additionally students will learn how the internet functions, types and styles of websites, key landmarks in the development and history of the internet, and how the internet can be used as a tool for social change.
This course meets from 1:00 - 3:30 on Mondays and Wednesdays in AAB room 204
This course is designed as a studio course in which students will complete a number of challenging assignments while learning the basic principles and standards within the graphic web design industry. At the completion of this course, students will:
THE SANDWICH
H1-H6 P, IMG, STRONG, EM, UL OL, LI, IMG, A, GOOGLE FONTS
Characters
Directory
Recipe due next class
LABOR DAY-No Class
Recipe Due 01_name_recipe(directory title)
Build new page in class
Linking multiple pages and mailto
Multi-page site due next class
W3C
Review Multi-page sites
Introduction to CSS
Selectors and properties
3 Grid layouts Due next class
css notes
Responsive Web Design
Responsive images
Design one responsive page for next class
RWD PAGE DUE UPLOADED TO SERVER
Discuss responsive type
Corrections due next class
No Class Day
Review Project 1
Introduce project 2: GIF ANIM
Demonstration: GIF Anims
Animation demo
CODE EXERCISE DUE
Review animations
Mograf with Text exercise
Sketches and concept next class
Review sketches and concept
GIF ANIMATION DUE IN A WEBPAGE, UPLOADED TO SERVER
Critique Gifs
Introduce Project 3
Brief and sketches due next class
CODE EXERCISE DUE
Review concepts and sketches for project 3
Begin animating
Review progress on GIFs
CODE EXERCISE DUE
Demo on how to upload to Giphy.com
Introduce Project 4:Illustrated home page
Brief and thumbnails due next class
Review Concepts and Thumbnails
Begin Illustrating
CODE EXERCISE DUE
Progress Critique for home Page
Review Progress, work in class
home Page in a page DUE end of class
Brief with concept sketches
Begin developing user flow charts
APP PROCESS NOTES 1
APP PROCESS NOTES 2
LinkedIn Tuorial
App Inspo
ZOOM
Critique App Design
Introduce final project
THANKSGIVING BREAK
THANKSGIVING BREAK
Finish critique
Work in class, develop website
FINAL 12:30 - 2:30
All files must be properly labeled: Project Number_YOUR LAST NAME
example: 01_Dunlap.pdf
In Web design, files maintenance and proper labeling are the difference between the project working and not working. Projects not properly labeled will be automatically failed.
No Projects are accepted after deadline. You have remote access from any computer anywhere to the dropbox through:
Consider each project as a creative or conceptual puzzle to be solved. Graphic design is arrangement, organization and communication, which often require experimentation and revision to find the best choice for the particular idea. Being a creative person is an active process, so revising projects and making many iterations and exploring all of the possibilities around an idea are encouraged and ideal.
These projects are all exercises in creativity, focus on creative problem solving and technical understanding of the tools.
Projects begin with thumbnail drawings in a sketchbook (or ipad, other) to develop concepts, and then these concept drawings are presented to small groups to brain storm ideas in order to optimize the concept and image.
There is no text for this class, notes and reading material will be uploaded to this site and students will be informed when assignments are on the site. You will be required to back-up your projects with an external harddrive or USB stick. Additionally, you will need a sketchbook no smaller that 5 x 7 and no larger than 11 x 14 and a pencil or pen each class to work out ideas.Ipads with pencil or graphics tablets are also acceptable. We will use your free www.lynda.com/linkedin-learning subscription for at home tutorials, the link can be found on your student homepage on the Bloomu site
Lab Hours
Attendance is mandatory and crucial to be successful. Please make sure to look over the academic calendar to schedule any appointments or travel arrangements during breaks or outside of class meeting times. Even though this course meets online, students enrolled in studio courses are expected to attend all class sessions, as interaction and class participation are important aspects of the total learning process and should be valued as such. Students are responsible for all material presented in class and should contact the instructor for any information they may have missed. Additionally, there will be no makeup critiques, lectures, demos, or exams for unexcused absences.
If circumstances occur that cause excessive absences, the student will need to meet with the professor outside of class to discuss the situation. It will be the responsibility of the student to withdraw from class if it becomes necessary. Failure to do so could result in a poor academic standing and financial obligations.
Attendance will be taken at the beginning of each class. If you are absent, it is your responsibility to find out what you have missed and what you need to prepare for the next class. In addition to contacting the faculty member, you should also contact one of your classmates to find out about any assignments not indicated on the course outline.
PUNCTUALITY:
ATTENDANCE:
Due to the circumstances surrounding Covid 19 if you are not feeling well, or suspect you have been in contact with someone who has Covid 19 you are required to work from home. Contact the professor for the class and attend class via Zoom if possible. Prompt communication to develop a plan will not incur grade reduction. It is up to you to keep track of your absences.
For each project you will be sent a Google form that details the individual requirements for that project and you will answer either "yes" or "no" questions regarding the tasks and knowledge you are expected to learn and be able to implement at each interval. For each question you earn a "1" for "yes" and "0" for "No" answers. Accurate self-assessment is a key factor in working successfully, so be honest with your answers. I will be there to help with answering those questions if needed, and will potentially ask you for justification for your assessment if I see a discrepancy. Your assessment involves four criteria: Technical, Formal, Professional/Craftsmanship, and Critical Thinking. These criteria are explained further:
(1) Technical proficiency - use of software applications
(2) Formal - Use of accepted practices and a visible understanding of concepts and principles
(3) Craftsmanship, presentation, deadlines and participation in critique
(4) Concept, critical thinking and revision
You can earn 5 points per criteria for each project, for a total pf 20 possible points per project. You will know when the project is assigned exactly what is expected of you for that project. Each overall rating is given a grade equivalent based on the standard 90%, 80%, 70%, 60% grading percentages.
Art majors at the sophomore, junior, and senior level are required to participate in the departmental annual review. Specific details including portfolio requirements and review dates will be provided during the semester. Non-participation will lower your final grade by 1/3.
jdunlap@commonwealthu.edu
Office: A&A 260
LINK TO ZOOM OFFICE HOURS
Office Hours:
Mon & Wed 12:00 -1:00 and 6:15 - 7:15
Thurs 3:30 - 4:30
or by appointment
My Work