Category Archives: Activity Guide

Type Scavenger Hunt Activity Guide

Overview

Throughout  the semester  students will look for various typographic topics principles, techniques, post images and respond to assignment questions and and assessments from images selected.

Learning Outcomes

  • Students will reinforce typographic principles

Due Date(s)

  • Due as indicated.

Scavenger Hunt Activities

  • Variations
    • One example Bold text next to regular text
    • One example Condensed Typeface in use 
    • One example Italic text next to regular text
  • Variations 2
    • Any word (or letter) with extreme high contrast
    • Any word (or letter) with extreme no or low contrast
  • Alignment
    • One example of FL alignment
    • One example of FR alignment
    • One example of centered alignment
    • One example of justified alignment
    • One example of forced justification
  • Leading/ Tracking
    • One example of tight leading (line space)
    • One example of loose leading (line space)
    • One example of loose tracking (word space)
  • Path
    • One examples of type on a path (any but horizontal) Curved, circular, vertical.
    • One example of Lettering used in packaging
  • One example WARPED TEXT
  • One example of Type in Motion
  • One example of Text Wrap (text and image or text and text)
  • One example of problematic color and type (foreground and background relationship). For example a busy background and text over it or light type on a light background

Instructions

Find image examples below, upload into your post gallery and comment

Variations

  • One example Bold text next to regular text
  • One example Condensed Typeface in use 
  • One example Italic text next to regular text
  1. Week 1 – Create a post on OpenLab class site named “LastName_First Name  Type Scavenger Hunt”
  2. Give it categories “Student Post Type Scavenger Hunt” “Type Scavenger Hunt
  3. Upload and images into your media library for each hunt activity name them “LastName Firstname_TSH..”
  4. Insert a gallery into your post.
    You will use the SAME POST for the semester just add new gallery for every activity
  5. Create a Gallery In A Post
    https://openlab.citytech.cuny.edu/blog/help/adding-an-image-gallery/
  6. Respond to questions or comment in assignment post

Post Example


How to create an image for web usage
https://helpx.adobe.com/photoshop-elements/using/optimizing-images-jpeg-format.html
Optimize a JPEG JPEG is the standard format for compressing photographs.
• Open an image and choose File > Save For Web.
• Choose JPEG from the optimization format menu.
• Specify the compression level:Choose  quality option medium from the pop‑up menu under the optimization format menu. The higher the Quality setting, the more detail is preserved in the optimized image, but the larger the file size.
• View the optimized image at several quality settings to determine the best balance between quality and file size.
• Select Progressive to display the image progressively in a web browser; that is, to display it first at a low resolution, and then at progressively higher resolutions as downloading proceeds.
• To save your optimized image, click OK. In the Save Optimized As dialog box, type a filename, and click Save.

From your mobile device
“Image Size” app Google Play https://play.google.com/store/apps/details?id=de.vsmedia.imagesize&hl=en_US  
“Image Size”  IOS App Store  https://apps.apple.com/us/app/image-size/id670766542  

Resize Images in OpenLab
Most digital cameras and  phones are likely to be set to take images that are vastly larger than a user of a computer screen is likely to need
https://openlab.citytech.cuny.edu/openroad/image-resizing/




 

Name That Type Discussion Activity Guide

Overview

Live  Game  Show and Discussion about Typography


Students will comment in live synchronous class discussions to try and identify or answer questions related to posted in class content. This is part of  class participation grade.

Learning Outcomes

  • Students will reinforce the typographic principles of the course through observation and critiques  of current work examples in typographic industry.
  • Students will develop  type identifications skills
  • Students will develop an awareness of typography history general typographic knowledge

Type Challenge Activity Guide

Overview

Type Challenges are design assignments and discussions completed with time constraints during class or as specified.

Can also be assigned as homework assignments.

Learning Outcomes

  • Students will reinforce the typographic principles of the course through observation and critiques  of current work examples in typographic industry.
  • Students will develop a sense of current typography trends and be able to discus them with relevant terminology

Due Date(s)

  • Due during class sessions or by  class meeting time as indicated.




 

Type Hero Activity Activity Guide

Deliverable 

  • A post to the OpenLab name Lastnamefirstname_Type Hero.
  • Insert your document  (PDF) or link to your presentation into your post
  • Give it categories “Student Post Type Hero” “Type Hero”

Presentation of Designers


Over the course of the semester each of you will be asked to create a 5 minute presentation on one of the assigned designers listed below.
Presentations should be visual and of the designer’s work.
You should show 8 to 10 selections of the designer’s most noted work.

  • You must  provide a 2-3 paragraph summary of the designer’s background, career highlights, and most noteworthy work.
    Keep a careful record of all the sources you use for this
    presentation, include bibliography of references
  • You will be required present your work in a class session. You can create a PowerPoint presentation, you can use websites, 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, and you should be able to talk about the pieces you show

  • Week 5
    Johann Gutenberg
    Nicolas Jenson
  • Week 6
    Aldus Manutius
    Cipe Pineles
  • Week 7
    Louise Fili
    Giambattista Bodoni
  • Week 8
    Zuzana Licko
    Fortunato Depero
  • Week 9
    Paula Scher
    Jan Tschichold
  • Week 10
    Massimo Vignelli 
    Gail Anderson
  • Week 11
    Susan Kare
    John Baskerville
  • Week 12
    Carol Twombly
    Saul Bass
  • Week 13
    Rosmarie Tissi
    Adrian Frutiger

Found Alphabet Discussion Activity Guide

Found Alphabet

  • Weekly image posts of  alphabet letters,numbers 1-9 ,0  and comments
  • Final  Due  last class Upload a compiled PDF into your post for final

Process

Photograph samples of type you observe type around you. Accumulate a library of all the letters of the alphabet, include numbers 1-9. Take photos at a high resolution for print. (300 dpi). NOTE: To assure clarity consider the lighting and background You can do more that one or other letterforms or symbols if you wish after first full alphabet set

Weekly

  1. Create a post on OpenLab class site named “LastName_First Name  Found Alphabet”
  2. Post example
  3. Give it categories “Student Post Found Alphabet”  “Found Alphabet”
  4. Upload and insert ONE  image into your post each week. name them “LastName Firstname_Letter…”
  5. Make your image 250PPI x 250PPI
    Create a gallery and format images as below
  6. Comment on 1 image  uploaded by classmates each week  
  7. Try to give them classifications. Serif, Sans Serif, Old Style, Display,  Modern, Transitional
  8. Or try to identify them, you could try:  WhatTheFont Upload an image and tells you the name of the font
  9. Or comment on the typeface choice and usage
  • ptimize a JPEg. A JPEG is the standard format for compressing photographs.
  • Open an image and choose File > Save For Web.
  • Make your image 250PPIx 250PPI
  • Choose JPEG from the optimization format menu.
  • Specify the compression level: Choose quality option medium from the pop‑up menu under the optimization format menu.
  • The higher the Quality setting, the more detail is preserved in the optimized image, but the larger the file size.View the optimized image at several quality settings to determine the best balance between quality and file size.
  • Select Progressive to display the image progressively in a web browser; that is, to display it first at a low resolution, and then at progressively higher resolutions as downloading proceeds.To save your optimized image, click OK.
  • In the Save Optimized As dialog box, type a filename, and click Save.

Due At The End of Semester

  • Create an 8.5×11 document with  InDesign match the PDF example
    • Create a master page include:
    • Insert 5″ margins all around
    • Place  12  2″x2″ picture boxes aligned and spaced evenly on one page.  Have text box with a letter annotation on top of each
    • Text to have text on top left: First name last name ” Top right  “Found Alphabet”
    • Insert  pages into your document from the master you created Place images into InDesign file picture boxes and work with picture crop there. Annotate/caption images with the letter selected
    • Save the doc as a PDF name it: “lastname_firsname_Found_Alphabet.pdf
    • Upload a PDF into  your  OpenLab “LastName_First Name  Found Alphabet”   post

How to create an image for web usage

Most digital cameras and phones are likely to be set to take images that are vastly larger than a user of a computer screen is likely to need

  • Optimize a JPEg. A JPEG is the standard format for compressing photographs.
  • Open an image and choose File > Save For Web.
  • Choose JPEG from the optimization format menu.
  • Specify the compression level: Choose quality option medium from the pop‑up menu under the optimization format menu. The higher the Quality setting, the more detail is preserved in the optimized image, but the larger the file size.
  • View the optimized image at several quality settings to determine the best balance between quality and file size.
  • Select Progressive to display the image progressively in a web browser; that is, to display it first at a low resolution, and then at progressively higher resolutions as downloading proceeds.
  • To save your optimized image, click OK. In the Save Optimized As dialog box, type a filename, and click Save.

How to add images to OpenLab

Resize Images in OpenLab

Video Demo OpenLab Image Edit
https://openlab.citytech.cuny.edu/openroad/image-resizing

Insert Images into a Post

Create a Gallery In a Post

Edit a Gallery In a Post

PhotoShop Video demo optimize images