F 09/25

Theory: UI Design Principles
Design: Color + Type | Emphasis & Focal Point
Technical: Digital Imaging + Image optimization
Practice: Digital Mock-up

Asynchronous Due for This Class

• Review: 2D Design Principles: Unity & Emphasis| CRAP in Design
• Watch: Tutorial 2 | XD Part 1
• Work on: Tutorial 2 | XD Part 2 (four videos) post to Blackboard
  • Post: Blackboard Discussion Board / Class 4 on Project 1 assignment 3: Post redesigned proposal, site map and wireframe two pages second version with sample designs in Adobe XD. Make sure you are collecting assets for your site.

Synchronous

• Attendance & Announcements
• Review: Principles Studies
  • Theory: UI Design Principles
    § Structure § Simplicity § Visibility § Feedback § Tolerance § Reuse
  • Design: Unity + Emphasis & Focal Point
    Unity: Continuation, Repetition, Alignment, Proximity
    Emphasis & Focal Point: Contrast, Isolation, Convergence, Unusual, Placement
  • Technical:
    • Digital Imaging
      • Raster x Vector
      • Resizing x Resampling | Photoshop
      • Best Extension
      • Optimizing images for web
      • Image Size:
        Area size in pixels (inches, etc.) + Resolution in dots (or pixels) per inch (dpi) = File size in bits
        Optimize for web: Area size not bigger than the site area, Resolution at 72 dpi, File size below 200 dpi
• Type + Color | Gestalt : Consistency
• Presentations
• Practice: Digital Mock-up in XD

Asynchronous

Project 1: Worst of the Web

• Site layout in Adobe XD – 4 pages
  • Home
  • About
  • Contact
  • A Link Page

• Web
• Mobile

Tutorial 3 | Adobe XD Part 3