Retail Catalog App Wireframes

1. Home Loading Screen
Press/Hold - Plays Intro Video
Single Tap - Displays Toolbars
1
Swipe left/right - Navigate
to the next/previous screen

2. Single Tap - Hides Toolbars
Buttons: Previous, Home, Grid, View Bag, Page Info, Next
1
Home Loading Screen w/ Toolbars

3. Catalog Menu / TOC Screen
Single Tap - Displays Toolbars
1 Browse Catalog
Try on a Watch
Store Locator
Fossil Blog
Current Promotion
Fossil Video
Shop Fossil.com
Press/Hold - TOC Links
1
Swipe left/right - Navigate
to the next/previous screen

4. Scroll indicator displays
during scroll and hides after
typical delay.
All Pages Grid View
Swipe up/down - Scroll
more pages on to screen
Single press/hold - loads
the catalog page view.
1

5. Catalog Standard Page
Single Tap - Displays Toolbars
1
Press/Hold - Page Info
1
Swipe left/right - Navigate
to the next/previous screen
Pinch
Zoom

6. Buttons: Previous, Home, Grid, View Bag, Page Info, Next
Catalog Standard Page w/ Toolbars
Single Tap - Hide Toolbars
1
Press/Hold = Page Info
1
Swipe left/right - Navigate
to the next/previous screen

7. Scroll indicator displays
during scroll and hides after
typical delay.
Buttons here display a new
view or modal dialogue
as appropriate.
$54.00
Jewel Top Long Name
Buy Now
$54.00
Jewel Top Long Name
Buy Now
Catalog Products Listing View
Buy Now Try it On!
$105.00
Allie White Chronograph
Swipe up/down - Scroll
more products on to screen

8. Catalog Product Webkit View
Swipe up/down - Scroll
more products on to screen
Scroll indicator displays
during scroll and hides after
typical delay.
Fossil.comCatalog
Webkit View
Mobile Web Product URL

9. Catalog Product Facebook Share

10. Catalog Product Facebook Share
Product image url is used
for thumbnail image.
Use Product URL to automatically
populate Facebook link info.

11. Try On Watch Browse
Watch Image
Single Tap - Displays Toolbars
and watch action layer.
1
Swipe left/right - Navigate
to the next/previous watch view

12. Try On Watch Action Layer
Watch Image
Press/Hold Image - Displays
watch action layer.
1
Allie White Chronograph
More Details -> Webkit Product Page URL
Try it On! -> Virtual Watch Feature View
Single Tap - Hides
watch action layer.
1
Buy Now Try it On!

13. Watch Image
Try On Watch Browse w/ Toolbars
Single Tap - Hides Toolbars
and watch action layer.
1
1/13
Watch List
Previous / Next Buttons + pagination info (current
product number / total product count)

14. Camera Live ViewCamera Live View
Try On Watch Browse w/ Toolbars
Rotate and Camera buttons. Rotate button rotates
watch and icons to make a landscape photo work.
Rotate and Camera buttons. Rotate button rotates
watch and icons to make a landscape photo work.
Allie White ChronographAllie White Chronograph

15. Share / Save Button - P1: Save to Photo Album,
P2: Share via email, Facebook, Twitter
Allie White Chronograph
Pinch
Zoom
Camera Live View
Try On Watch Browse w/ Toolbars

16. Camera Live View
Try On Watch Browse Save to Photo Album
Allie White Chronograph
Saved to your Photo Album.
You can share with your friends
by emailing from the Photo
Album.

17. Basic Webkit inApp view
Fossil.com
Webkit View:
Store Locator
Blog
Promotion
Videos
Shop Fossil.com
Catalog

18. Basic Webkit inApp view
Fossil.com
Webkit View:
Store Locator
Blog
Promotion
Videos
Shop Fossil.com
Catalog