brand identity in ui/ux design

Download Brand Identity in UI/UX Design

Post on 13-Apr-2017




3 download

Embed Size (px)


  • in UI/UX Design


    Adryan Putra

    21 October 2015

  • Creative AssociateTanoto Foundation


    // Brand Identity

    // UX+UI Design

    // Publication

    // Wayfinding EGD






    Art DirectorGrowmint Digital Agency

    UX+UI DesignerThe Jakarta Post Digital

    Branding Designera design kitchen (cocinero)

    Branding Designeribrand

    Adryan Putra


    About me

  • Sample Works

  • Sample Works

  • AboutBrand Identity


    Brand identity is tangible and appeals to the senses. You can see it, touch it, hold it, hear it, watch it move. Brand Identity takes disparate elements and unifies them into whole systems.

    Alina Wheeler

    Consistency is one of the most powerful usability principles: when things always behave the same, users dont have to worry about what will happen. Instead, they know what will happen based on earlier experience.

    Jakob Nielsen

  • Branding & UI/UX Relationship

    User-centered focus

  • Branding & UI/UX Relationship

    They need to be explored & iterated

  • Brand Identity Elements in UI/UX

    1. Color 2. Typeface

    Abc3. Graphic Element

    4. Imagery 5. Copywriting 6. Animation

  • Color

  • Typeface

  • Graphic Element

  • Imagery

  • Copywriting

  • Animation

  • Brand Designers Perspective

    Im going to see if they implement the Identity the right way, not like the last horrible one.

  • Web/App Designers Perspective

    Wait, a hundred rules just to use their logo & color... they must be joking to me...

  • Problems at Hand

    1. The Brand Guidelines: - Confusing - Complicated - Restrictive - Outdated

    2. Web/App Designer: - Too occupied - Not paying attention - Have their own judgement

  • If We Look Closer

    Accuracy Flexibility



    d Ow

    ner Designer


    1. Brand Visibility2. Product Usability

  • Viable Solutions

    1. Brand Designer: - Get to know UI/UX Principles or Best Practices - Create usability-oriented Brand Guidelines

    2. Web/App Designer: - Learn Brand Identity Basic Principles - Put more eort in learning Brand Guidelines

  • Brand Guidelines Principles

    1. Keep It Simple: - Focus on most important things - Get rid of unnecessary elements

    2. Good Navigation - Chapters, page numbers - Content grouping

    3. Comprehensive - Easy-to-digest content - Clear instructions

  • Good Brand Guidelines

  • Good Brand Guidelines

  • Good Brand Guidelines

  • Avoid Dated Design Trends

  • Wait, what is this?

  • Seriously?

  • This Looks Better

  • Consistency Across Products

  • Consistency Across Platforms

  • 1 Color Brand?

  • Zoning / Brand Architecture Partition

  • Recommended Books

  • Find Related Books:

  • Thank you!Now lets discuss