Week4 – 7260
Hello. Welcome to week 4. Here are the handouts:
ADV3550_CSSBoxModel
ADV3550-Week4-Assignment
You can download example files here:
ADV3550-week4-lesson
If you need help uploading your files to your website through Dreamweaver you might take a look at this step by step tutorial online:
http://www.temple.edu/cs/web/dreamweaver/site.htm#V
Steps III and steps IV, are slightly different from what I showed in class but it’s essentially the same thing, here they use the ‘menu’ instead of the the ‘files’ panel.
Week3 – 7162
Hello. Welcome to week 3 – Wednesday September 22nd.
Today’s Agenda
>> Presentations:
- Paula Scher
- Seymour Chwast
We will review the two presentation from last week on Type Classifications and Type Anatomy – Legibility vs. Readability.
>> Here are two diagrams showing the anatomy of a typeface:
AnatomyofTypface
AnatomyofTypface2
>> Typographic Exploration: review thumbnail sketches. Choose two of your most successful sketches and begin to render the in InDesign.
>>InDesign
- Working with text – text box, create outlines
- Color – stroke. fill color, color picker – Process CMYK, Spot
- Vector – creating shapes, transforming, manipulating shapes, pen tool, paths
- Rulers and Alignment
- Layers Palette
Homework
>>Typographic Exploration: Nine Circles of Hell from Dante’s Inferno
Chose two words from your sketches. Use InDesign to set each word to one of the typefaces listed below that seems appropriate for expressing some aspect of the character of each word you sketched. Remember your goal is to alter the shapes of the letterforms in the word without compromising the legibility or integrity of the word form.
Type List: Garamond, Baskerville, Goudy, Bodoni, Didot, Memphis, Clarendon, Caslon, Century Expanded, Rockwell, Universe, Gill Sans, Futura, Franklin Gothic, Helvetica.
Goal: Modify these words in away that enhances their meaning. Consider the possibilities of altering the shapes of the letterforms or varying the letters-pacing in the word without compromising the legibility or integrity of the word form. Your goal is to use specific visual variables (size, weight, shape, texture, position, orientation) that might successfully support, enhance, or otherwise reinforce the meaning of each word.
>>Review handouts of terms you need to know from week 1 and week2.
Week3 – 7260
Hello. Welcome to week 3.
InClass we will be looking at CSS.
>>Make sure you download the handout from last week: ‘ADV3550_CSSBasics1’
>> And download this handout as well: ADV3550_CSS-continued
>>Here are the example files we will be looking at in class:
Lesson-3
>>Over the next two weeks we will begin to design the look for your web-portfolio.
Using Photoshop begin to sketch the layout for your site. Photoshop will allow you to experiment with how you want things to look without having to get bogged down with the programming. Once you have finalized the look of your site, and your design has been approved, you will begin to recreate it using HTML and CSS.
In Photoshop set up a new document to be:
- 960 x 600 pixel (use template with grid provided, note the dimensions are 1020×1020 px)
- RGB color scheme
- 72 dpi
Refer to the Photoshop template created by ‘960 Grid System’ (http://960.gs/)
You can download templates from their site. These templates provide both a 12-column grid that is divided into portions that are 60 pixels wide, and a 16-column grid that consists of 40 pixel increments. Each column has 10 pixels of margin on the left and right, which create 20 pixel wide gutters between columns. The most commonly used format for the web is 2/3 of the overall page width for the main content and 1/3 for sidebar content.
Homework
>> Email me the link to your ‘coming soon page’ and your ‘html resume’ (ghitchings@citytech.cuny.edu)
>> Email me an example of a portfolio you feel is well designed and example of a portfolio you feel is badly designed.
>> Begin to sketch the layout for your site in Photoshop
>> See details here:
ADV3550-Week3-Assignment
Week3 -7158
Hello. Welcome to week 3 – Monday September 20th!
Today’s Agenda
>> Presentations:
- Paula Scher
- Seymour Chwast
We will review the two presentation from last week on Type Classifications and Type Anatomy – Legibility vs. Readability.
>> Here are two diagrams showing the anatomy of a typeface:
Anatomy-of-a-Typface-1
Anatomy-of-a-Typface-2
>> Typographic Exploration: review thumbnail sketches. Choose two of your most successful sketches and begin to render the in InDesign.
>>InDesign
- Working with text – text box, create outlines
- Color – stroke. fill color, color picker – Process CMYK, Spot
- Vector – creating shapes, transforming, manipulating shapes, pen tool, paths
- Rulers and Alignment
- Layers Palette
Homework
>>Typographic Exploration: Nine Circles of Hell from Dante’s Inferno
Chose two words from your sketches. Use InDesign to set each word to one of the typefaces listed below that seems appropriate for expressing some aspect of the character of each word you sketched. Remember your goal is to alter the shapes of the letterforms in the word without compromising the legibility or integrity of the word form.
Type List: Garamond, Baskerville, Goudy, Bodoni, Didot, Memphis, Clarendon, Caslon, Century Expanded, Rockwell, Universe, Gill Sans, Futura, Franklin Gothic, Helvetica.
Goal: Modify these words in away that enhances their meaning. Consider the possibilities of altering the shapes of the letterforms or varying the letters-pacing in the word without compromising the legibility or integrity of the word form. Your goal is to use specific visual variables (size, weight, shape, texture, position, orientation) that might successfully support, enhance, or otherwise reinforce the meaning of each word.
>>Review handouts of terms you need to know from week 1 and week2.
Week2 – 7158
Hello. I have made a few adjustments to the posting I gave on Monday. Here are all the handouts I gave in class, as well as the homework assignment for next week. Email me if you are not able to download any of the links below. And let me know if you have questions!
In-class Presentation
>> Please review the following two presentations:
Type_Classifications
Type_Anatomy
>> Interesting observation about how we read:
ADV1160_HowWeRead
Homework
>>Project 1 – Nine thumbnail sketches:
ADV1160_Project1Overview
>>You can use this sheet for creating your thumbnails:
Thumbnails
>>Terms you need to know:
ADV1160_Week2-Terms
>> Student presentations begin:
Nicole Hatten is scheduled to present Seymour Chwast.
Week2 – 7162
Hello. Here are all the handouts for our second week of class, as well as the homework assignment for next week. Email me if you are not able to download any of the links below.
And let me know if you have questions!
In-class Presentation
>> Please review the following two presentations:
Type_Classifications
Type_Anatomy
>> Interesting observation about how we read:
ADV1160_HowWeRead
Homework
>>Project 1 – Nine thumbnail sketches:
ADV1160_Project1Overview
>>You can use this sheet for creating your thumbnails:
Thumbnails
>>Terms you need to know:
ADV1160_Week2-Terms
Week2 – 7260
Hello. Here are all the handouts from our second class, as well as the homework assignments for next week. We will begin to go over CSS next week.
Let me know if you have questions!
Over the course of the semester we will be working on developing on online portfolio. Please read the project overview here:
ADV3550_Project-Overview
Today in class we will create two web pages. A welcoming page that should link to an online page of your resume.
We will be uploading the pages to your new URL. Here is an example:
www.genevievehitchings.com/week2A
Homework
1. ADV3550-Week2-Assignment
2. Continue to sketch ideas for your site ID (logo)
3. Begin to sketch out ideas for what your site might look like (paper and pencil)
4. Research the following links and find three examples of portfolios you really like:
www.creativehotlist.com
www.coroflot.com
www.netdiver.net/portfolios
Handouts
ADV3550_CSSBasics1
Read
ADV3550_Resume
To get you started, here is a list of a few nice examples of (HTML) portfolio websites:
http://www.imaginarydesign.co.uk/
http://deliciousdesignleague.com/
http://www.hucklebuckdesign.com/
http://www.muccadesign.com/index.php
For examples of bad design visit: www.webpagesthatsuck.com
Week1 – 7158
Welcome to the first week of the semester.
It was nice to meet you last week. I hope you are all enjoying the week off.
I will post all the handouts and presentations I give in class week by week.
NOTE: We have had a room change. From now on we will be meeting in N1103. Next week we will meet in room G208 and then move to N1103 as a group.
Resources
Here are a couple of resources for you to explore before our next class:
www.spd.org – The SPD stands for Society of Publication Designers. This is a great resource for design students in NYC. You should check out the ‘event’ section on the website and note the upcoming events in case they interest you.
www.aiga.org – AIGA, the professional association for design. A good resource for design related events in the NYC area. The website has lots of useful information.
www.adcglobal.org – Art Directors Club, another organization focused on creative talent and a gathering place for students and professionals related to visual communications.
www.commarts.com – this Communication Arts online magazine. Filled with interesting articles about exciting things happening within the design world; a great sight for getting inspired.
Student Presentations
Over the course of the semester each of you will be asked to create a five-ten minute presentation on one of noted designer. See list here: ADV1160_StudentPresentations
- Presentations should be visual and about the work of the designer. You should show eight to ten selections of the designer’s most noted work.
- You must also provide a synopsis of the designer’s background. Keep a careful record of all the sources you use for this presentation. You will be asked to hand in a one-page summary of your presentation along with a bibliography of references.
- How you decide to present the designer’s work is up to you. You will be required to show their work on the big screen in the classroom. You can create a PowerPoint presentation, you can walk us through the designer’s website, you can collect a series of images in a folder and present their work from the folder. Whichever way you decide to show their work, your presentation should be organized and demonstrate thorough research on your part.
I will pass the list around in our next class and ask you to sign up for one designer.
Homework
>> Handouts: List of terms you need to know:
ADV1160_Week1-Terms
>>Read:
ADV1160-AboutDantesInferno
Week1 – 7162
Welcome to the first week of the semester.
It was nice to meet you last week. I hope you are all enjoying the week off.
I will post all the handouts and presentations I give in class week by week.
NOTE: We have had a room change. From now on we will be meeting in G204. Next week we will meet in room N1104 and then move to G204 as a group.
Resources
Here are a couple of resources for you to explore before our next class:
www.spd.org – The SPD stands for Society of Publication Designers. This is a great resource for design students in NYC. You should check out the ‘event’ section on the website and note the upcoming events in case they interest you.
www.aiga.org – AIGA, the professional association for design. A good resource for design related events in the NYC area. The website has lots of useful information.
www.adcglobal.org – Art Directors Club, another organization focused on creative talent and a gathering place for students and professionals related to visual communications.
www.commarts.com – this Communication Arts online magazine. Filled with interesting articles about exciting things happening within the design world; a great sight for getting inspired.
Student Presentations
Over the course of the semester each of you will be asked to create a five-ten minute presentation on one of noted designer. See list here: ADV1160_StudentPresentations
- Presentations should be visual and about the work of the designer. You should show eight to ten selections of the designer’s most noted work.
- You must also provide a synopsis of the designer’s background. Keep a careful record of all the sources you use for this presentation. You will be asked to hand in a one-page summary of your presentation along with a bibliography of references.
- How you decide to present the designer’s work is up to you. You will be required to show their work on the big screen in the classroom. You can create a PowerPoint presentation, you can walk us through the designer’s website, you can collect a series of images in a folder and present their work from the folder. Whichever way you decide to show their work, your presentation should be organized and demonstrate thorough research on your part.
I will pass the list around in our next class and ask you to sign up for one designer.
Homework
>> Handouts: List of terms you need to know:
ADV1160_Week1-Terms
>>Read:
ADV1160-AboutDantesInferno
Week1 – 7260
Hello. It was nice to meet you on Monday.
I will post all the handouts and presentations I give in class week by week to this site.
If you signed up on the homepage, you should receive an email when I post new content, this should help keep you up-to date with the class.
Homework
1. Register for your own domain name and URL here: http://kionic.com/cuny
Please try to do that before our next class 9/13/10.
2. Begin to sketch ideas for your site ID (logo)
3. Bring in Resume
4. Go to: www.htmldog.com/guides and complete the HTML Beginner Tutorial
Handouts
ADV3550_week1-Agenda
ADV3550_week1-Terms
ADV3550_week1-HTMLBasic
