...
Design 1 is based off of a standard tab navigation interface with stream channels represented by thumbnails in a grid.
Storyboard
Analysis
* Learnability: StreamBrowser (SB) is generally easy to learn because of its standard navigation layout with tabs at the top. SB is also only divided into three main sections, so it's very easy to remember and be familiar with the interface. However the popup overlay may not be too intuitive, but easy to remember and retain for future uses of SB.
* Visibility: The different states of the interface is designated by highlighting and other visual signs. A certain tab will be "open" if that page is open, and a catergory item will be underlined and highlighted if that is what the user has selected. The visibility of the clickability of the thumbnails is lacking however. The overlay's visibility is improved by the "dimming" of the background.
* Efficiency: The efficiency of our interface is affected by the amount of data (i.e. collection of stream channels) that we have. The more channels, the more a user has to scroll to find a specific channel. We had a search feature and the recent history page to improve efficiency for experienced users. For new users, who are unsure of how channels are categorized, it may take some time to browse through all the categories. Overall, the main uses of SB are Catergories, Recent History, and Search, and it's very easy to navigate to them. The tabbed and thumbnail navigation should be familiar with many users.
...
* Errors: Errors are easily recovered from. There won't be any mode errors since there aren't different modes of operation. If the user clicks the wrong stream, all he has to do is go back on his browser. Similarly, other operations like searching and selecting a category are reversible by simply choosing the right thing after an error.
Design 3
Storyboard
This is the view that the user would see when they first get to the page. There is a title bar at the top showing SB representing StreamBrowser and a search box to the left. At the bottom of the page would be a playlist of previously viewed streams or any that are queued up. This is hidden while the playlist is empty. In the middle section is the categories listing.
Once the user has selected a category, to the right, the recommended streams within the selected category will appear. When the user clicks a new category, the list to the right updates to show streams in that category. When the user hovers over the title of a stream, it will show a popup with a short description and actions the user can perform.
If the user is to type any queries in the search box at the top, it would update the list just as it did while selecting new categories.
This is the small stream viewer. The main list view turns into a viewer for the stream and begins playing the stream.
This is the expanded view for the viewer. The titlebar and category sections go away, leaving the video and playlist. This playlist does go away after a short delay, providing the video the full screen to display the stream.
Analysis
The learnability of this interface should be easy because this interface borrows from many other commonly used interfaces. It uses the stage setting to display the list of streams in the center of the screen in both the search view and the category view. The playlist also copies from the Grooveshark interface, where the "album art" is shown horizontally in the playlist. The learnability of this interface might be hindered by the amount of text on the screen as compared to images or other graphical entities that might have hinting toward what they do.
...