Unit 1: Journal Website
Unit 2: App Project
Unit 3: Commercial Series— Create a Commercial series in After Effects. The commercial could be an extension of a design project from a previous course: Advertising Design, Package Design and etc. All commercials will be uploaded to Vimeo.
Option 1: one 20s TV commercial + one 8s Instagram Ad Option 2: three 8-12s Instagram Ads
Unit 4: Mini movie
New Change—Unit 5: Updating your portfolio site with work you created this semester 5%
Copyrighting, voice-over, AE animation, techniques
Art direction, project assistants, No studio?
Still photography, masking, AE cameras
Editing still photos and make it into cinemagraph, z-position + puppet pin
Consistent lighting and still camera position
Create your own footage
Lighting is the key.
Find footage online
Edit all footage clips to be more consistent.
Summer internship projects at The Richards Group
Recent Student Work
M 03/23— Assign Project, Work in class—Puppet Pin tool, Project Discussion—Meeting individually: previous projects, company products, and initial slogan/copywriting.
W 03/25— Meeting individually: progress on a project concept, storyboard, footage, copywriting, voiceover, AE techniques?
M 03/30—Meeting individually: copywriting should be finished, AE technique is learned, the footage is prepared over the weekend.
W 04/01—1/3 commercial finished;
M 04/06— 2/3 commercial finished; Voice over should be prepared.
W 04/08— 3/3 commercial finished;
M 04/13— Project is due
Walking Cycle—Introducing puppet pin tool Effects
Animation Assignment: Animate a cartoon character and post it on Instagram and tag @yvecao by end of next class or submit on TCUonline Post five inspiration entries on TV Commercial on your journal
720p HD 16:9 aspect ratio 1280 × 720
Yes. There are
templates, but use them wisely.
How to render your video in a smaller size?
Weekend Assignment— put at least 5 video entries about app promo on your journal.
1 Expand Animation
2 Video footage
3 3.1 Simple descriptions and break down into sections
4 Split view?
5 Audio to your target market
6 Solve a problem.
Please upload your final video on Vimeo, leave your app description, credit information in the description area.
Tips on prototyping screen recording
Download Kap to record your prototyping screen. Kap has the option of not showing mouse movements. Screen recording your prototype on a web browser will allow you to zoom and increase screen size. Suggested Schedule:
W 02/12: Plan your animation and prepare additional screens needed for animation
Weekend: Prototype your App
M 02/18: Prototype is due for discussion (Use your phone if applicable) Screen recording your 1st clip.
W 02/20: work in class: Animate your 1st clip;
Weekend: Screen record and animate your 2nd clip.
M 02/25: Discussion: Introduction to your app. Screen record and animate your 3rd clip and finishing your app animation
W 02/27: Work on your intro
M 03/04: Final presentation on App animation. Journal is due for mid term.
Work in class today Finish touching up all 8 screens
Inspiration 1, Inspiration 2, Inspiration 3
Journal entries: Post at least 5 inspirational entries on app presentation Digital poster(100% complete) for presentation —due on Monday, 02/10, TCU Online Printed poster—due on Wednesday, 02/12
App Poster Design Mounting Guideline:
app logo, slogan(less than seven words), app description (2-3 sentences) , icons, color codes, typography, procedure (step1,2,3) or features, graphic elements, background and etc
Include 8-10 screens Use iPhone mock-ups (3D, flat, outlined or no frame) Label all screens 1–2 inch border Flush mount on foam board, long side edge 32-36 inch* Similar to original iPhone screen size *
Bold text: project requirements *suggested guides
Any problems submitting your Animated Type Poster?
Masking Shapes Demo—Trkmat, Bezier Path, Parent Morphing—Shape Layer, Rotation
Work in Class:
Please Animate one of your logo—due at the end of this class, you may post it on your instagram @ me or submit via TCU Online
Separate logo layers in illustrator Use anchor point/scale/position/opacity/ rotation/ mask/ morphing in AE to animate your logo Don’t forget to turn on your Sunshine * Save it for Instagram
Creative Brief App names Logo Drafts 8-10 Screen plans
Due on Monday 01/27:
Finalized name and logo design 2-3 UI styles for the 1st & 2nd screens (Sketch or XD)
at least 7 screens developed for progress critique—Monday 02/03 8 screens poster (digital) Presentation—Monday 02/10 poster printed and mounted is due—Wednesday 02/12 DSVC submission—Friday 02/15
This is Advanced Computer Application to Graphic Design course! A class with the purpose of introducing the design concepts and skills required to develop interactive content for the screen-based media. This class will focus primarily on the merging of aesthetics and functionality in interface design, designing information architecture, and designing for a satisfactory user experience.
I will be encouraging you to work both individually and in groups during the semester on various projects, across various applications. However, the course remains focused upon understanding and the application of basic conceptual and design skills. I intend to provide these required skills to you, in informative, fun, and creative ways!
Please check out and use the links on the right column☞ for help and inspiration!
Reading Assignment this weekend: UI Design Basics Visual Design, please put down your reading notes on your journal. Download: Exercise file Demo: Inputting footage from Ai & Ps AE interface Shortcuts Path editing Timeframe Graph editor Rendering Loop gif Keywords for tutorials: after effects move on a path, bouncing ball, looping gif
Create an animated type poster by the end of Wed class/Jan 15, you may post it on your Instagram and tag me @yvecao, or submit it in Exercise folder on TCUOnline. 2-3 app ideas/flow maps due on Mon/Jan 15, be ready to show 3-5 inspirational journal entries or apps on your phone One app final idea—Design brief due on Mon/ 01/20, be ready to discuss thumbnails and inspirations on your journal
T 12/03—Work in class, Individual progress report
Th 12/05—User Testing and Critique (Yvonne will be in Boston, Kayce will facilitate our progress critique ) T 12/10—Branding Campaign final presentation—pdf due on TCUOnline by 9am F 12/13—Journal site is due at 8:00pm via email