brand identity in ui/ux design

34
in UI/UX Design Brand Identity Adryan Putra 21 October 2015

Upload: adryan-putra

Post on 13-Apr-2017

788 views

Category:

Design


3 download

TRANSCRIPT

Page 1: Brand Identity in UI/UX Design

in UI/UX Design

BrandIdentity

Adryan Putra

21 October 2015

Page 2: Brand Identity in UI/UX Design

Creative AssociateTanoto Foundation

MY SPECIALTIES

// Brand Identity

// UX+UI Design

// Publication

// Wayfinding EGD

2015

2014

2012

2011

2010

Art DirectorGrowmint Digital Agency

UX+UI DesignerThe Jakarta Post Digital

Branding Designera design kitchen (cocinero)

Branding Designeribrand

[email protected]

Adryan Putra

@Ree_4n

adryanputra.blogspot.com

behance.net/adryanputra

About me

Page 3: Brand Identity in UI/UX Design

Sample Works

Page 4: Brand Identity in UI/UX Design

Sample Works

Page 5: Brand Identity in UI/UX Design

AboutBrand Identity

AboutUI/UX

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 don’t have to worry about what will happen. Instead, they know what will happen based on earlier experience.

Jakob Nielsen

Page 6: Brand Identity in UI/UX Design

Branding & UI/UX Relationship

User-centered focus

Page 7: Brand Identity in UI/UX Design

Branding & UI/UX Relationship

They need to be explored & iterated

Page 8: Brand Identity in UI/UX Design

Brand Identity Elements in UI/UX

1. Color 2. Typeface

Abc3. Graphic Element

4. Imagery 5. Copywriting 6. Animation

Page 9: Brand Identity in UI/UX Design

Color

Page 10: Brand Identity in UI/UX Design

Typeface

Page 11: Brand Identity in UI/UX Design

Graphic Element

Page 12: Brand Identity in UI/UX Design

Imagery

Page 13: Brand Identity in UI/UX Design

Copywriting

Page 14: Brand Identity in UI/UX Design

Animation

Page 15: Brand Identity in UI/UX Design

Brand Designer’s Perspective

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

Page 16: Brand Identity in UI/UX Design

Web/App Designer’s Perspective

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

Page 17: Brand Identity in UI/UX Design

Problems at Hand

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

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

Page 18: Brand Identity in UI/UX Design

If We Look Closer

Accuracy Flexibility

Consistency

Bran

d Owne

r Designer

Developer

1. Brand Visibility2. Product Usability

Page 19: Brand Identity in UI/UX Design

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 e�ort in learning Brand Guidelines

Page 20: Brand Identity in UI/UX Design

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

Page 21: Brand Identity in UI/UX Design

Good Brand Guidelines

Page 22: Brand Identity in UI/UX Design

Good Brand Guidelines

Page 23: Brand Identity in UI/UX Design

Good Brand Guidelines

Page 24: Brand Identity in UI/UX Design

Avoid Dated Design Trends

Page 25: Brand Identity in UI/UX Design

Wait, what is this?

Page 26: Brand Identity in UI/UX Design

Seriously?

Page 27: Brand Identity in UI/UX Design

This Looks Better

Page 28: Brand Identity in UI/UX Design

Consistency Across Products

Page 29: Brand Identity in UI/UX Design

Consistency Across Platforms

Page 30: Brand Identity in UI/UX Design

1 Color Brand?

Page 31: Brand Identity in UI/UX Design

Zoning / Brand Architecture Partition

Page 32: Brand Identity in UI/UX Design

Recommended Books

Page 33: Brand Identity in UI/UX Design

Find Related Books: www.yasiv.com

Page 34: Brand Identity in UI/UX Design

Thank you!Now let’s discuss