Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Creating Wonderful Web App User Experience
Search
Richard Shepherd
May 16, 2012
Technology
7
4.9k
Creating Wonderful Web App User Experience
Slides from my presentation at the Future of Web Design London 2012.
Richard Shepherd
May 16, 2012
Tweet
Share
Other Decks in Technology
See All in Technology
サーバーレスアーキテクチャと生成AIの融合 / Serverless Meets Generative AI
_kensh
12
3k
Larkご案内資料
customercloud
PRO
0
600
急成長する企業で作った、エンジニアが輝ける制度/ 20250214 Rinto Ikenoue
shift_evolve
2
880
Ask! NIKKEI RAG検索技術の深層
hotchpotch
13
2.8k
家電アプリ共通PF "Linova" のAPI利用とPostman活用事例ご紹介
yukiogawa
0
130
事業継続を支える自動テストの考え方
tsuemura
0
300
飲食店予約台帳を支えるインタラクティブ UI 設計と実装
siropaca
6
1.4k
Data-centric AI入門第6章:Data-centric AIの実践例
x_ttyszk
1
370
Ask! NIKKEIの運用基盤と改善に向けた取り組み / NIKKEI TECH TALK #30
kaitomajima
1
450
自動テストの世界に、この5年間で起きたこと
autifyhq
10
7.1k
組織貢献をするフリーランスエンジニアという生き方
n_takehata
1
1k
オブザーバビリティの観点でみるAWS / AWS from observability perspective
ymotongpoo
7
1k
Featured
See All Featured
Making the Leap to Tech Lead
cromwellryan
133
9.1k
Building Adaptive Systems
keathley
40
2.4k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.5k
Building Your Own Lightsaber
phodgson
104
6.2k
Code Review Best Practice
trishagee
66
17k
The Invisible Side of Design
smashingmag
299
50k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
630
How to train your dragon (web standard)
notwaldorf
90
5.8k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
20
2.4k
Visualization
eitanlees
146
15k
Transcript
Crea ng Wonderful User Experience Web App
Hello! I’m Richard @richardshepherd
I’m frontend lead
I’m a contributor to
None
Why is great user experience important? ?
If you make chairs, you’ll want to understand how people
sit. If you make user interfaces, then you should understand how people perceive and think.” Ryan Singer, 37 Signals “
Hacking the brain
None
None
Marty Sklar
Mickey’s Ten Commandments Of Disney Imagineering
#1 Know Your Audience Mickey’s Ten Commandments Of Disney Imagineering
#2 Wear Your Guest’s Shoes Mickey’s Ten Commandments Of Disney
Imagineering
#1 Know your audience
Emo onal Memory #1 Know your audience
Humanise your applica on #2 Wear your guests shoes
http://getpocket.com/ #2 Wear your guests shoes
http://www.rdio.com/ #2 Wear your guests shoes
http://simplehoney.com/ #1 Know your audience
http://simplehoney.com/ #1 Know your audience
http://simplehoney.com/ #1 Know your audience
#3 Organise the Flow of People And Ideas Mickey’s Ten
Commandments Of Disney Imagineering
Everything we do is a form of storytelling” Mark Rollins
– Creative Director, Iconologic Creative Mornings “ #3 Organise the Flow of People and Ideas
What’s Your Story? ? #3 Organise the Flow of People
and Ideas
#3 Organise the Flow of People and Ideas
#3 Organise the Flow of People and Ideas http://mailchimp.com/ http://wufoo.com/
#3 Organise the Flow of People and Ideas
#3 Organise the Flow of People and Ideas http://mailchimp.com/ http://www.surveymonkey.com/
#3 Organise the Flow of People and Ideas
http://aarronwalter.com/ #3 Organise the Flow of People and Ideas
#4 Create a ‘Wienie’ Mickey’s Ten Commandments Of Disney Imagineering
#5 Communicate with visual Literacy Mickey’s Ten Commandments Of Disney
Imagineering
http://www.alistapart.com/… #5 Communicate with Visual Literacy
Don Norman #5 Communicate with Visual Literacy
Attractive things make people feel good, which in turn makes
them think more creatively. How does that make something easier to use? Simple, by making it easier for people to find solutions to the problems they encounter.” Don Norman “ #5 Communicate with Visual Literacy
Depth vs. Breadth Processing #5 Communicate with Visual Literacy
Depth First “Where me keys? Where me phone?” #5 Communicate
with Visual Literacy
#5 Communicate with Visual Literacy http://www.basecamp.com/…
#5 Communicate with Visual Literacy http://www.basecamp.com/…
Breadth First A hit of dopamine #5 Communicate with Visual
Literacy
#5 Communicate with Visual Literacy http://plus.google.com/
#6 Avoid Overload Create Turn ons Mickey’s Ten Commandments Of
Disney Imagineering
#7 Tell One Story at a Time Mickey’s Ten Commandments
Of Disney Imagineering
http://www.lingscars.com/ #7 Tell One Story at the Time #7 Tell
One Story at a Time http://www.lingscars.com/
The Paradox of Choice #7 Tell One Story at a
Time
Barry Schwartz #7 Tell One Story at a Time
#7 Tell One Story at a Time http://www.flickr.com/
http://www.lingscars.com/ #7 Tell One Story at the Time #7 Tell
One Story at a Time http://www.ebookers.com/
http://www.lingscars.com/ #7 Tell One Story at the Time #7 Tell
One Story at a Time http://www.skyscanner.net/
Crea ng Turn Ons No. Not that kind. #6 Avoid
Overload, Create Turn Ons
http://www.vouchercodes.co.uk #6 Avoid Overload, Create Turn Ons
http://www.kickstarter.com #6 Avoid Overload, Create Turn Ons
http://www.mailchimp.com #6 Avoid Overload, Create Turn Ons
#8 Avoid Contradic ons, Maintain Iden ty Mickey’s Ten Commandments
Of Disney Imagineering
Beyond The Browser Maintaining your identity #8 Avoid Contradic ons,
Maintain Iden ty
http://www.mrporter.com/ #8 Avoid Contradic ons, Maintain Iden ty
#8 Avoid Contradic ons, Maintain Iden ty
#8 Avoid Contradic ons, Maintain Iden ty
#9 For every ounce of treatment, provide a tonne of
treat Mickey’s Ten Commandments Of Disney Imagineering
Give a li le #9 For every ounce of treatment,
provide a tonne of treat
#9 For every ounce of treatment, provide a tonne of
treat http://www.codecademy.com/
#9 For every ounce of treatment, provide a tonne of
treat http://www.codecademy.com/
#10 Keep It up! Mickey’s Ten Commandments Of Disney Imagineering
Ask for feedback #10 Keep It Up!
User Experience and Business Experience #10 Keep It Up!
UX is not part of the process. It is the
process. #10 Keep It Up!
The killer feature is making calls.” Steve Jobs – iPhone
launch “ #10 Keep It Up!
Ques on Everything #10 Keep It Up!
Knowing when any technique is appropriate — and when it
isn’t — marks a pragmatic, measured approach to designing for the web, and that’s a perspective I really treasure...” Ethan Marcotte “ #10 Keep It Up!
Why is great user experience important?
Aim for excellence Final thought...
OmooHQ.com/fowd Beta Pass... Exclusive
Thank You. Now, go be Awesome :) @richardshepherd Keep in
touch!