design for html5 and hybrid mobile applications

Post on 28-Jan-2015

113 Views

Category:

Documents

1 Downloads

Preview:

Click to see full reader

DESCRIPTION

 

TRANSCRIPT

Source: SalesForce, Inc.

Source: TechCrunch

Design Resources● Fixed ratio bitmap

images● Small set of devices

– iPad– iPad (Retina)– iPhone– iPhone (retina)– iPhone 4”

● 9 Patch Images

– Draw9Patch● Variety of sizes

– LDPI– MDPI– HDPI– XHDPI

● HTML Canvas● CSS Sprite Sheets

Supporting Multiple Screens

Source: developer.android.com

Native Performance

Web/ Hybrid Native

Launch

Transitions

10-20 Seconds

1-2 Seconds

1-2 Seconds

Instantaneous

User Experience Design

● Visual Design– Hi Fidelity Mockups

● Illustrator● Photoshop

● User Interface– Wireframes

● Balsamiq● Axure● HotGloo

– User Testing– UI Flows

● OmniGraffle

top related