Thursday, March 26, 2009

pimpin' & primpin'

hey guys,

hope you picked up on the some tips for prepping yourself for the real world. 

attached is the lecture deck. remember that there are some good links to resources within.

email or call with questions.

available for meeting over the weekend.

let me know if you want to know your grade.

thx
ss

Thursday, March 19, 2009

Concepting

We're on the home stretch....For the next several classes, we're going to be using much of the class time as a lab for designing both your concepts and style guide. We will also be having one more pop quiz so BE READY! . If you presented mood boards that expressed a spectrum such as a museum or art gallery, then you should do one concept for each mood board. If you presented mood boards with one that articulated or expressed the current brand and one that targeted the new brand, then you should base both your concepts on the future brand. Play with "volume." In the case museums, maybe one concept is more about the visitor and another is more about the museum and it's work. You get the idea. Ask lots of questions over the next couple of weeks.


Lecture Deck PDF

Below are the assignments for this week, required reading and templates. Go get em!

Final Assignment #1:

Integrate and utilize all the materials (tools) you’ve developed over the course and develop 2 alternative homepage concepts that are on strategy, architecture and brand.

Final Assignement #2:

Pick one of your final home page designs and develop a simple 2 page style guide detailing typefaces, colors, links and other vital information for a smooth handoff.

Save both the your home page concepts as JPGS and style guide as PDF. These files should be uploaded to the class server/folder.

FOR CRITIQUE:

1. Web Pages - save as jpgs into your folder for projection
2. Wire Frame - Also save as jpg in your folder for projection
3. Style Guide - Save as PDF into your folder for projection



Adobe InDesign template provided.

Required Reading:

Read Visual Design and Testing

There will be another quiz in your future on this reading......

Another top 5 Sites:

www.k10k.com
www.lessrain.de
www.iht.com
www.metadesign.com
www.ourcommon.com

Some good reference materials:

Photoshop CS 4 QuickStart Guide
Adobe Classroom in a Book

Sunday, March 8, 2009

"Lover of the Internet"-Required Reading

Here's a great article for you guys to read.

"Love of the Internet"

Thursday, February 19, 2009

Flash Class

Good job last night. Here's some other cool examples of Flash to look at as well as the attached presentation from class.


The home work is in the lecture deck. This is due on the 5th. As always, I'm available for questions and help.


Attached presentation.

Site examples:


1996: GaboCorp


1998: NRG


2001: 2Advanced


2003: RoadRunner


2004: Bill Harvey


2006: NikeAir


2006:IKEA


OLA- Banners:


BannerBlog


HP- Big Prints


GTI Road Block


Flash Guys


Grant Skinner


Eric Natzke

Alternative Class lecture deck

Some Resources:

Adobe Flash CS3 Professional Hands-On Training

Adobe Flash CS3 Professional Hands-On Training is the latest, updated version of the highly acclaimed publication from the leaders in training at lynda.com. In this book, readers will find carefully developed lessons and exercises that teach readers to create interactive Web sites and rich media, with the latest version of the Flash authoring tool. Given the extensive changes to the Flash interface and function, the step-by-step approach is much needed to help present things to a beginner in a very clear, easy-to-follow way. In it, they’ll learn how to use the full set of creative drawing, animation, and interactive tools including drawing and color tools, animation basics, symbols and instances, motion, bitmaps, buttons, movie clips, sound, components and forms, and video. Not only that but readers will learn how to use the new powerful integration features with Photoshop and Illustrator and discover new Shape Primitives (expanding your ability to use and manipulate shapes), a new Pen tool that functions like that found in Illustrator, a new ability to convert animations to ActionScript 3, a brand new unified interface matching that of others in the Creative Suite, and much more. Accompanied by a CD-ROM loaded with classroom-proven exercises and QuickTime training videos, this book ensures ensures readers will master the key features of Adobe Flash CS3 in no time.

Flash CS3 Professional for Windows and Macintosh
With Adobe's acquisition of Macromedia, millions of Photoshop users may be installing Flash for the first time and Flash CS3 Professional for Windows and Macintosh: Visual QuickStart Guide is there to show them what to do. From basic first steps, such as exploring the drawing tools, including Flash CS3's new Pen tool, to frame-by-frame animation, motion tweening, and shape tweening, this book serves as the beginner's guide to Flash. But it doesn’t stop there: sections on interactivity, sound, and video have been fully updated to demonstrate best practices in ActionScript 3.0, as well as the latest in Flash's video technology.

Thursday, February 5, 2009

Mood Boards/branding

You made it to week 5 and everyone's doing a great job!

In week 5, we continue along the web design process and discover how brand and mood boards all play an important role in establishing the right brand voice and tone for your newly proposed site redesigns. Feel free to develop one mood board for the current site and one for the one you're redesigning OR one board for one audience and one for another OR one to represent one end of the brand spectrum and one for the other end - many ways to do this so have fun with it.

These should be designed and printed out to 20" x 30" using the template (not much of a template...just an Illustrator Doc that's 20 x 30). Don't forget to mount them on foam core. These also take hours to print so get going sooner than later...

Questions?


----------------------------

Assignment:

Use stock photography/illustration, objects, colors, icons, type and/or anything else it takes to get your mood across and develop 2-mood boards (see different combinations of mood boards above) using pictures, brand attributes, color blocks, icons, etc. You can also use www.tonystone.com or www.gettyimages.com for other photo choices.

Guidelines:

- 20 x 30 format in illustrator

- don’t forget to mount them on foam core board (you'll need two sheets of 20 x 30 and a can of spray mount adhesive)

- you may also tile multiple pages and past them together to a 20 x 30 print (make sure it looks good)

- ask lab assistant for directions and advice on printing to large format printer before time gets too tight.


-----------------------------

Class Lecture Deck

Example Mood Board

-----------------------------

Some Resources:

Marks of Excellence:

Finding the roots of trademarks in heraldry, potter's marks, monograms, and other such ancient devices, this book traces the history of the corporate visual lexicon and produces a taxonomy of the commercial age. An alphabetical section covers motifs from animals to waves, with short definitions and analyses beautifully complemented by daringly cropped and crisply photographed images. Pictures of this quality and interest would steal the show in most volumes, but the text stands up well to the challenge of images that gain force because of the familiarity of their subjects (corporate trademarks), and the unusual sense that the book's context lends to them. Marks of Excellence is a worthwhile exploration at the modern language of ownership.--This text refers to an out of print or unavailable edition of this title.

Designing Brand Identity:
From an interactive website to a business card, a brand must be recognizable, differentiated and help build customer loyalty. This indispensable resource presents brand identity fundamentals and a comprehensive dynamic process that help brands succeed. From researching the competition to translating the vision of the CEO to designing and implementing an integrated brand identity program, the meticulous development process is presented through a highly visible step by step approach in five phases: research and analysis, brand and identity strategy, brand identity design, brand identity applications and managing brand assets.

Friday, January 30, 2009

Week 2-Site Mapping

Welcome to the Site Mapping.

This week is all about Information Architecture, Site Mapping, Wireframing and Page Schematics. As we migrate from "Discovery" to "Design", we are learning essential practices, tools and deliverables that are invaluable while also ensuring you have a solid structure and flow to your site prior to applying graphics or "pixel-pushing."


COUPLE OF ANNOUNCEMENTS:

1. Make sure you read all your required reading. There might be a quiz next week....

2. When you're downloading MindManager to your account/computer in the lab, you're going to need one of the teach guys to type in a password so you can install it. I've spoken with them and they're fine with doing it.

Assignment 3:

Create a site map of the current taxonomy for the site you're about to redesign AND a home page paper wireframe/schematic of what you think your revised (home page) structure will end up looking like prior to comping.
Remember...just think structure & flow, not design.

Take advantage of Mindjet's MindManager 7 30 day trial download. It's fairly new for the Mac platform and pretty intuitive. Don't forget to take the tutorial as well as check out the map gallery. **Also, for our presentation next week, if you're using MindManager, don't forget to save as PDF for projection presentation.

**LASTLY, DON'T PRESENT SOMETHING THAT IS UNREADABLE, SLOPPY OR TOO SMALL. THIS IS A PORTFOLIO PIECE FOR MOST OF YOU SO PUT THE TIME IN.

Use powerpoint, InDesign or Illustrator for the home page schematic (no template provided)

Class Lecture Slides
Wk 2 Required Reading - Site Mapping

----------

Some Resources:

Information Architecture: Blueprints for the Web - If you want to learn how to structure and organise websites, then this is the book for you. From data chunking and card sorting to scenarios and task analysis, this book contains everything you ever wanted to know about information architecture for the web, and then some.

The Art and Science of Web Design: When it comes to Web design, style guides are often too boring and predictable to capture the attention of caffeine-riddled Web developers. But not The Art & Science of Web Design; this book strategically equips readers to design sites effectively.

Tuesday, January 13, 2009

Week 1-Competitive Analysis & Creative Strategy

Welcome to the Class. Following are the assignments, handouts, required reading and templates for the first week. Please contact me with any questions.

Here is a PDF of the syllabus as well.

Class Lecture Notes
Required Reading - One Process fits all
Required Reading-Analyzing the Competition

Assignment 1:

Get your feet wet...pick an industry from the list below and do an analysis of 6 competitive sites within that industry. Once you pick one, you will be playing designer/client and picking one of the six to redesign within our process:

Zoo/Aquarium
Automaker
Museum/Art gallery
Amusement Park/Recreation
Airline
Charity/Fund Raising

“Analysis Criteria”
What’s the mood of the site?
Site aesthetics (visuals)/on brand with messaging?
Any cool features/fuctionality/other?

A real Example
Analysis Illustrator template provided


Always save your assignments in both the native file format (the program you created it in) as well as a PDF or JPG and upload to class folder. Refer to syllabus for details on presenting formats and dates. Also, keep all your screen shots together for your competitive analysis or Illustrator won't be able to find them and open properly.

Assignment #2

Author a creative brief for your newly proposed site. A creative brief is a summary of the overall visual and conceptual goals for the site, identifying the target audience, proposed visual and brand styles as well as any executional considerations.

Weekly reading and Creative strategy template provided
A real Example

Save in both assignments in both native format and as a PDF and upload to class folder with your last name on the folder. Also, give your files a name that makes sense such as "stevenson_cs.pdf" (for creative strategy) and "stevenson_CompAnaly.pdf" for your competitive analysis...

---------------