iDesign 2011 Competition: Aoide Music Library


Demo Video:

Project Background:

For the iDesign competition, the theme was to examine new methods in virtual browsing for the University of Michigan Library. Specifically, our design aims to create a virtual browsing exploration for the audio collection of MLibrary. The music library at the University of Michigan is “recognized as one of main contributors to one of the biggest audio collections in the nation; it supports the performance, teaching, and research activities of the School of Music, and Theatre & Dance (Music Library).” The music library is located within the School of Music. The library also serves the broader university community, where scholars, performers and teachers may collaborate together. The MLibrary also has a major national and international presence.

The MLibrary serves as an educational and non-profit organization and has innovative methods in presenting information. However, Aoide wants to explore other functions other than search. Moreover, we are interested in how to develop an in-depth search and browse process that would enrich for an interactive experience in browsing materials.

Design Process:

Phase 1. Librarian and User Interviews

We interviewed music school, business, library science, and art and design students. Interpretation sessions were held after each interview in generating design ideas. According to our five user interviews, we found that most users prefer to use “album, artist and song” as their most intuitive search category. Another finding was that some users are confused and do not know how to specify their search.

Phase 2. Competitive Analysis:

We did a comparative analysis that compares the MLibrary’s website to other university websites, recommender systems and music exploration sites. We examined the university website to see other potential interface design.

Competitive analysis of music exploration competitors

Phase 3. Personas and Scenarios

we constructed three persona and scenario that represents our users, which we captured demographic and life-style characteristics of the people we interviewed. We also wrote a scenario for each of the personas using the product we designed.

Primary persona for Aoide

Secondary Persona for Aoide

Phase 4. Brainstorm and Whiteboarding

We started off this competition through a brainstorming session at a iDesign MLibrary design jam during January, 2011. We examined different ideas, and decided that we want to explore the MLibrary’s audio collection, because audio as a medium should be independently represented as a collection. Moreover, each of our team members then individually came up with sketches about the design for all the pages. We discussed and brainstorm more alternatives.

Reiteration and design meetings

Sketches of methods of exploration

Sketches of potential ways of visualizing information

Our Solution:

Aoide aims to offer a new perspective in the virtual browsing experience of the MLibrary music collection. Aoide functions as an extension to the MLibrary music collection, specifically to audio CD materials. However, as indicated in the user interviews, a large majority of students has specified that they have not checked out audio materials or they were unaware of such services. As for users who had checked out audio materials, we requested users to show us how they search for audio materials in the MLibrary. A large majority of users have indicated that they would use search engines in advance in retrieving a preliminary search result before entering the MLibrary Miryln system. More importantly, users responded that the MLibrary is not their initial choice in browsing materials.

On the homepage of Aoide, users are invited to a colorful main page. Aoide invites you to browse a variety of albums by artist that are similar to your preferences. We would like you to explore the relationship between artists’ albums in relationship to other similar performers.

Homepage of Aoide

The homepage is designed to be very simplistic, where we would like users to focus in on their designated search. At the bottom of the interface, frequently checked-out items by students are also listed as recommendations. For users who don’t have a particular album, artist, and song in mind, they can click on these icons to start the browsing exploration.

If you type in an artist name in the search bar, for example, “Janet,” the search result will yield artists recommendation that matches the artist you have indicated. This can be helpful when users cannot remember the name or album of the artist.

Search result will yield artists recommendation

This will take you to an entirely new interface that will display a visualization that emphasizes the artist in relationship to a timeline on the album. An algorithm is computed in recommending similar artists. This will allow users to compare and contrast similar artists’ based on the genre of the artist and album you indicated. Albums are listed in a chronological timeline and solid line indicates that it is the main searched artist, while dash lines are recommended artists.

Explore music visualization for Aoide

For example, Janet Jackson’s time line is placed in the middle of the interface, rather than at the start of the page.

Aoide wants to avoid the conventional perception of hierarchical listings, such as how searches are displayed in the current MLibrary and from search engines. Aoide wants to do something different. For example, Janet Jackson has soul, R&B and pop characteristic in her music. Artists such as Mariah Carey, Toni Braxton, Whitney Houston and Michael Jackson have been recommended based on the overlapping genres. However, some of these artists may have covered other genre characteristics that Janet Jackson did not cover. This can help users to explore other possibilities and styles in music.

Browsing history information visualization revealing search patterns

This will allow users to go back in their profile page to look up any browsing items they have in the past. It is important to note that only albums that the user have clicked are recorded, instead of saving the entire timeline of the albums that have been shown. Users can name the browsing history and have it saved as a file.

Browsed items are connected in a way that captures the browsing pattern and the albums you have explored. You can come back to your profile page to view all of your browsing history. Multiple icons below indicate different set of searches that the user has saved previously. If users want to know more about the specific album or artist they have explored they can click on the bubble, and a pop-up screen will be displayed to give more information on the artist or album.

Favourites page and artists recommendation

Showcase of Aoide Poster at SI Exposition in April, 2011

I was the presenter at the final rounds of the iDesign Competition

Learning Objectives:

This was my first design project that I have ever done from start to finish, and I learned a great deal from my peers on conventional UX methods. Prior to this project, I had performed different UX methods, but I had not been able to carry each study result to inform design decision. For this project, I was in charged of the demo video – where I created the slides, wrote the script for the slides, and produced the video. As for the rest of the project, I designed, supported and participated in all phases of UX research and also did the interface design of the prototype. Moreover, I was the final presenter  of the  iDesign MLibrary Competition and Challenge.

  • 2012 © Gin Chieng. ALL RIGHTS RESERVED