2. Who’s that girl?
Front-end dev and designer with 7
years of experience. Earlier worked
at AdTaily and Applicake. Currently
@XHTMLized.
karolinaszczur
3. 1. Understanding mobile context
2. Becoming responsive
3. Managing content
4. Usable mobile design patterns
5. Let’s talk some numbers
• by 2014 mobile internet usage should exceed
desktop internet usage
• smartphone owners outnumbered other mobile
users in US
• Nokia 35%, Apple 30%, Samsung 15%, RIM
8%, HTC 3.5%, Google 0.3%
Source: ComScore reports, TechCrunch
6. • 61% customers who visit a unfriendly site go to
the competition
• 55% increase in smartphone subscriptions in US
making it 98mln users
• 425 milion mobile Facebook users monthly
Source: shapshop.com/2012-mobile-marketing-statistics
8. Apple
• 7% of overall iPad traffic comes from „the new”
iPad
• iPhones take 3 top places in US, and 3 out of 5 in
EU5 countries
• 60% of connected devices traffic in US comes
from iPods, iPhones and iPads
• iPhone 4 ranked as top acquired phone in US/
EU5 in 2011
Source: ComScore
9. Google
• Andoid tablets have 27% market share
• Half milion Android devices sold daily according
to Andy Rubin
• Android outnumbered iPhone in US
• Most popular OS - Android 2.3.3 - 2.3.7
Gingerbread with 61.5% distribution
Source: ComScore
25. In the web industry, anything that
conveys meaningful information to
humans is called „content”.
”
Erin Kissane, The Elements of Content Strategy (A Book Apart)
26. Content strategy plans for the
creation, publication, and governance
of useful, usable content.
”
Kristina Halvorson, The Discipline of Content Strategy (A List Apart)
48. Mobile typography
Mobile and small screen design is
largely about communicating
information to the user.
”
Steven Hoober, Designing Mobile Interfaces (O’Reilly)
49. Fonts breakdown
• Arial, Baskerville, Bodoni, Courier New, Georgia, Helvetica,
Trebuchet, Verdana for iOS
• Droid fonts, Roboto for Android
• Arial, Comic Sans, Georgia, Impact, Tahoma, Times New Roman,
Verdana, Windings for Blackberry
50. Webfonts
• Not so good JS performance • Some fonts won’t work on
• No Blackberry support iOS 4 and below
• Cannot download fonts
• Pricing plans and their
limitations
51. The anatomy of type
Source: ad74.co.uk/good_to_know/anatomy_of_type.html
52. Rules
• Unstressed forms
• No excessive descenders
• Space efficiency
• Include italics
• 50-60 chars per line
71. Recommended reading
• Cloud Four blog
• Quirksmode
• Brad Frost blog
• Designing Mobile Interfaces from O’Reilly
• Filament group blog
• Luke Wroblewski blog