mobile ux design workshop

MOBILE USER INTERFACE DESIGN

VINCE BASKERVILLE DIRECTOR, USER EXPERIENCE @CALLRAIL

DESIGNING FOR MOBILE

vince baskerville | @whoisvince#mobileUX

LEARNING OBJECTIVES

‣Discuss the considerations designers need to take into account when designing for mobile experiences

‣Understand how to design simple, but powerful interfaces for mobile screens


MOBILE FIRST OR RESPONSIVE WEB DESIGN?

Throughout the design process, our work should be situated in the context where it will be used


A FOCUS ON CONSTRAINTS

• Forces us to keep content relevant

• No hover — information needs to be at-the-ready

• Speed! Speed! Speed!

• Context matters


INNOVATING CAPABILITIES

• Touch

• Location

• Orientation

• Voice

• Gesture


INFORMATION ARCHITECTURE

DESIGN FOR OPPOSABLE THUMBS

44pts


points vs pixels


¯\_(ツ)_/¯



http://lmgtfy.com/?q=points+vs+pixels

BAD EXAMPLES

GOOD EXAMPLES

http://pttrns.com

ENGAGEMENT LOADS

3 ENGAGEMENT LOAD TYPES


Cognitive Visual Motor

COGNITIVE


In relation to thinking and the users memory; high human energy & attention

VISUAL


Pertaining to the users perceiving, noticing the interface flow

MOTOR


Physical actions; using the keyboard, taping, scrolling, pinching, zooming, etc


cognitive loads are the *most expensive* — take lots of human energy

while motor loads are least expensive


when you lower all the loads you are also lowering engagement and entertainment.

STAY CLASSY

mobile ux design workshop

Design

mobileuxvince baskerville

mobilevince baskerville

expensivevince baskerville

mobileux44ptsvince baskerville

usedvince baskerville

etcvince baskerville

mobileuxcognitive loads

mobile experiences