DIGITAL DESIGN

WELCOME!! This should be a fun semester...

I love working with interactive media, and created my first web sites (paid jobs!) in 1996, believe it or not. I was working with Flash before Macromedia purchased it (then called FutureSplash Animator), and all the sites were developed using straight HTML code—none of this sissy WISIWIG stuff we have now.

The purpose of this course is to introduce you to the other half of the Adobe suite of software—the pieces that create interactive communications, whether for advertising banners on the web, or a site design for a client. You should have at least a cursory knowledge of how sites are put together as any full-range media plan will include a web presence of some sort. Eventually, you may use these skills to create a web site for yourself; it's one of the best ways to get your work out there, it's very economical in the long run, and it should demonstrate your skills as both a print and multimedia designer. Consider investing in a domain and hosting plan of your own now, so i's ready when you need it.

CLASS FORMAT

We will meet and work in the cluster on the third floor of the Warehouse. It is critical that you attend every class. Missing 3 or more classes will earn an F for the semester. Classes will begin with a lecture, presentation, or hands-on exercise each week, followed by one-on-one time working on site elements. It is, therefore, important to be on time to each class so you won‚'t miss any content, and to stay until the end to make full use of the cluster resources (especially if you will be using a cluster computer) as well as my expertise and support.

You will need either movable media of some sort—either a USB flash drive, or, preferably, a movable hard drive (as they are harder to loose), or a laptop. If you will be working on your own computer, you need the Adobe Creative Suite CS4 Design Premium edition (Illustrator, Photoshop, InDesign, Flash, Dreamweaver, and Fireworks). You may use the cluster computers for this course; just remember to have your movable media with you at all times.

You must come to class prepared to work. Forgetting movable media, your laptop (or charger!), or any other necessary piece of equipment will result in an absence in attendance.

General Rules

No cell phones or headphones are to be used during class time—not even during work time as I frequently think of something I want to share with the entire class and I don‚'t want to have to shout. If I see you texting, you will be asked to leave and considered absent.

No Internet use for instant messaging or email is allowed during class time, ever. If you have an IM icon flashing on your monitor, you will be asked to leave and considered absent for that day.

 If you use facebook, twitter, or any other social or professional networking site during the course of class, you will be asked to leave and considered absent.

You need a notebook. One with those pocket dividers would be handy to hold handouts, layouts, etc., or a 3 ring binder and punch would also work well.

There is no text for this course. There are a lot of good third party books, however. A bibliography is provided online that should help. And, the web is a great place to find tutorials on how to do specific things, especially if they are not covered in class (although I suggest you do not use youtube, as the quality of instruction in those is questionable). There is a list of web sites to check out online as well. Be resourceful!

CONTACT

My office hours are Monday morning and by appointment. Please sign up ahead of time; there should be a signup sheet on my office door, otherwise, email!

I am frequently online to touch base with students. My screen name is tonitoland. Please IM me if you are having problems! Just let me know who you are since most screen names are always unique and often obscure. I will never IM you first, as I respect your privacy, unless i's urgent.

If you need to email me for any reason (and please, feel free to contact me this way ANYTIME!) make sure the subject of your email is "ADD 345" so it doesn't get tossed into my junk folder for some reason. Address all email to toni@tatoland.com. Or, feel free to phone: 315 445 0649.

ATTENDANCE

It is critical that you attend all classes. Do not make vacation plans or appointments during class time. Absences are excused only for extreme medical or other special circumstances (requiring documentation from your doctor and/or the Office of Student Services). Failure to provide or make arrangements for the documentation will result in an unexcused absence. If you arrive late, don't participate, are not prepared, or leave early, you will be counted as absent. Three or more absences will result in you earning an F for this course. In regards to professional symposiums, conferences or other educational events, excused absences are at my discretion‚consult with me prior to making arrangements.

Academic Integrity:

The academic community requires ethical behavior from all of its participants.

For designers, this means that the work you claim as yours must be conceived and developed by you alone.

You are not always expected to come up with new ideas; your thinking may build on the ideas of others. You are expected, therefore, to credit contributions from other sources and to clearly indicate the scope of your own contributions to the design solution. Failure to do so will result in serious consequences, including failing the project, failing the class, or being dismissed from the program.

Academic Integrity is not simply about plagiarism as it relates to written papers. Using objects, materials, and concepts created by another without attribution will also result in consequences.

Using Internet resources can be especially dangerous as it can blur the distinction between one's own work and plagiarism. If a web site is referenced in a project, it must be a verified site, and appropriately cited.

Damaging, manipulating, moving, or deleting another student's work is also an academic integrity violation. Please be very careful in this respect.

When working collaboratively, be honest and clear in your presentation as to which role you played in the final solution.

If you have any questions about a project see me; I can often help you to use the work in a legal, ethical, and appropriate way.

Details regarding the Syracuse University academic integrity policy, and examples of how it may be violated, can be found in the Syracuse University Student Handbooks or online at: http://students.syr.edu/handbook/

Incomplete Policy:

University policy states: The grade of Incomplete is reserved for exceptional circumstances that prevent a student from completing coursework by the time that grades must be submitted.

Academic Accommodations for Students with Disabilities:

Students who are in need of disability-related academic accommodations must register with the Office of Disability Services (ODS), 804 University Avenue, Room 309, 315-443-4498. Students with authorized disability-related accommodations should provide a current Accommodation Authorization Letter from ODS to me and review those accommodations with me no later than September 15th. Accommodations, such as deadline extensions, or extra time for quizzes, are not provided retroactively; therefore, plan for accommodations as early as possible.

ASSIGNMENT

The objective for this semester is for you to develop a functional web site about a topic that interests you.

Your site must have:

You may NOT create a portfolio-based site for yourself.

Your site may NOT be created totally in Flash. I's extremely important to understand that although possible, and even sexy, to build a site that's entirely done with Flash, the purpose of this course is to engage your creativity in a way that utilizes all the tools we'll play with this semester. Save the grand idea for next semester/year if/when you have an opportunity to create a portfolio site for yourself.

If your site is not uploaded and fully functioning by exam week (December 15, 2009, to be precise) you will fail this course. No exceptions. Back up your work frequently. If you have not backed your work up, and your computer crashes, you are out of luck. While I will sympathize with you, I will not grant any extensions. Forewarned is forearmed. This is simply professional practice.

GRADING

I will be looking for several things in your site design and development, including:

PROCESS

There are several tasks you will need to complete throughout the semester. At the same time, you will need to be working on your site. In many cases, the tasks you need to do can be actual pieces you will use in your site. Others will be exercises that will teach you skills and processes that you might decide to use in your site, or save for reference for another site design.

Following are the basic steps you need to complete to develop your site. There are no hard deadlines for these, however, I have indicated where you should be in the process during the course of the semester, so that there will be no excuse for not completing the major project (your site design, uploaded and functional) on time.

OPTIONAL (at my discretion)

Quizzes at random, based on course lectures, demos and exercises.

week 1 | September 1

Pick a topic about which you are passionate. It won‚'t be much fun to work on something you don‚'t enjoy. It can be about a hobby or pastime, or something for your aunt's yarn shop or art gallery, something about a social organization (fraternity, club, team), or an historical look at your home town. Just make sure that there is enough content to fill 10 pages, and that you love the topic.

Start working on thumbnail/roughs for your basic page design; remember that web sites are generally horizontal, not vertical.

WEEK 2 | september 8

Create a grid in Illustrator or InDesign; this will serve as the foundation for the final site, which will be created using Dreamweaver. The pieces you should include are:

A logo or banner: some sort of graphic element(s) that are consistent on each page and define the look and feel of the site.

Content area: make sure this is a large enough area to include any/all text and images.

Navigation: you may end up with a major and secondary navigation system, depending on the site organization. Take this into account as you begin to plan the grid.

Sidebar (optional): sidebars are often used to highlight special events, for links to other resources, or perhaps even advertising content.

Footer: copyright information (including citations for any borrowed content), contact info, privacy statement, and legal info as necessary.

Week 3 | September 15

On new layers Illustrator or InDesign, create a layout for each page in the site. Use this to work out design decisions such as where the navigation will go, what it will look like, the banner or header graphics, content area (text and images), sidebar position and look, and footer information.

You can use placeholder text and image frames without content, but determining position and size is critical at this point.

Print your site layout pages and bring them to class each week.

Create a site plan on paper (see example). Print it and keep it with your other class materials. Bring it to class each week.

Create a checklist of the elements you are going to need; print it and keep it with your other class materials. Bring it to class each week.

WEEK 4 | September 22

Create your root folder and organize it (on an iPod, flash drive, external drive, or laptop). Burning CD‚'s for this project will not work, nor will trying to work off the VisCom server.

NOTE: Back up your work every time you finish for the day. Keep all your files within a single folder; do not transfer files from an external drive to a hard drive, either at home or in the cluster ‚— work from the external drive only. Transferring files will absolutely mess you up.

Begin creating or finding/collecting all the images you are going to need. Use Photoshop to create/manipulate PSD images for use in your AI or INDD layout (150 ppi resolution). Later, you will optimize them as JPG, GIF, or PNG files for your actual site.

Create or find/collect all the text you will need; if you "borrow" the text, you must cite your source(s)! (Keep notes!)

Purchase a domain and set up a hosting plan, or set up your mysite.syr.edu account. Make sure i's functional, sooner, rather than later.

WEEK 5 | September 29

Based on your site design, develop the banner/logo and other non-interactive graphics that will create the overall look of the site. (Photoshop, Illustrator or Fireworks—Fireworks has more options). Save it as a PNG file, and place it into your site layout file (AI or INDD).

Design and develop the primary navigation system (Fireworks is best). Save it as a PNG file, and place it into your site layout file (AI or INDD).

Change your mind about your topic, or design now or never. This is your last opportunity.

WEEK 6 | October 6

Create a storyboard for the Flash animation; include at least 12 image frames for content, and add text to each that explains the animation. Include text to describe any narration, dialog, sfx, and/or music that will be included.

Place all images into your site layout file (AI or INDD). Label each image with its file name (i.e. sunflower.psd)

Place all text into your site layout file (AI or INDD).

NOTE: These AI/INDD files are planning pieces; the final site contents will be created in Photoshop, Fireworks, and Flash, and then assembled in Dreamweaver.

WEEK 7 | OCTOBER 13

Optimize your images (Photoshop or Fireworks). Save as PNGs, or JPGs.

Optimize and export the banner/logo and graphics. Save as PNGs, JPGs, or GIFs.

Optimize and export the primary navigation system. This will require multiple files. Make sure you save the images in a separate folder.

WEEK 8 | OCTOBER 20

Define your site in Dreamweaver; test your connection and resolve any problems.

Create a template in Dreamweaver; place the graphics and navigation that will be consistent throughout, as well as content area (editable).

Develop the CSS file that will control positioning of elements and look of content. CSS dictate the color of your text, positioning of elements, and a variety of other formatting issues that can be applied to all pages in your site to create visual consistency and accurate HTML coding.

WEEK 9 | OCTOBER 27

Catch up! Make sure everything you should have done by this date is done, and working correctly!

WEEK 10 | NOVEMBER 3

Start working on Flash animation.

WEEK 11 | NOVEMBER 10

Continue Flash animation, and catch up on missing pieces.

WEEK 12 | November 17

Create your main page in Dreamweaver (index.html).

Create the other 9 pages in Dreamweaver, using the template you made previously.

Test everything as you go along in at least 2 browsers.

WEEK 13—14 | November 24, December 1

Finish all your pages and upload the site to the server. Please be aware that this is a critical step and 2 weeks is not necessarily enough time to do it. If you wait any longer, you will be in serious trouble. Trust me.

Test the site in Safari, Firefox, and Internet Explorer.

Fix errors and upload revised files.

Week 15 | December 8

In-class presentation/crit of sites. If your site still has any functionality issues, you have one week to sort them out.

EXAM WEEK | DECEMBER 15

Email me your URL for grading purposes (toni@tatoland.com) by 5pm, Tuesday December 15. If I do not get your URL, you will fail the class. If your site is not working, you will fail. If it has any functionality or design issues, you will not earn an A.