User Interface Design Course

User Interface Design Course

1. User Interface

   • GUI
     • Windows
     • Icons
     • Mouse
     • Pointer
   • Multimodal
     • Haptic & Tactile
     • Vision
     • Audio
     • Scent
     • Taste

2. Human Centered Design Process

   • Phase 1: Understand and specify the context of use.
   • Phase 2: Specify the usage requirements.
   • Phase 3: Develop design solution that meets usage requirements.
   • Phase 4: Evaluate design solutions against usage requirements.

3. Gestalt Principles

   • Figure-ground
   • Similarity
   • Proximity
   • Common Region
   • Continuity
   • Closure
   • Focal Point

4. Composition & Layouts

   • Single Visual
   • Z Layout
   • Rule of Thirds
   • Golden Ratio

5. Nielsen's Heuristics Evaluation

   • Visibility of system status
   • Visibility of system status
   • User control and freedom
   • Consistency and standards
   • Error prevention
   • Aesthetic and minimalist design
   • Help users recognize, diagnose, and recover from errors
   • Flexibility and efficiency of use
   • Recognition rather than recall
   • Help and documentation

6. Text

   • Typeface
   • Type Size
   • Letter Spacing
   • Line Spacing
   • Line Length
   • Justification
   • Line Endings

7. Color

   • Use max 5 ± 2 colors
   • Design for monochrome
   • Color Perception
   • Color for reinforcement
   • Color for emphasis
   • Color for grouping
   • Color coding
   • Perspective

8. Icons

   • Scalability
   • Recognizability
   • Consistency
   • Uniqueness
   • Don't use words
   • Six Steps
     • Always start with a grid
     • Start with simple geometric shapes
     • By the numbers: edges, lines, corners, curves, and angles
     • Use consistent design elements and accents across icons
     • Use details and decorations sparingly

9. Design Artifacts

   • Sketches
   • Moodboards
   • Wireframes
   • Mockups
   • Prototypes

10. Cross-cultural Design

    • Power Distance (PDI)
    • Individualism vs. Collectivism (IDV)
    • Masculinity vs.Femininity (MAS)
    • Uncertainty Avoidance (UAI)
    • Long term vs. Short term Orientation (LTO)
    • Globalization
    • Localization
    • Internationalization

11. Design Trends 2016

    • Designing for bigger screens
    • Simplified user interface
    • Swiping replaces other gestures
    • Functional animation
    • Overlays
    • Creative navigation
    • Storytelling and branding
    • Increased emphasis on typography
    • Fresh color palettes
    • Designing for wearable technology
    • Increased use of app development platforms

12. Mobile UI Design

    • Use larger design elements
    • Ensure accessible navigation
    • Eliminate visual distractions
    • Swipe space
    • Thumb zone
    • Mobile context
      • Physical
      • Social
      • Task
      • Technical & Information
      • Temporal

Bilder und Dateien der Mindmap