Presentation: Intro Web fonts- what are they and how to use them
Activity: Practice adding web fonts in code pen 1st using type kit and then using google fonts. Select 2 different fonts from each. Practice using different sizes and weights on various HTML elements.
Visual Research: find 5 type specimen examples you like.
Pick a Font: look for a font for your type specimen (look for print and web font, try to pick one with a larger family at least more than one weight.)
History: Research the font history (traditional web fonts all have a history, some web fonts may have been created based on traditional fonts. When was it made, Who made it, What type foundry is it from, is it based on a traditional font?)
Design: Once you have found a good font Design the lay out of your type specimen in illustrator. (remember this will be recreated on the web so your art board can be as long as you want!
Remember you can watch lynda videos at 1.5 or 1.75 speed to watch them faster.
2. Work on Project one: We will be sharing your project one in class on Monday for final Critique. There will not be work time for P1 on Monday, all files must be turned into google classroom before class on Wed.
Create a one page informational website about a topic of your choice. Website will have an external css style sheet, use at least one web font, use some HTML5 tags, have images, and a link to an external website. This project will pull together all the content that we have discussed so far this semester.
1. Pick a topic for Informational Website and gather/create content
2. Visual Reserch: Find examples of websites you like.
3. Wireframe/sketch your layout
Wednesday
In Class
Small group crit of topics and Wireframes
Work Time
Desk Crit- check in
For Next Class
1. Work on P2
2.
Friday
In Class
Work Time
Desk Crit- check in
For Next Class
1. Work on P2
2.
Week Eight: 10/10-10/14
Monday
In Class
Presentation: Practice FTP for your files for P2
Work Time on P2
Desk crit- check in
For Next Class
1. P2 ready for process critique
Wednesday
In Class
Process critique of P2
For Next Class
1. Work on P2
Friday
In Class
Presentation:
Work time for P2
For Next Class
1. Have p2 99% done for final critique
2.
Week Nine: 10/17-10/21
Monday
In Class
CLASS CANCELLED due to illness
Final Critique of P2- Please email with any questions you have.
See google classroom for FTP username chartRemember: add a folder with your name to upload your website to. Do not just upload your index.html file to the P2 folder on the server.
For Next Class
1. Turn in P2 before next class to google classroom [no folder just files/images]
1. For Monday You Should be done with user testing and prototyping.
2. Start thinking about color pallets/fonts interface styles for redesign of your website. Should have finished low fedelity wierframes for monday focused on content but make notes about interface design decisions too.
Discussion on design phase, may want to continue to user test but not required
Work Time
For Next Class
1. High fidelity mock up of Homepage with color pallet, font choices and styling defined. (only need for Home page, you will code your sub pages based on the styles set up in the homepage)
2.
Wednesday
In Class
Get started coding! Dive in!
Work Time Final Project
For Next Class
1.
2.
Friday
In Class
Work Time Final Project
Desk Crit
For Next Class
1.
2.
Week Fourteen: 11/21-11/25 Thanksgiving
Monday
In Class
Holding a remote class Do NOT need to come to the classroom.
