GR2 - Designs

Scenario

It's Friday afternoon. David just finished class and is thinking about his plans for tonight. His friends were talking about going to a frat party. He's thinking that his past week was really busy, so he wants to wind down and have some fun tonight. He searches for the party on the website Remote Playlist. He recognizes several songs by Usher and decides to preview "DJ Got Us Fallin' In Love" as he texts his friends about his dinner plans. He sees a new remix by David Guetta "Sweat" and after listening to it, decides to download it. After browsing the website for several minutes, he realizes that the playlist doesn't contain any music from his favorite artist, Flo Rida. He really wants to hear some of Flo Rida's hit songs at the party tonight, so he uploads "Who Dat Girl", "Club Can't Handle Me", and "Right Round".

Designs

Design #1

This is the splash page, it's left clean and simple

This is a detailed view of the login form that would pop up when the login link is clicked.

This is the search results page after the user searches for an event

This is the landing page of an event after being clicked from the search results page

This is a detailed view of the playlist at the bottom of the event landing page

This is a detailed view of the upload form that pops up when the "upload a song" link is clicked

This is a detailed view of one of the songs after it's clicked. The panel expands to show play buttons and a download link

Design #2

Splash Page. The user arrives at the homepage and is greeted with a simple search bar. The instructions for using the site are also enumerated to give new users a very simple idea of what this site is all about.

Search Function. As the user types the name of the party into the search bar, there are automatic fill-in suggestions.

Search Results. After the user types "Enter" or hits the search button, he is shown a list of parties sorted by date.

Playlist Window. After the user clicks on an events, the event information populates the top header. The main windows displays the current list of songs. There is a play button to the left of the song and a download link to the right. There is also a thumbs up icon which acts as a "vote" button. Underneath the vote button, there is a number that indicates how many people voted for it.

Upload Bar. This bar is not shown in the previous picture but is meant to be at the bottom of the page at all times. When a user clicks the input box, there is a popup that allows the user to select a file from the computer.

Upload Bar Status. After the user selects the music file and hits "Upload", the bar is replaced with a progress bar and a "Cancel" button. Finally, there will be a message "Upload Successful" at the finish.

Append to Playlist. The new song will be displayed at the end of the list with 1 vote to start.

Design #3