wordcamp phoenix - wordpress design for the real world v2

28
WPDFTRW WORDPRESS DESIGN FOR THE REAL WORLD (UX) CODY // LANDEFELD Sunday, January 20, 13

Upload: cody-landefeld

Post on 27-Jan-2015

112 views

Category:

Documents


0 download

DESCRIPTION

Slides from a recent talk regarding User Experience Design for WordPress.

TRANSCRIPT

Page 1: WordCamp Phoenix - WordPress Design for the Real World v2

WPDFTRWWORDPRESS DESIGN FOR THE REAL WORLD (UX)

CODY // LANDEFELD

Sunday, January 20, 13

Page 2: WordCamp Phoenix - WordPress Design for the Real World v2

CODY LANDEFELDOWNER/DIRECTOR AT CODYL

10+ YEARS BUILDING FOR THE WEB7+ YEARS BUILDING WITH WORDPRESS

PHOENIX, AZ // CODYL.COM // @CODYL

Sunday, January 20, 13

Page 3: WordCamp Phoenix - WordPress Design for the Real World v2

+ WHAT’S UX FOR?+ DEVICES

+ GOALS OF UX+ EXAMPLES

WHAT’S AHEAD?

Sunday, January 20, 13

Page 4: WordCamp Phoenix - WordPress Design for the Real World v2

WHO IS IT FOR // WHAT IS IT // WHAT DOES IT DO?

WHAT’S USER EXPERIENCE FOR?

Sunday, January 20, 13

Page 5: WordCamp Phoenix - WordPress Design for the Real World v2

IT’S FOR USERS...

PHOENIX, AZ // CODYL.COM // @CODYL

Sunday, January 20, 13

Page 6: WordCamp Phoenix - WordPress Design for the Real World v2

Websites // Applications // Things You Use & Touch

...OF DEVICES

Sunday, January 20, 13

Page 7: WordCamp Phoenix - WordPress Design for the Real World v2

Things we interact with...daily (mostly on the web).

COMPUTERSTABLETSPHONES

COFFEE MAKERSCASH REGISTERS

WHAT DO YOU THINKUX IS FOR?

Sunday, January 20, 13

Page 8: WordCamp Phoenix - WordPress Design for the Real World v2

How the web is consumed on devices

MOBILE DEVICES

PHOENIX, AZ // CODYL.COM // @CODYL

Sunday, January 20, 13

Page 9: WordCamp Phoenix - WordPress Design for the Real World v2

Around 7,000 devices access Facebook daily.More than 90% have a mobile web browser.

-Techcrunch

HOW IMPORTANT ARE DEVICES, SPECIFICALLY MOBILE?

Sunday, January 20, 13

Page 10: WordCamp Phoenix - WordPress Design for the Real World v2

The web will continue to be delivered onto all of our daily devices and become more seamlessly integrated into our lives.

NOT JUST MOBILE...

Sunday, January 20, 13

Page 11: WordCamp Phoenix - WordPress Design for the Real World v2

Usability is as important as performance. It must be more usable and it must perform better.

ON EVERY DEVICE.

UX NEEDS TO LOOK GOOD / PERFORM & SCALE

Sunday, January 20, 13

Page 12: WordCamp Phoenix - WordPress Design for the Real World v2

WHAT DO YOU WANT TO ACHIEVE?

GOALS OF UX

Sunday, January 20, 13

Page 13: WordCamp Phoenix - WordPress Design for the Real World v2

WHAT ARE YOU SHOOTING FOR?E-Commerce // Marketing // Interactive

PHOENIX, AZ // CODYL.COM // @CODYL

Sunday, January 20, 13

Page 14: WordCamp Phoenix - WordPress Design for the Real World v2

How do users use your site? How does that impact how you create your site?

Some sites are primarily used mobile / some desktop.

KNOW THE AUDIENCE

Sunday, January 20, 13

Page 15: WordCamp Phoenix - WordPress Design for the Real World v2

ETSY // Does Desktop and Mobile with complete experience and specific for each audience.

EXAMPLE

Sunday, January 20, 13

Page 16: WordCamp Phoenix - WordPress Design for the Real World v2

ETSY

Sunday, January 20, 13

Page 17: WordCamp Phoenix - WordPress Design for the Real World v2

Consider how people use the site per device and how that should be though through from the concept phase

on through development.

Most often going with a Responsive grid will be the way to go. The few cases this is not true might be in E-

Commerce.

TAKEAWAY

Sunday, January 20, 13

Page 18: WordCamp Phoenix - WordPress Design for the Real World v2

DON’T INTERRUPT THE USERUser, Imma let you finish...

PHOENIX, AZ // CODYL.COM // @CODYL

Sunday, January 20, 13

Page 19: WordCamp Phoenix - WordPress Design for the Real World v2

Know exactly why you intend to use Responsive grids and layouts. Consider how it impacts the user.

Use analytics for data from the past and use projections to predict the future...

KNOW THE REASON

Sunday, January 20, 13

Page 20: WordCamp Phoenix - WordPress Design for the Real World v2

IT’S NOT ALL ABOUT MONEYIt’s about the experience...

PHOENIX, AZ // CODYL.COM // @CODYL

Sunday, January 20, 13

Page 21: WordCamp Phoenix - WordPress Design for the Real World v2

“You have to have the perspective of an audience that may not know your brand, and there's very often a

complete absence of making people aware of your brand is, and why it's relevant."

-Sean Ketchem (from INC)

ADDRESS THE REAL NEED

Sunday, January 20, 13

Page 22: WordCamp Phoenix - WordPress Design for the Real World v2

YOU WANT TO SEE THE GOODS?EXAMPLES OF GREAT UX

Sunday, January 20, 13

Page 23: WordCamp Phoenix - WordPress Design for the Real World v2

CAMAYAK

Sunday, January 20, 13

Page 24: WordCamp Phoenix - WordPress Design for the Real World v2

BEETLE

Sunday, January 20, 13

Page 25: WordCamp Phoenix - WordPress Design for the Real World v2

DESK

Sunday, January 20, 13

Page 26: WordCamp Phoenix - WordPress Design for the Real World v2

+ WHAT’S UX FOR?+ DEVICES

+ GOALS OF UX+ EXAMPLES

WHAT’S BEHIND?

Sunday, January 20, 13

Page 27: WordCamp Phoenix - WordPress Design for the Real World v2

THANKS...

Sunday, January 20, 13

Page 28: WordCamp Phoenix - WordPress Design for the Real World v2

CODY LANDEFELDOWNER/DIRECTOR AT CODYL

10+ YEARS BUILDING FOR THE WEB7+ YEARS BUILDING WITH WORDPRESS

PHOENIX, AZ // CODYL.COM // @CODYL

SLIDES AVAILABLE AT HTTP://CODYL.COM/BLOG

Sunday, January 20, 13