City College of San Francisco
Course Outline of Record
Course Status: Active
I. GENERAL DESCRIPTION
A. Approval Date March 2016
B. Effective Semester Spring 2017
C. Department Business
D. Course Number COMP 9935
E. Course Title Business Web Graphics
F. Course Outline Originator Julian Skolnick
G. Department Chairperson Ophelia Clark
H. Dean Wendy Miller
II. COURSE SPECIFICS
A. Hours
45 total
B. Prerequisite None
    Corequisite None
    Pre/Corequisite None
    Advisory ESLN 3600 and COMP 9245; and knowledge of Windows OS basics or COMP 9905
    Advisory Pre/Corequisite None
C. Course Justification Required for Business Web Pages Intermediate Noncredit Certificate
D. Field Trips No
E. Method of Grading Letter or Pass/No Pass or Satisfactory Progress
F. Repeatability As needed
III. CATALOG DESCRIPTION
Create business web graphics and business web media using Adobe web graphics and web authoring tools. Create, edit, manage, and optimize vector and bitmap images for web pages. Topics include creation of a custom webpage layout, creation of web page banners, web page backgrounds, and adding digital media to a web page. Creation of a web page layer comp with navigational elements.
IV. STUDENT LEARNING OUTCOMES
Upon completion of this course, a student will be able to:
  1. Utilize Adobe web graphics tools such as Photoshop, InDesign, and Animate to develop a web graphic or web multimedia presentation for advertising, product information, or e-business.
  2. Create a graphic web page layout and web page comp with text, images, and navigation elements, using Adobe web graphics development software.
  3. Create a specialized business graphic or presentation for a web page such as an advertising banner or a business logo .
  4. Integrate content from Adobe web graphics, rich media, or animation software and place the result in a web page.
V. CONTENTS
  1. Types of web graphic tools available
    1. Photoshop
    2. InDesign
    3. Animate
  2. Document set up for web projects
    1. Document type
    2. Document size
    3. Canvas
    4. Text tools
    5. Graphic tools
    6. Animation tools
  3. Web page layout creation
    1. Layers addition
    2. Images addition
    3. Size and place images
    4. Text addition
    5. Format text
    6. Text and graphics arrrangements
  4. Graphic elements creation for insertion in web pages
    1. Web graphics
    2. Web multimedia
    3. Graphic web page layout
    4. Web presentations
    5. Text, graphics, animations, photographs, and special effects
    6. Graphics for the web optimization
    7. Text with graphics alignment
    8. Utilize Photoshop, InDesign, and  Animate to prepare graphics for the Web using optimal file formats, bit depth, resolution, and size
  5. Web page prototype development
    1. Navigation elements: buttons
    2. Adding interactivity to a web page 
    3. Aanimated text and graphics
    4. Multimedia file integration: video, audio into a web page
    5. Simple animation or animated banner production
    6. Web graphics insertion and optimization
  6. Development of specialized graphic objects for a web page
    1. Create a custom business logo
    2. Create a banner graphic for a web page
    3. Create a web photo portfolio or slide show
    4. Create an interactive web animation
  7. Web graphics or multimedia software output integration into a web page
    1. Photoshop output integration
    2. Animate output integration
    3. Indesign output integration
VI. INSTRUCTIONAL METHODOLOGY
  1. Assignments
    1. In-class assignment: In-class participation in instructor-led demonstrations of Adobe Web Graphics software skills covered in classroom presentations and lectures, such as set up a web projects, add and text, links, and images, create a page layout, and add media objects.
    2. In-class assignment: Participation in discussion on topics such as: creation of web graphics and web multimedia, creation of a web page layout, addition of graphics and multimedia to a web page, preparation for independent web graphics project.
    3. Out-of-class assignment: Readings from the textbook, reference materials, and selected web sites
    4. Out-of-class assignment: Independent web graphics project: Creation of a web graphic presentation, logo or banner animation, or website layer comp incorporating course content.
  2. Evaluation
    1. Performance: Independent web graphics project which assesses the student's ability to develop web graphics or a web page using the guidelines, concepts, and skills presented in class such as: Create a web page comp with formatted page header banner, footer, main content, and sidebar content areas, navigation buttons, and text, images, and media objects. Create a product information web graphic. Create an animated logo or banner image.
    2. Exams/Quizzes/Tests: Test/Quizzes: Questions assessing the student's knowledge and comprehension of Adobe Web Standard Software concepts covering topics such as creating a site definition, adding pages, creating a layout, inserting and formatting text, links, page divisions, and media objects.
  3. Representative Textbooks and Other Instructional Materials
    1. Christopher Schmitt. 2012. Designing Web and Mobile Graphics: Fundamental concepts for web and interactive projects. New Riders.
    2. Wayne Cuevas. 2015. Web Graphics: 10 Things That You Need to Know. Amazon Digital Services LLC.
    3. Instructor-developed materials such as handouts and online support materials.
    4. Website: Adobe Learn