Ui Presentation (1)
•Download as PPTX, PDF•
0 likes•198 views
hola! is a connection manager application that helps users connect to the Internet through available connections like Wi-Fi networks or Ethernet cables. It allows users to quickly find free access points and connect when in an environment with multiple connection options that may require payment or have other restrictions. The document provides requirements for designing the main view of the hola! user interface, including listing available connections, icons, colors, and other interface elements.
Report
Share
Related slideshows
Recommended for you
More Related Content
Viewers also liked
Viewers also liked (20)
Similar to Ui Presentation (1)
Similar to Ui Presentation (1) (20)
Recently uploaded
Recently uploaded (20)
Ui Presentation (1)
- 1. hola! - User InterfaceWhat this does:hola! Is a connection manager. It is the application that helps you to connect to the Internet through whatever connection is available to your computer; WiFi networks around you, Ethernet cable, etc.In an environment where there are many access points, some of which are locked, some require payment, etc., hola helps the user to quickly find the free access point, and connect to the internet.
- 2. More…We have uploaded the following files:Our logoOur current connection manager UI (draft)Microsoft’s connection manager UIThis file, which shows the elements of the UI that we need
- 3. Our RequirementsTo design the main view (page) of the UI.We are open to any type of designWe like the iPhone type designNeed to also provide the few icons and buttons that this user interface requires (for buttons also need to provide the ‘hover’ and ‘pressed’ versions)Consider integrating our logo in to the design, possibly as the icon on the top left
- 4. The Microsoft Connection ManagerAccess point connection status (this one is connected)The List area, where all the connection alternatives are listed. In this case, all the Wi-Fi access points are listed since “Wi-Fi” is chosenName of the access point Access point’s signal strengthConnection manager options
- 5. The hola!Connection ManagerConnection manager options are chosen by clicking thisStatus of the application“Tab” selection – which type of connections the user wants to view (in this case, “Wi-Fi” connections are chosen)“connect” and “disconnect” (from access point) buttons (only for access point chosen)Access point password (only for access point chosen) The List area, where all the connection alternatives are listed. In this case, all the Wi-Fi access points are listed since “Wi-Fi” is chosenName of the access point Access point’s signal strengthAccess point connection status (this one is connected to the Internet. Other statuses include ‘connected’ (to the access point, but not to the internet), ‘locked’, ‘un-identified’, ‘was connected to in the past’)Current status of registered usersWindow resize corner
- 6. The iPhone Connection ManagerSettings buttonButton to turn WiFi on/offName of the access point Access point’s signal strengthAccess Point details pageAccess point connection status (this one is locked)Details page
- 7. PaletteThe UI needs to be friendly, and to appeal also to non-techies. Therefore, need the palette to be gentle colors. Take a look at www.mozilla.org; their site's palette is very friendly in our mind. All black is probably not friendly enough (if you want to use black or grey, try mixing in some lighter areas, like the list background)Please do not use too many colors in the UI, to keep a clean lookYou can use transparencies to make the UI more interesting
- 8. IconsIcon on the top left: This should be the Hola logo, with the "hola!" text (& font). This is used as a button from which a menu comes down (no need to design the menu part)The top row icons (Wifi, etc.):There should only be 3 icons in the list: WiFi, Ethernet, and OtherWe would like the icons to be unique, and uniform. I suggest to work on one to make it unique, and then make the rest uniform with thatIcons in general: consider to use the Hola logo's fire icon to create the other icons. For example, the lock could have 'fire' hair, etc. This is not a must.
- 9. Other notesThere may be more access points in the area than may fit in to the screen. For this, a scroll bar on the right is probably neededConsider clearly marking the access point to which the user is connected (by highlighting the list entry?)Consider to include a progress bar for while the application is trying to connect to the access point the user chose (maybe a ‘barbershop’ type roll?)