CT300 601/65A (2022)

Typography for Digital Content Design

Professors: C. J. Yeh
Company website: Cynda Media Lab
Email: chinjuz_yeh@fitnyc.edu
Office at FIT: D317
Office hours: Tuesday 5-6, Wed 2-3 and 5-6, Thursday 5-6 (email in advance to make appointment)
Program Website: NewCraetives.info
Instagram: NewCreatives.info
Program Channel: CT&D at YouTube
Student Projects on Behance: CT Classes / AD Classes
FIT Help Desk: TechHelp

Course Description

Focuses on fundamental typographic elements, theories, and skills unique to screen-based media that enable students to create holistic and experiential typographic designs which move beyond the limitations of print. Touch-screen-based typographic layouts and responsive editorial design principles and techniques will be explored. Expressive screen-based typography experimentations, including the integrations of type, sound, motion, and interactivity are included.

Weekly Outline
* Weekly outline is subject to change according to the pedagogical needs.

Tue: 08/30 Thur: 09/01 (w1)

  • Introduction of the course & distribute the syllabus
  • Project #1: More Than Words 30 FPS / Duration: 15 sec. (minimum) / Dimensions: 1080 (W) x 1080 (h) / format: H.264
    The goal of this assignment is to create an expressive animation using typography, shapes, and music to communicate the feeling and emotion embedded in a word.
    – example: Lena Kourgouzov
    – example: Dora Maya
    – example: Yewon Shin
    – example: Desiree Mohammadi
    – example: Unmatched / Unstoppable / Unforgettable
  • Lecture: Introduction to Typography for Digital Content Design
  • Demo: After Effects Fundamentals
    – AE Terminologies: .aep, comp, footage…etc,
    – workspace layout and general interface
    – Aspect ratios and screen resolutions
    – Frame rate (FPS)
    – Setting up a comp (Command+N)
    – Import assets (Command+I)
  • In-class Workshop:
    – Team forming (5 students per team) and select a group captain
    – Remote learning framework: join Slack group channel, install and/or update After Effects, Photoshop, and Illustrator, create one G drive group folder.
  • Prepare the first group presentation: one thing the group members have in common and the four examples of digital content design.

Tue: 09/06 Thur: 09/08 (w2)

  • Group Presentation: Four Best Content Designs
  • Demo: After Effects
    – Review fundamentals
    – Edit composition settings (Command + K)
    – Creating and editing text layer
    – Exit text editing mode: (ENTER on the numeric pad or Command +RETURN)
    – Selection tool (V)
    – Primary transform properties: Anchor (A), Position (P), Scale (S), Rotation (R), Opacity (T)
    – Motion Path
    – Easy Ease
    – Anchor Point Tool (Y)
    – Next/Previous Frame: (PAGE UP/PAGE DOWN)
    – Move anchor point to object center (Command + double click pan behind tool)
    – Activate Anchor Point Guide (Command + move anchor point with pan behind tool)
    – Center object on stage (Option + double click pan behind tool)
    – Preview: (Space Bar or 0 on the numeric pad)
    – Import Photoshop Files (footage, composition, or composition retain layer sizes)
    – Pan Behind / Anchor Point Tool
    – Export using Adobe Media Media Encoder
    – Solid layer for background while rendering using AME
    – Shortcut References
  • QuickFire Challenge #1
  • Homework:
    – Project #1 starts
    – Each group prepares a 7-minute presentation of the group of related words
    – The presentation should include the five keywords and five moodboard (images and 3 to 5 adjectives) each representing the emotion you intend to evoke.

Tue: 09/13 Thur: 09/15 (w3)

  • Group Presentation: More Than Words Project Proposal
  • Lecture: Storyboard and Animatics
  • Demo: After Effects
    – Converting Photoshop Text Layer (Layer/Create/Convert to Editable Text)
    – Source Text Property
    – Hold Keyframe
    – Set work area (B, N)
    – Trim comp to the work area (option + click)
    – Deselect All (Command + Shift + A)
    – Shape Layer Basics
    – Graph Editor: Value Graph
    – Render basics
  • QuickFire Challenge #2
  • Homework:
    – Audio choice(s)
    – Storyboard for project #1

Tue: 09/20 Thur: 09/22 (w4)

Tue: 10/11 Thur: 09/29 (w5)

Tue: 10/18 Thur: 10/06 (w6)

  • QuickFire Demos
    – Text Animation Presets
    – Puppet pin
  • Team Review
  • In-class Workshop:
    – Project #1 production and presentation prep
  • Homework:
    – Project #1 production

Tue: 10/25 Thur: 10/13 (w7)

  • Individual Review
  • In-class Workshop:
    – Project #1 production and presentation prep

Tue: 11/01 Thur: 10/20 (w8)

  • Presentation: First Project
  • Final Project: Data, Information, and My Message to the World (scholarship competition) / 30 FPS / Duration: 90 sec. (minimum) / Dimensions: 1920 (W) x 1080 (h) / format: H.264
    The goal of this assignment is to create a time-based and type dominant quantitative infographic that is persuasive. Each student will define their own research topic based on one of the sociological issues challenges that people are facing today. The instructor will guide the students through the professional process of research, concept developments, storyboarding, and the final production.
  • Discussion: How to Create Persuasive Motion Graphics
    – example: Natalia Corletto
    – example: Din Terpuni
    – example: Gabriel Ribes
    – example: Lia Sfiligoj
    – example: Alexis Gallo
    – example: Si Weon Kim
    – example: Margaux Le Pierres
    – example: Ashley Aviles
    * Click here to see more past examples on class YouTube Channel
  • Homework:
    – Final project topic selections (3)

Tue: 11/08 Thur: 10/27 (w9)

  • Presentation: Final Project Topic Selection
  • Demo:
    – Using video in After Effects
    – Effects: Corner Pin + CC Power Pin
    – Luma Matte
    – Time Remapping
  • In-class Workshop:
    – Winning Formula Part One: watch at least four examples together
    – Winning Formula Part Two: discuss why the scripts are successful and list all the key points (minimum 5 per video). Submit at the end of the class. (Google Doc, label your comment with your initials)
    – Final Project Scripts First Draft (Google Doc)
  • Homework:
    – Final Project Scripts First Draft (Google Doc)

Tue: 11/15 Thur: 11/03 (w10)

  • Group Review: Project Script
  • Demo:
    – Roto Brush
    – 2D Motion Tracking
    – 3D Camera Tracking Text
    – 3D Camera Tracking Solid
    – expression panel (Option + click on stopwatch)
    – expression: loopOut(); wiggle();
    – Tracking
  • In-class Workshop:
    – Final Project Scripts Review and Edits
    – Review your scripts together, do editing (Google Doc, label your comment with your initials), and submit the revision at the end of class.
  • Homework:
    – Final Project Scripts Complete.
    – Find audio, and create moodboard and style frames.

Tue: 11/22 Thur: 11/10 (w11)

  • Review: Audio, Moodboard, and Style Frames
  • Demo:
    – Camera Basics
    – DUIK BASSEL
    – Install Durik
  • In-class Workshop:
    – Review your audio, moodboard, and style frames.
  • Homework:
    – Record Voiceover
    – Animatics

Tue: 11/29 Thur: 11/17 (w12)

  • Review: Animatics
  • In-class Workshop:
    – Final production
  • Homework:
    – Final production

Tue: 12/06 Thur: 12/01 (w13)

  • In-class Workshop:
    – Final production and presentation preparation

Tue: 12/13 Thur: 12/08 (w14)

  • In-class Workshop:
    – Final production and presentation preparation

Tue: 12/20 Thur: 12/15

  • Final Presentation
  • All project files upload to Google Drive for final grading

Uploading Files for Final Grades

  • CT300 601
  • CT300 65A
    * keep all project and process files and upload before the semester is over for final grading.

Attendance Policy

Attendance is not optional. If you are going to miss a class, you must contact me via email ASAP. Due to the quantity of material covered in the course, I will not be able to spend class time explaining missed assignments or redo lectures. If a class is missed, it is your responsibility to get information regarding missed assignments and lectures from one of your classmates.

  1. Students are required to attend all classes, be on time, and remain for the entire class. Remote accomidation requires Doctor’s note.
  2. If you have to attend remotely, you must turn on your webcam during class time.
  3. Students who miss three classes will receive a grade of “F.”
  4. The student who arrives 10 minutes after the start of the class will be considered late
  5. 2 late occurrences = one absence
  6. A student who arrives over 30 minutes late or not returning from the break will be considered absent from the class
  7. Working on projects for another class or using digital devices for socializing (texting, social media…etc.) or gaming during class time will be recorded as an absence
  8. An excused absence is still recorded as an absence. The difference is an excused absence won’t impact your grade for professionalism and class participation.

Syllabi statement on classroom protocols, Fall 2021

The return to campus will mean adapting to new routines and standing together in our shared responsibilities. To support the health of our FIT community, every member of this course will commit to abide by the following guidelines:  

  1. We, the students, faculty, and classroom personnel must wear masks in all indoor FIT spaces including classrooms, studios, labs, and hallways. 
  2. We will wear masks such as N95s or other double-layered masks that cover our noses and mouths. We will follow NYC guidelines for mask-wearing: https://www1.nyc.gov/site/coronavirus/resources/facecoverings.page
  3. If we arrive on campus without a mask, we must pick one up from campus security desks before entering FIT buildings. 
  4. If we don’t comply with this shared responsibility, we will be asked to leave the campus.
  5. We will monitor our health regularly, and, if feeling ill, we will stay home and seek Covid PCR testing before we return to campus.
  6. We will be mindful of spacing issues within the class, and practice reasonable distancing when practical.
  7. We affirm that we, as members of the FIT community,  will provide proof of vaccination or proof of weekly Covid PCR testing results to FIT Health Services as outlined in campus communications. 

Grading

  • Professionalism and Class Participation: 30%
  • First group presentation: 4%
  • QuickFire Challenges (5 points per challenge): 20%
  • First Project Presentation: 16% (4% project proposal, 4% storyboard, 4% animatics, 4% animation)
  • Final Project Presentation: 30% (5% research, 5% script, 5% animatics, 15% animation)
  • (A: 91% or above, B: 90% – 71%, C: 70% – 61%, D: 60% – 51%, F: 50% or below)

Creative Technology & Design Policy on Plagiarism

Within the Communication Design Pathways Department, plagiarism, and other forms of academic deception are unacceptable. Each instance of plagiarism is distinct. A plagiarism violation is an automatic justification for an “F” on that assignment and/or an “F” for the course. A student found in violation of FIT’s Code of Conduct and deemed to receive an “F” for a course may not withdraw from the course prior to final grade assignments.

CT&D Recording Classroom Activities Policy

I. Introduction
Written permission is required in order to record classroom lectures, discussions, presentations (“lectures”), or other activities. When granted, permission to record lectures is subject to the limitations set forth in this policy. Violations of this policy may constitute copyright infringement in violation of federal or state law and may be subject to disciplinary action.

II. Definitions
A. Course Materials mean lecture notes, outlines, slides, Powerpoint presentations, readings, or other content made available to students by the instructor or presenter, or through any online learning system.

B. Recording means a video or audio replication or photographic image recorded on devices including, but not limited to, audio recorders, video recorders, cell phones, Smartphones, digital cameras, media players, computers, or other devices that record images or sound.

III. Requirements and Limitations
A. Written Permission
Recording of classroom lectures is prohibited unless advance written permission is obtained from the class instructor and any guest presenter(s). An instructor may provide such permission to an entire class as part of the course syllabus or other written description of a course. Students who require recording or other adaptations of lectures as a reasonable accommodation for a disability in advance of the lecture in order to obtain permission for the recording.

In the event permission to record classroom lectures is granted, the professor may notify all students, speakers and other lecture attendees in advance that recording may occur. Every effort should be made to protect the confidentiality of a student with a disability who is being granted an accommodation, i.e. the professor will not name the student who is doing the recording when it is due to disability accommodation.

B. Limitations on Use of Recordings and Materials
Permission to allow lecture recording is not a transfer of any copyrights in the recording or related course materials. Such recordings and materials may be used only for individual or group study with other students enrolled in the same class, and may not be reproduced, transferred, distributed, or displayed in any public or commercial manner.

Students must destroy recordings at the end of the semester in which they are enrolled in the class.

FIT Student Code of Conduct
Student Disability Services
Academic Honesty and Integrity Policy
FIT’s Course Withdrawal Policy 
Children on campus policy
FIT-ABLE 
Academic Advisement Center 
FIT Writing & Speaking Studio
FIT Counseling Services
Academic Skills Tutoring Center
Dean of Students Office
Technical Support for Blackboard with Open SUNY Help Desk

Additional Course Information:

Credits/Hours: 2/3
Class Meeting Time: 3PM to 6PM

STUDENT LEARNING OUTCOMES:
Upon successful completion of the course, students will be able to:

  1. demonstrate an understanding of the typographic design principles and theories that are unique for screen-based media
  2. establish typographic hierarchy based on modular scales for adaptive and fluid grids
  3. create typographic design solutions for digital content design
  4. elaborate the mobile-first typography design process, screen-based typography scale, and the concept of relative hierarchy for responsive design.
  5. create a range of low to high fidelity prototypes 
  6. create a professional quality case study reel (AE) and online presence

Grade appeal process: http://www.fitnyc.edu/registrar/grades/appeal.php for more information.

Library Resources: FIT Library Databases

Academic Advisement Center: http://www.fitnyc.edu/academic-advisement/index.php

Technical Requirements: High-speed internet and Adobe CC

Textbooks and Required Materials: Lecture slides will be provided every week after class,