Lstnr+design+-+Kevin+Van

[|LSTNR Paper Prototype]

[|LSTNR Balsamiq prototype]

Both prototypes show the design for the home page, the radio page, and an artist's profile page in that order.

Overview:

I wanted the home page to be separated into three columns. The left and the right columns were fixed. The left column would display a list of favorite radio stations so that the user cold jump to a radio station as soon as they logged in. The left panel also shows recommended artists for the user based on their "liking" patterns. In the right panel there would be a list of artists that are rising in popularity. I wanted these panels to be fixed so that the user would always be able to jump to a station or a rising artist even when they were reading the main content. The main content on the home page is in the center section. The top would feature an "artist of the day" whose picture and bio would be displayed. Then underneath a small list of the shows that are happening the soonest would be displayed. The top center of every page has a fixed navigation bar that allows users to get to anywhere on the site, from anywhere on the site.

The radio page is also sectioned. There are two sections: a left column and a right. On the left column the user sees their list of favorite radio stations first. Underneath is a list of all radio stations alphabetically ordered. Only the left panel on this page scrolls, and this would allow the user to view more genres. The right section is the main section of the radio page. At the top is a heading that tells the user which genre radio station they're currently listening to. Underneath the heading is a simple player that has the features to skip, pause, change volume, and "Like" a current song. The users "Liking" patterns would be saved and used to make suggestions. Underneath the radio player is information about the current artist. Underneath that is a list of the recently played songs and links to their respective artists.

The profile page is sectioned similarly to the radio page. The left column is fixed on this side however. The bands picture, "sound", "influences" and contact information stay fixed while the user scrolls. On the right is a more in depth bio of the band as well as upcoming shows. Underneath the list of shows is a list of other artists that the current artist likes. This would allow artists to promote other artists as well.