INFOST 375

Page 2 of 6

UNIVERSITY OF WISCONSIN-MILWAUKEE

School of Information Studies

INFOST 375– Multimedia Web Design

DRAFT SYLLABUS Spring 2017 – Section 201

Instructor: Adam Hudson Location: Northwest Quad, Building B Rm 3414

E-mail: Phone: 414-229-3822

Office Hours: Local students may email for an appointment, otherwise email is the best way to contact me.

Meeting Times & Location: online, no scheduled meetings

CATALOG DESCRIPTION:

Course covers the fundamentals of Adobe Animate and ActionScript that will allow students to create web animations and more interactive website content. 3 credits.

GENERAL DESCRIPTION:

·  Use Adobe Animate to create animations for use on the web. Examples include creating banner-ads, slideshows, menus, and character animations.

·  Use ActionScript together with Animate to control animations and the interactivity that users can experience with the animations.

·  Learn how to control the timeline and the basic principles of animation in order to create more fluid designs.

·  Learn how to publish Animate files and display them on different devices and operating systems.

·  Learn how to work with new interactive and JavaScript-based HTML5 including canvas and drag & drop.

PREREQUISITES:

INFO ST 240 Web Design I, familiarity with Adobe Creative Suite preferred (Photoshop, Dreamweaver) but not required.

Software Requirement:

Throughout the course we will be exploring graphic design, web development, and animation through the use of a variety of industry standard software programs (mainly Animate). For this course,you will need to have access to the following software programs:Adobe Animate, Photoshop, and Adobe Dreamweaver. All of these programs are included in the Adobe CC Web Premium Package. The package is available for you via the SOIS Virtual Lab: http://www4.uwm.edu/sois/resources/it/virtuallab/. Students can also try a free trial version from Adobe or get a subscription via the following link: http://www.adobe.com/creativecloud.html.

OBJECTIVES:

Upon completion of the course, students will be able to:

1.  Effectively use Adobe Animate and the other accompanying Adobe design programs like Dreamweaver & Photoshop.

2.  Create animations, navigation menus, banner advertisements, canvas drawings, slideshows, and other interactive content for use on the web.

3.  Understand and critically evaluate important principles in design and the design process like font type and face, use of color, and layout.

4.  Utilize Animate content (including the scripting language ActionScript) and different publishing options to create content across multiple devices.

5.  Have a basic understanding of some of the new dynamic features of HTML5 like canvas and drag&drop.

6.  Evaluate the differences drawing in Animate vs. HTML canvas.

METHOD OF DELIVERY: Online

Lecture notes, and video demonstrations.

On-line Course Expectations:

Addressing Emails: Many of you are preparing for careers as a professional, and the tone and formatting of your emails should reflect that. When emailing me make sure to include a subject relevant to the email in the subject line and address me by name (hey or no salutation at all is unprofessional). Also sign the email with your name so that I don’t have to look you up in the class roster by your email id.

• Online learning assumes a high level of maturity, time management, and the ability to self-learn. Learning is more convenient but no less rigorous. The lack of formal schedule in an online course can be liberating. It can also be demanding because the student must determine when to make time for class. A bit of self-discipline is helpful for taking an online course.

• Please remember that you will spend as much or more time completing this course as you would taking it in a traditional, classroom-bound, format. Due dates are as "real" as they are in a traditional format.

• The following resources will help you if you have technical problems: SOIS Distance Education: http://www4.uwm.edu/sois/online/, UITS Help Desk: https://www4.uwm.edu/technology/help/campus/index.cfm

Students with special test and note-taking needs should contact the instructor as early as possible for accommodations. See policies below.

TECH RESOURCES:

UWM Help Desk: http://www4.uwm.edu/technology/help/campus/gettechhelp.cfm

SOIS Tech: http://www4.uwm.edu/sois/resources/it/, , (414-229-5275), NWQB 3432. The SOIS Tech office is open from 8am until 9pm during Monday thru Thursday, Fridays from 8am until 5pm, and Sundays 11am until 3pm.

SOIS Virtual Lab: http://www4.uwm.edu/sois/resources/it/virtuallab/

The link includes information, tutorials, and login information for using the Virtual Lab.

Lynda.com access: http://www4.uwm.edu/sois/resources/it/lynda/

Resources for SOIS students on IT related topics, includes many useful tutorials.

REQUIRED TEXT:
Learn Adobe Animate CC for Interactive Media (Paperback)
Adobe Press (ISBN: 978-0-13-439781-8)

COURSE SCHEDULE (subject to change):

Week: / Topics:
1
Jan 23 – 28 /

Introduction to the course: policies, etc. Introduction to the Adobe Animate program: interface (tools, file types, intro to working with layers).

2
Jan 29 – Feb 4 / Working with colors, fills, gradients, vector shapes, etc. Importing graphics/files from external programs like Photoshop and Illustrator. Editing external graphics
3
Feb 5 – 11 /

Start animation: introduction to both motion and shape tweening, and important principles for both. Tweening vs. frame-by-frame animation

4
Feb 12 – 18 / Working with text (font properties, colors, creating motion, and text effects). Creating first animation scene.
5
Feb 19 – 25 / Creating more complex animations (begin working on character animation, character creation and concept). Using the pen tool for tracing and creating shapes and characters.
6
Feb 26 – Mar 4 / Working with Animate files (publishing, publishing formats, and embedding in HTML documents).
7
March 5 – 11 / Using Animate for web marketing (banner-ads in particular).
8
March 12 – 18 / Creating a complex graphic using an effect known as parallax.
March 19 - 26 / Spring Break Week, no class
9
March 26 – April 1 / Introduction to ActionScript. Creation of a picture slideshow and application of ActionScript. Using layer masks for picture cropping and gotoAndStop() and gotoAndPlay() methods
10
April 2 - 8 / Actionscript for object manipulation; allowing for user control over an object’s properties using the mouse
11
April 9 - 15 / Actionscript for object manipulation; allowing for user control over an object’s properties, adding keyboard control.
12
April 16 - 22 / Introduction to HTML5 canvas tag; drawing and interactivity done with JavaScript, HTML, and CSS
13
April 23 - 29 / Continue with canvas and HTML5 drag&drop functionality
14
April 30 – May 6 / Canvas practical example; using canvas to draw a graph directly to a webpage. Making web-based presentations using the reveal.js framework
15
May 7 - 11 / Prep and take final exam

ASSIGNMENTS:

Assignments are due on the specified date (midnight CST on the day it is due) *unless specifically noted by the instructor. Post the link to the assignment in the drop box on D2L. Grades will be reduced 2 points for each day that it is past due. Assignments submitted more than 5 days past the due date will not receive any credit. Assignments are worth 10 points each, so if an assignment is 1 day late 8/10, 2 days late 6/10, etc. Submissions that include an incorrect link (such as a link to the local file path rather than the url for the file hosted on your webspace account or the submission of an actual HTML file rather than the url) will receive a 1 point deduction.

Assignments compromise the largest part of your grade by far at 80% so it is important to get your work in on time. Rules of academic conduct require that you not use the work of others without clearly indicating it as such. Academic misconduct may result in a lowered grade, no credit for a given assignment, or removal from the course.

If you are going to miss a deadline due to illness, emergency, etc. please let the instructor know in advance. Reasonable accommodations can be made for students who inform the instructor in advance of complications meeting a particular deadline.

ASSIGNMENT DESCRIPTIONS:

This list is of the major assignments, more may be assigned throughout the course of the semester.

Description: / Due:

Book chapters

/ Beginning of the course (chapters 2-5, 7)

Postcard Animation

/ Week 3

Photo Editing

/ Week 3

Bouncing Ball Animation

/ Week 4

Pen tool assignment

/ Week 5
Character Animation / Week 6
Banner Advertisements / Week 7
3d effect assignment / Week 8
Photo Gallery / Week 9
movieclip properties/mouse events / Week 10
movieclip properties/keyboard events / Week 11
HTML5 canvas exercises / Week 12
Lynda.com Drag&Drop Course / Week 13
Canvas Chart Example / Week 14
Reveal.js presentation / Week 15

Final:

The final will be taken during the last week of the course. The test will be taken online through D2L, and be scored immediately upon your completion of it. The test consists of 35 multiple choice questions and 20 True/False questions. All of the questions originate from either the book chapters or the lecture notes provided for the course. The test will be taken during week 15 of the course ending on May 11th.

EVALUATION:

Criteria / Amount
Assignments / 80%
Final Test / 20%
Total / 100%

GRADING SCALE:

93-100 / A / 73-78.99 / C
90-92.99 / A- / 70-72.99 / C-
89-89.99 / B+ / 69-69.99 / D+
83-88.99 / B / 63-68.99 / D
80-82.99 / B- / 60-62.99 / D-
79-79.99 / C+ / Below 60 / F

UWM AND SOIS ACADEMIC POLICIES:

The following link will take you to UWM pages/links which contain university policies affecting all UWM students.

http://www.uwm.edu/Dept/SecU/SyllabusLinks.pdf

Undergraduates may also find the Panther Planner and Undergraduate Student Handbook useful (http://www4.uwm.edu/dos/student-handbook.cfm).

For graduate students, there are additional guidelines from the Graduate School (http://www.graduateschool.uwm.edu/students/current/), including those found in the Graduate Student and Faculty Handbook: http://www.graduateschool.uwm.edu/students/policies/expanded/.

The following link will take you to pages/links which contain SOIS policies affecting all SOIS students.

http://www4.uwm.edu/sois/resources/formpol/policies.cfm