top of page

Wireframe of 1.0 Home Screen

  • Whitehole Kong
  • Mar 20, 2017
  • 1 min read

Identify the proposed content, structure, functional behaviours of 1.0 Home Screen.

WIREFRAME AND ANNOTATIONS OF HOME SCREEN

Wireframe of 1.0 Home Page

  1. Member Login If user logged in, jump to 5.0 My Account screen. Otherwise, jump to 5.1 Log in/Sign up screen.

  2. Search field Search wine by text. This screen shall changes to search mode after search field get focus.

  3. Recognize label button Jump to 3.0 Recognize Label screen after click on it.

  4. Promotions Shows up to 5 promotions.

  5. Home tab Jump to 1.0 Home screen after click on it.

  6. Search tab Jump to 2.0 Search screen after click on it.

  7. Blog tab Jump to 4.0 Blog Index screen after click on it.

  8. Location tab Jump to 6.0 Location screen after click on it.

WIREFRAME AND ANNOTATIONS OF SEARCH MODE

Wireframe of text search

  1. Search field Search wine from database with the text in search field after user click the <Search> key.

  2. Cancel button Cancel search and back to 1.0 Home screen after click this button.

  3. Clear text button Clear text in search field after click this button.

  4. Keyboard System search keyboard.

Comments

bottom of page