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
No Modes – The Future of all Web Applications
Search
Andrew Cassell
May 22, 2014
Design
1
490
No Modes – The Future of all Web Applications
Andrew Cassell
May 22, 2014
Tweet
Share
More Decks by Andrew Cassell
See All by Andrew Cassell
Immutability to Save an Ever-Changing World
cassell
0
34
Immutability to Save an Ever-Changing World
cassell
0
10
Domain-driven Design Workshop
cassell
1
250
Immutability to save an ever-changing world
cassell
3
460
Introduction to Domain-Driven Design in PHP - ZendCon & OpenEnterprise 2018
cassell
3
690
Immutability to Save an Ever-Changing World - PHP Benelux 2018
cassell
1
550
Domain-driven Design in PHP - PHP Benelux 2018
cassell
1
150
php[world] 2017 Domain-Driven Design Workshop
cassell
1
280
Domain-Driven Design
cassell
2
860
Other Decks in Design
See All in Design
Памятка-раздатка по Карте процесса-опыта, А4
ashapiro
1
410
アフォーダンスとシグニファイア
ryokanakai
1
320
ビジョン実現を加速させるデザインプログラムマネージャーの視座とキャリア/ Designship2024_Sato
root_recruit
0
170
デザインシステム構築の進め方 基本から実践まで、具体的な手順を徹底解説
ncdc
1
210
Картирование процесса фасилитация стратсессий с Картой гипотез при помощи Карты процесса-опыта
ashapiro
0
400
Managing Design Systems (Smashing NY 2024)
nathanacurtis
2
300
デザイナー視点の体験設計とデザインレビューを事業部全員で体験するワークショップをしたお話
masayofff
3
200
コンセプトで経営・事業・組織を動かす、 Ameba20周年ブランディング / ameba-20th-branding
cyberagentdevelopers
PRO
1
300
エムスリー株式会社 デザイングループ紹介資料 / m3design-team-profile
m3designer
0
4.7k
ABEMAの進化 – 複雑化したコンテンツ構造とUI改善への道 – / abema-ui-improve
cyberagentdevelopers
PRO
2
410
Charcoal 2.0: デザインシステムの基盤を再構築
godlingkogami
1
440
デザインスプリントを活かすチームの在り方
mixi_design
PRO
2
790
Featured
See All Featured
Code Reviewing Like a Champion
maltzj
520
39k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5k
Practical Orchestrator
shlominoach
186
10k
A Philosophy of Restraint
colly
203
16k
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
GraphQLとの向き合い方2022年版
quramy
43
13k
Automating Front-end Workflow
addyosmani
1366
200k
Site-Speed That Sticks
csswizardry
0
24
Happy Clients
brianwarren
98
6.7k
Intergalactic Javascript Robots from Outer Space
tanoku
269
27k
Art, The Web, and Tiny UX
lynnandtonic
297
20k
Transcript
! The Future of Web Applications No Modes Andrew Cassell
@alc277
Interaction UI UX
“Since humans are more pliable than computers, it can be
easier to make a human fit the computer’s limitations than to design the computer to fit the human’s needs. When that happens, the human becomes a prisoner trapped by the computer rather than liberated by it.” - Karla Jennings 3
4
Modes
None
“It is no accident that swearing is denoted by #&%!#$&.
It’s what a typewriter used to do when you typed numbers when the Caps Lock was engaged.” - Dr. James Winter
O I
Those who cannot learn from history are doomed to repeat
it. - George Santayana
What experience and history teach is this — that nations
and governments have never learned anything from history… - Hegel
None
None
None
None
None
None
Modeless
None
None
None
None
None
None
None
vi
None
emacs
None
None
SEARCH
None
None
None
None
None
Quasimode
None
REALITY
CARS
None
None
None
None
None
None
None
GUNS
None
None
None
modes in web 1.0
None
Edit
None
Save
None
Context
Modal
Modal
Modal
Interfaces must be designed to accommodate our ability to pay
conscious attention to only one object or situation, called our locus of attention, at a time. - Jef Raskin
None
None
None
None
None
None
Mode Error
Modes are a significant source of errors, confusion, unnecessary restrictions,
and complexity in interfaces. - Jef Raskin
None
None
! Imagine if every Thursday your shoes exploded if you
tied them the usual way. This happens to us all the time with computers, and nobody thinks of complaining. - Jef Raskin
REALITY (another dose)
None
None
None
MODES SUCK
None
Modals for Good : (
None
None
No Take Backsies
Take Bathroom Selfie?
Modal Alternative?
Popovers
Example
We learn by example and by direct experience because there
are real limits to the adequacy of verbal instruction. - Malcolm Gladwell
None
None
None
1.)Edit/POST
None
None
None
2.) Modals
None
Define Task APIs
None
3.) Popover
None
4.) Bring Features out of a Mode
None
None
None
4.) Quasimode (Drag & Drop)
sortable
None
None
5.) Undo
None
None
None
6.) Edit in Place
None
None
None
<span contenteditable="true">Description</span>
7.) UI Quasimode (Panel)
None
None
alistapart.com
None
None