42
RESPONSIVE BRANDING Making your brand interactive on the web. KATE MATSUDAIRA MARY RAUZI

Responsive Branding: Making Your Brand Interactive on the Web

Embed Size (px)

Citation preview

Page 1: Responsive Branding: Making Your Brand Interactive on the Web

RESPONSIVE BRANDINGMaking your brand interactive on the web.

K A T E M A T S U D A I R A M A R Y R A U Z I

Page 2: Responsive Branding: Making Your Brand Interactive on the Web

You have the power to engage or lose an

audience.

Page 3: Responsive Branding: Making Your Brand Interactive on the Web

Where is your brand portrayed?

Where is your brand portrayed?

01

Page 4: Responsive Branding: Making Your Brand Interactive on the Web

COMPUTER PHONE TABLET S M A R T D E V I C E S

ADVERTISEMENTS KIOSKS VIDEO S O C I A L M E D I A

Page 5: Responsive Branding: Making Your Brand Interactive on the Web

is just the beginning.B L E N D I N G I N T E R A C T I O N A N D C R E A T I N G R I C H B R A N D E X P E R I E N C E S

Page 6: Responsive Branding: Making Your Brand Interactive on the Web

Multi-channel branding

Where is

Page 7: Responsive Branding: Making Your Brand Interactive on the Web

Controlled environment

No-man’s land

VS

02

Page 8: Responsive Branding: Making Your Brand Interactive on the Web

Controlled environment

No-man’s land

VS

02

Page 9: Responsive Branding: Making Your Brand Interactive on the Web

Controlled environment

Page 10: Responsive Branding: Making Your Brand Interactive on the Web
Page 11: Responsive Branding: Making Your Brand Interactive on the Web
Page 12: Responsive Branding: Making Your Brand Interactive on the Web

Controlled environment

No-man’s land

VS

02

Page 13: Responsive Branding: Making Your Brand Interactive on the Web

“No-man’s land”

Page 14: Responsive Branding: Making Your Brand Interactive on the Web

Multi-platform design

Page 15: Responsive Branding: Making Your Brand Interactive on the Web

Responsive design

Page 16: Responsive Branding: Making Your Brand Interactive on the Web
Page 17: Responsive Branding: Making Your Brand Interactive on the Web
Page 18: Responsive Branding: Making Your Brand Interactive on the Web

—Logo evolution

“These days, people interact with Google products across many different

platforms, apps and devices…

Today we’re introducing a new logo and identity family that reflects this

reality and shows you when the Google magic is working for you, even on the

tiniest screens.”

– TA M A R Y E H O S H U A , V P, P R O D U C T M A N A G E M E N T

Page 19: Responsive Branding: Making Your Brand Interactive on the Web

—Logo evolution

“Twitter is the bird, the bird is Twitter. There’s no longer a need for text, bubbled typefaces, or a

lowercase ‘t’ to represent Twitter.”

– C R E AT I V E D I R E C T O R D O U G B O W M A N

Page 20: Responsive Branding: Making Your Brand Interactive on the Web

—Logo evolution

Why?

Page 21: Responsive Branding: Making Your Brand Interactive on the Web

—Logo evolution

They know their audience.

9 0 % O F F A C E B O O K ’ S D A I L Y A C T I V E U S E R S A C C E S S I T V I A M O B I L E

Page 22: Responsive Branding: Making Your Brand Interactive on the Web

The evolution of brands

Page 23: Responsive Branding: Making Your Brand Interactive on the Web

The effect of responsive web design on brands

is undeniable.

Page 24: Responsive Branding: Making Your Brand Interactive on the Web

THE PROCESS

Page 25: Responsive Branding: Making Your Brand Interactive on the Web

Discover

01

Define

02

Design

03

Details

04

Deliver & Distribute

05

A DA P T E D F R O M “ B R A N D E D I N T E R A C T I O N S ” B Y M A R C O S P I E S

Page 26: Responsive Branding: Making Your Brand Interactive on the Web

ExamplesL E T ’ S S E E I T I N A C T I O N

Page 27: Responsive Branding: Making Your Brand Interactive on the Web
Page 28: Responsive Branding: Making Your Brand Interactive on the Web
Page 29: Responsive Branding: Making Your Brand Interactive on the Web
Page 30: Responsive Branding: Making Your Brand Interactive on the Web
Page 31: Responsive Branding: Making Your Brand Interactive on the Web

Audience

SUCCESS

01

Brand

02

Goals

03

—3 pillars

Page 32: Responsive Branding: Making Your Brand Interactive on the Web

Know your audience.P I L L A R N U M B E R 0 1

Page 33: Responsive Branding: Making Your Brand Interactive on the Web
Page 34: Responsive Branding: Making Your Brand Interactive on the Web
Page 35: Responsive Branding: Making Your Brand Interactive on the Web

Keep your brand consistent.

P I L L A R N U M B E R 0 2

Page 36: Responsive Branding: Making Your Brand Interactive on the Web
Page 37: Responsive Branding: Making Your Brand Interactive on the Web
Page 38: Responsive Branding: Making Your Brand Interactive on the Web

Achieve your goals.P I L L A R N U M B E R 0 3

Page 39: Responsive Branding: Making Your Brand Interactive on the Web
Page 40: Responsive Branding: Making Your Brand Interactive on the Web
Page 41: Responsive Branding: Making Your Brand Interactive on the Web

SUCCESS

01

02 03

—3 pillars

What does your target audience care about?

What is the benefit for the customers for achieving the goal?

What are you trying to do (awareness, signup, purchase, etc)?

What are your values/universal truths? .

What is your brand . personality? .

Audience

Brand Goals

What are their goals and desires?

Page 42: Responsive Branding: Making Your Brand Interactive on the Web

Thank you.M A R Y R A U Z I / [email protected]

@pigeonwisdom

K AT E M AT S U DA I R A / [email protected]