Transcript
Page 1: Anatomy of an App | Interface Skins

Anatomy of An App Navigation with Interface Skins

Page 2: Anatomy of an App | Interface Skins

Tab Strip Aid navigation with tabs that enable swiping through related slides

Page 3: Anatomy of an App | Interface Skins

Tab Strip

Page 4: Anatomy of an App | Interface Skins

Tab Strip

Page 5: Anatomy of an App | Interface Skins

Function Skin Access built-in functions such as MyApps, App Menu, Content Map, Customer, Library, Close, and Home

Page 6: Anatomy of an App | Interface Skins

Function Skin

Page 7: Anatomy of an App | Interface Skins

Function Skin

Close | Library | Home Customer | MyApps

Page 8: Anatomy of an App | Interface Skins

Categories & Tabs Skin Organize a large amount of content based on categories and topics to aid navigation throughout your app

Page 9: Anatomy of an App | Interface Skins

Tabs

Categories

Page 10: Anatomy of an App | Interface Skins

Tabs

Categories

Page 11: Anatomy of an App | Interface Skins

Graphic Skin Navigation buttons can be any shape and placed anywhere

Page 12: Anatomy of an App | Interface Skins

Graphic Skin

Page 13: Anatomy of an App | Interface Skins

Graphic Skin

Page 14: Anatomy of an App | Interface Skins

Segmented Skin Used when different segments of an app require different forms of navigation

Page 15: Anatomy of an App | Interface Skins

Segmented Skin

Page 16: Anatomy of an App | Interface Skins

Segmented Skin

Page 17: Anatomy of an App | Interface Skins

Hidden Skin Hide your skin buttons to create a clean and less distracting interface

Page 18: Anatomy of an App | Interface Skins

Hidden Skin (hidden)

Page 19: Anatomy of an App | Interface Skins

Hidden Skin (revealed)

Page 20: Anatomy of an App | Interface Skins

Hidden Skin (revealed)

Page 21: Anatomy of an App | Interface Skins

Environment Skin Build app navigation into the environment with skeuomorphic design (meaning that design mimics reality)

Page 22: Anatomy of an App | Interface Skins

Environment Skin

Page 23: Anatomy of an App | Interface Skins

Environment Skin

Page 24: Anatomy of an App | Interface Skins

Kinetic Skin Move skin around all four edges of the frame without disrupting the layout or the user experience

Page 25: Anatomy of an App | Interface Skins

Kinetic Skin

Page 26: Anatomy of an App | Interface Skins

Kinetic Skin

Page 27: Anatomy of an App | Interface Skins

Kinetic Skin

Page 28: Anatomy of an App | Interface Skins

Drop-Down Skin Create drop-down menu for navigating to different parts of app

Page 29: Anatomy of an App | Interface Skins

Drop-Down Skin

Page 30: Anatomy of an App | Interface Skins

Drop-Down Skin

Page 31: Anatomy of an App | Interface Skins

Drop-Down Skin

Page 32: Anatomy of an App | Interface Skins

For More Information Please contact us at [email protected]


Top Related