the perception of speed
TRANSCRIPT
![Page 1: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/1.jpg)
The Perceptionof Speed
@souders
![Page 2: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/2.jpg)
![Page 3: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/3.jpg)
nytimes.com/2004/02/27/nyregion/27BUTT.html
![Page 4: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/4.jpg)
2,500 of 3,250 buttons
deactivatednytimes.com/2004/02/27/nyregion/27BUTT.html
![Page 5: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/5.jpg)
on every Underground train,
the doors are operated by the
driverlondonist.com/2013/04/why-are-there-buttons-on-tube-train-doors.php
![Page 6: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/6.jpg)
![Page 7: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/7.jpg)
half the horsepower of a
Ford Fiesta
![Page 8: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/8.jpg)
nytimes.com/2012/08/19/opinion/sunday/why-waiting-in-line-is-torture.html
![Page 9: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/9.jpg)
increased distance from gate to bags
6x
nytimes.com/2012/08/19/opinion/sunday/why-waiting-in-line-is-torture.html
![Page 10: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/10.jpg)
uie.com/articles/download_time/
![Page 11: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/11.jpg)
placed mirrors & TVs in elevators &
lobbies
uie.com/articles/download_time/
![Page 12: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/12.jpg)
overestimate waittime hide length of line
nytimes.com/2012/08/19/opinion/sunday/why-waiting-in-line-is-torture.html
![Page 13: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/13.jpg)
speed
good
ness
(work)
?
![Page 14: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/14.jpg)
Creating your blog…news.ycombinator.com/item?id=2007385
![Page 15: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/15.jpg)
update coin count at slower
ratenews.ycombinator.com/item?id=2007385
![Page 16: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/16.jpg)
![Page 17: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/17.jpg)
uie.com/articles/download_time/
“Amazon.com, rated as one of the fastest sites by users, was really the slowest”
![Page 18: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/18.jpg)
![Page 19: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/19.jpg)
connectDNS time to first byte content
previous page isn’t cleared until BODY is created
click link create BODY start render
stevesouders.com/blog/2012/12/05/clear-current-page-ux/
<html><script <body><script
![Page 20: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/20.jpg)
1. tab icon
5. reload icon
2. status bar
6. network
4. progress bar
3. cursor
stevesouders.com/blog/2013/06/16/browser-busy-indicators/
Busy Indicators
![Page 21: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/21.jpg)
stevesouders.com/blog/2013/06/16/browser-busy-indicators/
testsclick link<SCRIPT ASYNC ...>dynamic script before onloaddynamic iframedynamic scriptdynamic stylesheetdynamic imagedynamic CSS background imageXHRlong JS execution
![Page 22: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/22.jpg)
stevesouders.com/blog/2013/06/16/browser-busy-indicators/
testsclick link<SCRIPT ASYNC ...>dynamic script before onloaddynamic iframedynamic scriptdynamic stylesheetdynamic imagedynamic CSS background imageXHRlong JS execution
}}
sync UX
async UX
no busy indicators
![Page 23: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/23.jpg)
Google Plus
WebView:non-standard busy indicators!
![Page 24: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/24.jpg)
Native Apps:
no busy indicators!
![Page 25: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/25.jpg)
![Page 26: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/26.jpg)
play.google.com/store/apps/details?id=com.linkbubble.playstore
![Page 27: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/27.jpg)
play.google.com/store/apps/details?id=com.linkbubble.playstore
![Page 28: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/28.jpg)
“natural” progress indicators
![Page 29: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/29.jpg)
![Page 30: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/30.jpg)
![Page 31: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/31.jpg)
optimistic actions
Instagram• “Like” button changes
immediately• server update happens in
background lukew.com/ff/entry.asp?1759
![Page 32: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/32.jpg)
skeleton screens
blank page that is gradually filledlukew.com/ff/entry.asp?1797
![Page 33: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/33.jpg)
![Page 34: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/34.jpg)
![Page 35: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/35.jpg)
![Page 36: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/36.jpg)
![Page 37: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/37.jpg)
![Page 38: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/38.jpg)
![Page 39: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/39.jpg)
“PerceptionBrokers!”
![Page 40: The Perception of Speed](https://reader036.vdocuments.site/reader036/viewer/2022062523/53f5080e8d7f7297528b8dae/html5/thumbnails/40.jpg)
Steve Souders@souders