We’ve entered the age of sequential and simultaneous browsing. According to Google, 90% of consumers now use multiple screens to accomplish tasks on the web. Tablets and mobile remain hot topics for sales, use, and design. In an age where most users are accessing sites via multiple devices, top companies are focusing on fast and clean delivery of information.
This webinar focused on how new realities are changing web design, web design process, and usability standards.
Session Outline
• Ubiquitous computing, ubiquitous internet
• Sequential and simultaneous browsing
• The rise of the tablet
• Flat design for a lumpy web
• Speed matters
• Usability strategies
14. 0
22.5
45
67.5
90
Americas Asia Pacific Middle East Africa
source: ITU
+28%
+45%
+55%
+82%
Americas
Asia-Pacific
Middle East
Africa
Where is the biggest growth
in mobile broadband?
19. “The technology required for ubiquitous
computing: cheap, low-power computers that
include equally convenient displays...”
--Mark Weiser of Xerox PARC
20. Aakash Ubislate tablet
$69 ($20 for students in India)
Archos 35 Carbon smartphone
$120
Cheap devices and displays for browsing
21. Lower quality displays that display limited information
Pebble smartwatch
$150
Fitbit Zip fitness data collector
$60
22. In some objects, sensors + connectivity matter more than display
Fitbit Aria
transmits weight to app
Parrot Flower Power
transmits plant
data to app
23. 6 basic screen
sizes* for 22 of
the most popular
tablets
1200 x 1920
800 x 1280
768 x 1280
600 x 1024
600 x 800
1536 x 2046
Screensiz.es
24. 1200 x 1920
800 x 1280
768 x 1280
600 x 1024
600 x 800
1536 x 2046
1200x1920
800x1280
768x1280
600x1024
600x800
1536x2046
6 basic screen
sizes* for 22 of
the most popular
tablets
Screensiz.es
38. The primary purpose of a prototype
is to get to better, more useful work.
REMEMBER!
39. The primary purpose of a prototype
is to get to better, more useful work.
client educationbuy-in iterative building
early user testing visualizing content strategy
40. The primary purpose of a prototype
is to get to better, more useful work.
IT’S CRAP!
41. Ask your clients to focus on the
reading experience and typography
as the most important design choice.
60. Use bigger touch target areas to accommodate finger / thumb input.
Example: Good.is
MIT research
showed the average
fingertip is
8 to 10 mm.
~7 to 9 mm
minimum
recommended
based on
manufacturer.
83. Thanks to Erik Runyon,
Director of Web Communications at Notre Dame,
for the examples and data.
Check out his blog and Higher Education RWD Directory at weedygarden.net.
84. Further reading on web performance:
www.stevesouders.com
www.igvita.com
www.dmolsen.com
93. Pros:
Works remotely
Cons:
Doesn’t
work for mobile
Hack:
Ask your desktop users
to make the browser
mobile-sized
This hack exposes
some design flaws, but
does not offer insight
about touch input.
97. 1. User joins gotomeeting or
other screen sharing software
via laptop.
2. User shares laptop camera.
3. User “reverse hugs” laptop,
pointing laptop camera at
mobile device
98. To embrace the complexity of the multi-device
web, design and test for speed and simplicity.