Photoshop+Design


 * Due** Monday, November 18, 2013 before class begins. I must receive the email from google docs notifying me that you have shared your .zip file with me before 11:30am on the 18th.


 * Process:**

Design a template in Photoshop for them utilizing the 960.gs system, and then execute your design in HTML/CSS.

Create a new folder for this project in your Web Design & Management folder. If you need inspiration and direction, d ownload the Student Files for the Musician Template project. You'll see a sample site with the div structure mapped out for you. The "Nick Finck" site (found on the 960.gs website) is a great starting point. It's relatively simple and has a limited color palette.

Follow these **basic instructions:**

1. Download the 960.gs .zip file containing the Photoshop templates.

2. In Photoshop, start to layout a basic site utilizing the grid structure.

3. As you design, identify the top three reasons why someone would visit your site (to watch the latest video? to learn more about you? work examples? social media?). Make sure you’re including those on this homepage. At the same time, establish a visual hierarchy (what do you want people to look at first, second, third, etc.). You can easily do this with proportion and scale.

4. “Pre-name” your slices using the “slice select tool” (underneath the slice tool). Slice the necessary images and export them via “File > Save for Web & Devices”.

5. Program your design in HTML/CSS using your sliced images from Photoshop.


 * When you are done:**

Copy and paste the assignment rubric into your daily journal and complete a self-assessment prior to submitting your project.

Show me your work in class if you are done before the due date. I will give you feedback and a grade.

**To formally submit your work**:


 * 1) Be sure to name your home folder "Project name_your name"
 * 2) Right-click your work folder, click “compress folder name.” It will create a .zip folder for you.
 * 3) Rename the .zip folder: "Project name_ your name"
 * 4) Upload it to your Google Docs account and then share it with me: cwalkerspencer@gmail.com.


 * Assessment:**


 * __**RUBRIC**__: Expectations || Meets (5) || Partially Meets (3) || Limited (1) || Missing (0) || Comments ||
 * Layout based on 960.gs grid x5 ||  ||   ||   ||   ||   ||
 * Files and Folders named properly x1 ||  ||   ||   ||   ||   ||
 * Proper CSS and HTML syntax and formatting x2 ||  ||   ||   ||   ||   ||
 * CSS and HTML comments included to describe intent x1 ||  ||   ||   ||   ||   ||
 * Clear visual hierarchy for top three items on site x6 ||  ||   ||   ||   ||   ||
 * Sliced images exported and saved in images folder x5 ||  ||   ||   ||   ||   ||
 * ||  ||   || Total Points ||> /100 ||   ||
 * ||  ||   || Total Points ||> /100 ||   ||
 * ||  ||   || Total Points ||> /100 ||   ||
 * ||  ||   || Total Points ||> /100 ||   ||