So many posibillitys …
So many posibillitys …
… but use only some of it.
Tap To press or select a control or item
Drag To scroll or pan.
Flick To scroll or pan quickly.
Swipe In a table-view row, to reveal the Delete button.
Double tap To zoom in and center a block of content or an
image. To zoom out (if already zoomed in).
Pinch open To zoom in.
Pinch close To zoom out.
Touch and hold In editable text, to display a magniﬁed view for
(Standard Gestures in the iOS,
Source Apple iPhone Human Interface Guidelines)
You need a concept ...
• Web-only Content:
Web applications, Optimized webpages,
… and emotional Interfaces.
• Interface should based on the way people think and
work, not on the capabilities of the device.
• Model your application’s objects and actions on objects and
actions in the real world.
• Direct manipulation means that people feel they are
controlling something tangible, not abstract.
• Applications should respond to every user action
with some visible change
• Hardware accelerated rendering is not always
• Avoid morphing shapes as these have to be rendered
on each „frame“ (expensive)
• Complex or ﬁnely structured shapes are more
expensive to render than large simple shapes
• Avoid large changes in scale
• Avoid default bitmap ﬁll mode
• Simplify vector graphics
• Avoid ﬁlters
• Carefully picking bitmap sizes if content will need to
be sized down…
• …but ideally, the content would always be 'right-sized'
(E.g. capture touch-events)
touchstart for ﬁnger MozTouchDown
Sent when the ﬁrst ﬁnger touches the surface.
Sent when the user beings a screen touch action.
Sent when the second ﬁnger touches the surface. MozTouchMove
touchstart for ﬁnger
Sent when the user moves his ﬁnger on the touch screen.
Sent immediately after gesturestart when the second ﬁnger
touches the surface.
gesturechange for current gesture.
Sent when both ﬁngers move while still touching the surface. Sent when the user lifts his ﬁnger off the screen.
Sent when the second ﬁnger lifts from the surface.
touchend for ﬁnger
Sent immediately after gestureend when the second ﬁnger lifts
from the surface.
• The users expects a „snappy“ interface
• Expect to spend a lot of extra time on this
• Keep it simple and stupid
• Try to preload data in a intelligent way
• Do tests on the actual device
„If you want to adress touch-enabled devices today and
aim at a „small“ application go for HTML5“
„For large, feature-rich (& responsive) apps go for
(or think of crosscompiling)“
Follow me: www.x ing.com/profile/Robe
www.t witter.com/reimark or
or r.zinn email@example.com
A particular slide catching your eye?
Clipping is a handy way to collect important slides you want to go back to later.