|
|
 |
|
|
|
|
 |
||||||
|
Topics:
Exercise #1: <I AM IN HTML> Hard-code a web page using HTML that provides a brief introduction to who you are, including a biographical description of yourself, your careers goals/major, your interest in the course, and/or any other information that you'd like to provide. At minimum, your HTML page should include:
Remember to play around with the formatting and select a background color, font face, and font and link colors for your page. Save the file using the the first 6 characters of your first name plus "e1", and then use the extension ".htm" (i.e. karle1.htm). Put your file in the Exercise 1 folder on the shared drive. |
Resources HTML Color on the Web Software and Resources Adobe Publishing Friends of Ed New Riders |
|||||
|
||||||
|
Topics:
Exercise #2: Hyper Poem Use Dreamweaver to creatively format your poem and add hyper-links. Try to make the formatting of the web page thematically consistent with the poem. You may wish to manipulate the background properties (such as background color and margins); use line breaks and/or paragraph breaks; play with the font face, color, size, and formatting; use special characters when appropriate; and explore differing alignment options. Explore creating a "hyper" poem using absolute (to external sources) or relative links (to other pages you create or with named anchors for within-the-page links). You must have at least one link on the page. Save your file with your first name, plus "e2" and the extension ".htm" (i.e. karle2.htm). Put your file in the Exercise 2 folder on the shared drive. |
Homework Bring to class a poem or quote of between 5 and 25 lines. Read MTIV: Introduction, Type Resources Internet History Web Design Tips, Inspiration |
|||||
|
||||||
|
Topics:
Exercise #3: Digital Painting Exploring the topics listed above and demonstrated in class, use Photoshop to create a digital painting. Your painting can be abstract or representational. Use the type tool to add your name to the bottom right corner of the painting. The dimensions of your digital creation should be set to 775 x 425 at 72 ppi. Save the project as a JPEG (.jpg) file and name it with your first name + e3 + .jpg (ie "karle3.jpg"). Put your file in the Exercise 3 folder on the shared drive.
|
Homework Read MTIV: Web Layout, Web Languages Web Critique #1 (Due 2/28) Resources Communication Arts Network Digital Thread Creative Pro Publish Magazine Alt Pick Creative Sourcebook |
|||||
|
||||||
|
Topics:
Exercise #4: Image Collage Create a collage containing six versions of one image. Scan/import a photograph into Photoshop. Touch up, crop, and correct the tonal range of the photo as necessary. Copy the photo into (at least) six different layers. Adjust and manipulate the photo to create six different versions of the same image (the original image plus five alternative versions). You may wish to "adjust" the levels, curves, color balance, brightness/contrast, and/or hue/saturation of the image. You may apply filter or layer blending effects as well. Finally, resize or "transform the scale" of each image so that all six will fit onto a canvas no larger than 780 x 440 at 72 ppi. Finally, save the file for the Web ("Save for Web") as a JPEG (.jpg) file, name it with your first name + e4 + .jpg (ie "karle4.jpg"), and put it in the Exercise 4 folder on the shared drive. Note: Making it into a JPEG will compress the file and flatten the layers. You may wish to save your original "source" file as a Photoshop (.psd) document as well if you ever plan to return to and edit the project. |
Homework Bring a Photograph to Scan Web Critique #1 (Due 2/28) Resources National Association of Photoshop Professionals Adobe Photoshop Experts Center Kodak: Taking Great Pictures Digital Photography Review |
|||||
|
||||||
|
Topics:
Project #1: iPoint Advisors Create a website for the fictional company, iPoint Advisors, using the content supplied in class (or download the content here). The website should have the following sections/pages: profile, services, staff bios, client list, and contact (you are free to change the names/labels for these pages if you wish). You will have the opportunity to ask the "client" (me) questions about the project to guide your creative development and understand the communication goals and objectives for the site. This client survey may be useful to that end. You are required to create the following imagery in Photoshop: a simple text-based logo for the company that will serve as the site identifier and image-based rollover buttons for the navigational menu linking to each page. You may also wish to create imagery for page/section titles (page identifiers). It is recommended that you use the lab time today to create your imagery, so that all of your "assets" will be assembled by next week and you can use next week to design and layout your pages using HTML tables. Create a folder with the following naming convention: your first name + "p1". My folder would be called "karlp1" for example. Save all of your work (including your imagery) in this folder. Post your work folder to the "Project 1" folder on the shared drive.
|
Homework Read MTIV: Color, Process, Listen Resources Digital Web Magazine (digital-web.com) Web Monkey Web Page Design for Designers Web Developers Reference Web Usability (Jakob Nielsen) |
|||||
|
||||||
|
Topics:
Project #1: iPoint Advisors (due 4/4) See above for project description.
|
Homework Read MTIV: Grids, Unite, Theme Resources Kaliber 10000 Surfstation Some Cutting-Edge Design Firms: Second Story Studios The Chopping Block, Inc. Fullerene Productions Juxt Interactive |
|||||
|
||||||
|
Unfortunately, I'm sick. Class is canceled for tonight. The iPoint Advisors project will be due on 4/4. Project #1: iPoint Advisors (due 4/4) See above for project description.
|
Homework Read MTIV: Concept, Eat the Audience, Filter, Justify Resources
|
|||||
|
||||||
|
Topics:
Project #1: iPoint Advisors (due 4/4) See above for project description. Exercise #5: Advertising Banner (Due 4/4) Create an advertising banner. Create an ad banner for a fictional movie, company, or product of your choice. Your ad banner should be 728 x 90 pixels in dimension, one of the standard sizes of current "banner" ads. Starting with pictures that you collect off of the Web (or eslewhere), open Photoshop and use a "mask" to isolate your image element(s), and remove it from its background. Put this image on a new/custom background color or image inside your banner, and add any appropriate text. Use the techniques/explore the topics above and demonstrated in class to develop the imagery for your banner and lay them out in Photoshop. Finally, save your banner as an optimized GIF or JPEG (ie "karle5.jpg"). Open Dreamweaver, and insert your banner image into a Web page. Center the image. Put your name on the page, underneath the banner ad. Save the document according to the number your were assigned in class. For example, if you were assigned number "7", save the document as "banner7.htm" (keep the name all lowercase without any spaces). Create a link so that your banner image links to the next student in class. Student "7" should have their banner ad link to "banner8.htm" for example. Ultimately, each student's banner ad should link to the next student's banner, so that we can click through the ads in an unbroken sequence. Put both your HTML (.htm) and image (.gif or .jpg) files into the Exercise 5 folder on the shared drive. |
Homework Read MTIV: Concept, Eat the Audience, Filter, Justify Final Project Preproposal (due on 4/4) Web Critique #2 (due on 4/18) Tips for Improved Web Critiques Resources Some Cutting-Edge Design Firms: Hi-Res! Hillman Curtis, Inc. Firstborn World Domination Design Group One9nine The Speared Peanut Method
|
|||||
|
||||||
|
Topics:
Project #2: Snug Wear Website (due 5/2) In groups of 2 or 3, design a Web site using Dreamweaver, Photoshop, and/or ImageReady for the fictional clothing company Snug Wear. Click here for specific Project #2 requirements. |
Homework Read MTIV: Usability Final Project Preproposal Web Critique #2 (due on 4/18) Tips for Improved Web Critiques Final Project Proposal (due 5/2) Resources Some Cutting-Edge Design Firms: Future Farmers 247 Media Digitaria The La Jolla Group |
|||||
|
||||||
| Spring Break - 4/11/06 | ||||||
|
||||||
|
Topics:
Project #2: Snug Wear Website (due 5/2) In groups of 2 or 3, design a Web site using Dreamweaver, Photoshop, and/or ImageReady for the fictional clothing company Snug Wear. Click here for specific Project #2 requirements. |
Homework Web Critique #2 (due on 4/18) Tips for Improved Web Critiques Final Project Proposal (due 5/2) Resources Some Creative Sites: Born Magazine The Remedi Project RHIZOME |
|||||
|
||||||
|
Topics:
Project #2: Snug Wear Website (due 5/2) In groups of 2 or 3, design a Web site using Dreamweaver, Photoshop, and/or ImageReady for the fictional clothing company Snug Wear. Click here for specific Project #2 requirements. Project #3: Flash Splash (due 5/16) Create a splash page using Flash. Using Flash, create an animated splash page. Your animation must include at least one motion tween that effects one or more of the following properties: position, scale, rotation, alpha (transparency), tint (color), and brightness. You may also use step animation, if appropriate. The content of the splash page is up to you and may include any text and/or imagery you feel is appropriate. If you wish, you can try to create a splash page for use in your Final Project. Save your work (i.e. "karlp3.fla") to the Project 3 folder on the shared drive. |
Homework Final Project Proposal (due 5/2) Resources Flash Kit Macromedia Flash Support Center Flash Foward Conferences
|
|||||
|
||||||
|
Topics:
Project #3: Flash Splash (due 5/16) Create a splash page using Flash. Using Flash, create an animated splash page. Your animation must include at least one motion tween that effects one or more of the following properties: position, scale, rotation, alpha (transparency), tint (color), and brightness. You may also use step animation, if appropriate. The content of the splash page is up to you and may include any text and/or imagery you feel is appropriate. If you wish, you can try to create a splash page for use in your Final Project. Save your work (i.e. "karlp3.fla") to the Project 3 folder on the shared drive. |
Homework Final Project Proposal (due 5/2) Resources Kirupa Actionscript.org |
|||||
|
||||||
|
Topics:
Project #3: Flash Splash (due 5/16) Create a splash page using Flash. Using Flash, create an animated splash page. Your animation must include at least one motion tween that effects one or more of the following properties: position, scale, rotation, alpha (transparency), tint (color), and brightness. You may also use step animation, if appropriate. The content of the splash page is up to you and may include any text and/or imagery you feel is appropriate. If you wish, you can try to create a splash page for use in your Final Project. Save your work (i.e. "karlp3.fla") to the Project 3 folder on the shared drive. |
Homework Read MTIV: Inspiration Resources Macromedia Director Support Center Director Developer |
|||||
|
||||||
|
Topics:
|
Homework Work on your final project Resources Update Stage Director Web Director Online User Group |
|||||
|
||||||
|
Homework Web Host for Final Project. Work on Your Final Project Resources Website Resources: |
|||||
|
||||||
Extra Lab Time - Saturday, 5/27/06 I'll be in the lab to help students from at least 9:30 a.m. - 12:30 p.m. on Saturday, 5/27. |
|
|||||
|
||||||
|
Topics:
|
Your Final Project must be complete and you must have a URL available for me (and the class) by 5:30! For the final exam, you may wish to review the following: Multimedia Design Principles and Tips The MTIV book; specifically the sections on Theme, Concept, Eat the Audience, Web Layout, Usability, and Type. |
|||||
