web design - visual decisions & user experience

34
web design visual decisions & user experience

Upload: blend-interactive

Post on 11-Jun-2015

300 views

Category:

Design


2 download

DESCRIPTION

The design portion of the talk "Planning a Website: Design, Content, & Development", presented by Karla Santi.

TRANSCRIPT

Page 1: Web Design - Visual Decisions & User Experience

web design

visual decisions & user experience

Page 2: Web Design - Visual Decisions & User Experience

who am I ?

Page 3: Web Design - Visual Decisions & User Experience

the project process

sales cs design

front-end dev

development

QA/testing launch

Page 4: Web Design - Visual Decisions & User Experience

the design process

● mood boards

Page 5: Web Design - Visual Decisions & User Experience
Page 6: Web Design - Visual Decisions & User Experience
Page 7: Web Design - Visual Decisions & User Experience
Page 8: Web Design - Visual Decisions & User Experience

the design process

● mood boards

● static mocks

Page 9: Web Design - Visual Decisions & User Experience
Page 10: Web Design - Visual Decisions & User Experience

the design process

● mood boards

● static mocks

● client feedback

Page 11: Web Design - Visual Decisions & User Experience
Page 12: Web Design - Visual Decisions & User Experience

the design process

● mood boards

● static mocks

● client feedback

● front-end development

● design QA

Page 13: Web Design - Visual Decisions & User Experience

the evolving process

● mobile first design

● interactive mock-ups

● new tools = new methods

Page 14: Web Design - Visual Decisions & User Experience

what makes “good” web design?

Page 15: Web Design - Visual Decisions & User Experience

tastes evolve

● “Flashy” sites were cool

Page 17: Web Design - Visual Decisions & User Experience

tastes evolve

● “Flashy” sites were cool

● being unique was a must

Page 18: Web Design - Visual Decisions & User Experience
Page 19: Web Design - Visual Decisions & User Experience

tastes evolve

● “Flashy” sites were cool

● being unique was a must

● background music!!

● load intro...

Page 20: Web Design - Visual Decisions & User Experience

today’s expectations

● users want familiarity

○ buttons, menus, interactions

○ usability

Page 21: Web Design - Visual Decisions & User Experience
Page 22: Web Design - Visual Decisions & User Experience

today’s expectations

● users want familiarity

○ buttons, menus, interactions

○ usability

● heat mapping & analytics

Page 23: Web Design - Visual Decisions & User Experience
Page 24: Web Design - Visual Decisions & User Experience

today’s expectations

● users want familiarity

○ buttons, menus, interactions

○ usability

● heat mapping & analytics

● unique to the brand

Page 25: Web Design - Visual Decisions & User Experience

basic design principles

● less is more

○ simple is hard

Page 26: Web Design - Visual Decisions & User Experience
Page 27: Web Design - Visual Decisions & User Experience
Page 28: Web Design - Visual Decisions & User Experience

basic design principles

● less is more

○ simple is hard

● typography matters

Page 29: Web Design - Visual Decisions & User Experience

“95% of the information on the web is written language. It is only logical to say

that a web designer should get good training in the main discipline of shaping

written information, in other words: Typography.” - Oliver Reichenstein

Page 30: Web Design - Visual Decisions & User Experience

basic design principles

● less is more

○ simple is hard

● typography matters

● typography vs. typeface

Page 31: Web Design - Visual Decisions & User Experience

basic design principles

● color palette

○ Adobe Kuler

○ set styles across site

● white space

● grid systems

Page 32: Web Design - Visual Decisions & User Experience

tools & applications

Page 33: Web Design - Visual Decisions & User Experience

themes & hosted sites

● purchased CMS themes

● hosted subscriptions

Page 34: Web Design - Visual Decisions & User Experience

thank you

[email protected]