Aoide iDesign Presentation


Published on

Aoide covers a new method in browsing materials that helps users to explore other similar materials. By creating a separate interface, Aoide focuses specifically on the explore and information visualization component. Also, users who uses this system will be able to collect different sorts of data and can make decisions that the MLibrary interface does not offer. This includes the ability to compare similar genre of artists or album in relationship to other artists by genre. Users will also be able to save browsing history for future use. This is designed, because users often compare and contrast information before making the ultimate decision to check out an item. Therefore, browsing history is a major component in our design. Furthermore, the ultimate objective is for users to build their own browsing history that invites them to come back, therefore increasing a higher use of the MLibrary. We entered this design into the iDesign competition for the University of Michigan.

Published in: Design
  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Hi everyone, we are team Aoide. I am Yi-Ying, this is Perry, Bell, Jean and Sylvia. I am going to introduce our project in a few moments.
  • First I would like to introduce our project focus and the approaches we conducted during the process.
  • Overall, we classified those finding into two main points. One is about the user behavior on searching and browsing online audio resources; another is user preference on virtual browsing exploration design.
  • Next I am going to talk about our design process. We use different level of prototype to represent our design idea.
  • First we came up with draft sketches individually for the design and layout. Then Through discussion and brainstorming, as a team we polished our idea and finalized our design by drawing out a series of sketches. There are 4 main pages: home page, search result page, music exploration page and profile page.
  • Here is our paper prototype, it helped us to focus on how our ideas transform into different functions by drawing them out.
  • Next, we developed the interaction map to illustrate how How information flow between pages and different pages interact with each other. Interaction map is a method for designers to visualize the major functions user can interact with by highlighting all the possible routes from the very beginning page to different branches.
  • Here is our interaction map. We also use it for later design stages, such as during mid-fi prototype we use it to well develop the interaction prcoess.
  • Next step is mid—fi prototype. To turn the paper prototype to interactive prototype, we used a prototyping software called Axure to see how these pages would render between each other. We focused on three main pages in our design: home page, music exploration page and profile page. During developing the mid-fi prototype, we tried to keep the pages as simple as possible so that in the later on usability testing users can pay more attention on the functions rather than the layout.
  • To get feedback from our targeted population and moving forward to hi-fi prototype, we did usability testing that gives users a few tasks to complete and to understand where user find it particularly useful or frustrated.
  • We recruited ten students, range from 23-35. They are from different backgrounds including information school, engineering, and music school. We also include domestic and international students. The usability test took around 30 minutes for users to complete and after each test we discussed the result as a team.
  • Our first finding for usability test is that explore page is confusing and need to address the relation between albums.Userswere most confused by how the artists are similar and how these albums are grouped together or how is the relationship between each album.Also, the genre button is hard to notice.
  • As a result, we changed our explore page by making the genre directly appear beneath each album and moving the genre button away.
  • Second, more guidance displayed on interface is needed.Between different pages, users often found it surprised why the particular page showing up and why they were linked together. Due to the confusion, we decided to add more description on the interface.
  • For example, on the home page, we put a question mark button so users can click on the button to find out more information about how we generate similar artists and how users can explore from one album to another.
  • Browsing history record in the profile page is is useful but did not display enough information. For most users they had trouble understanding the display of browsing history. Someusers indicated that the album cover did not convey much about the album itself,
  • We changed our design for browsing history into more text including artist name and album name. For users who need more information about the artist or album, they can just hover over to see more information
  • In order to gather feedbacks from potential users of our design, we submitted our project to SI the student project exposition held at the School of Information. On the day of the exposition, we had numerous positive feedbacks from the general public. We talked to students, librarians, corporate associates and professors.
  • Some of our audiences approached us and were intrigued with our idea of “browsing experience” rather than traditional search method. This is exemplified in our design where we let users browse similar album genre, time frame and albums of the artist through compelling visualization displays. Other people also commented that it is quite useful to let students see the “department favorite list” so they are able to know which artists or albums are more popular among the fellow students.
  • One of the attendants who gave us feedback was a music school graduate student, he said that the interface of Aoide’s explore function as a good example of the assignments that students are assigned with. The relationship of time, genre and artist is a theoretical understanding that is critical to music student’s academics. As noted by this graduate, which is vaguely quoted, “The timeline is an example of how the music school professors thinks – it’s their mental model all laid out in their minds. And they want students to look for relationships between the different dynamics in consideration to artist, time and genre.”Thus, much to our surprise, though we did not intend to design our website in such a way; however, we are pleased that it provides for meaningful representations for potential users. The graduate student also pointed out that even though in our interface, we had only focus on pop music collection, it is applicable to other genres such as classical music by simply changing the dimensions. For example, as of now, the explore interface is based on “genre, artist and time,” which can be easily changed to “composer, performer and timeline.” This could be an idea for the future for us to work on, to examine more preciously how different genres can be represented. 
  • Limitations: We went through an entire cycle of various steps of a design process and had received positive feedbacks from exposition attendants, there are still some limitations in Aoide which we would like to address. First, our hi-prototype is not quite close to the final product since it’s not an interactive website. As a result, we are not able to examine usability questions in details and make strong conclusions about how behavior will relate to use of the Aoide website (reference: In addition, since we wanted to offer an innovative method of visual browsing that invites users to explore and discover materials that the current interface does not offer, the overall design of Aoide website is quite different with Mlibrary system. As a result, we may not be able to provide users a seamless connection between Aoide and Mlibrary website. So when users click on “get this” on the item record in Aoide, the system brings them back to the Mlibrary website to place a hold. This may cause a problem where users may not be able to navigate through the sites as easily as we have hoped.
  • Limitation: In addition, as we know, there are some privacy concerns regarding users’ checked out records. After our interview with the technical librarian, we confirmed that checked out records would not be recorded due to the privacy issue. The privacy issue has impacted on our design. Initially we wanted to add social networking elements into our design to make the browsing experience more enjoyable and more connected to other users. However, after understanding the current privacy policy, we tried to keep the privacy policy in mind and at the same time not to abandon our original idea. After discussing and brainstorming, we moderated our design to department-based rather than users-based. In recommender system, this is termed as non-personal recommendation system, which congregate results based on system data and does not reflect for individual users. As a result, rather than keeping track of each person’s record, library could only track the checked out records by department. By doing so, the privacy issue is not being violated and at the same time we still added the social elements into our design.
  • To conclude, Aoide is a reflection of our design process. Our design process includes best-practiced methods in interaction design, where our design is more holistic in terms of considering the perspective of different users in mind. Our design include an initial brainstorming session, where we interviewed librarian and users, created persona and scenarios, conducted a comparative analysis, and created our low-fi prototype. Our low-fi prototype was created based on some of the common findings in addition to further brainstorming of how we can create a system that reflects for a more effective and user-friendly browsing experience. Furthermore, we conducted numerous usability tests on users to find out the strengths and weaknesses of our design. We could not have come up with our current design for Aoide without these procedures. Some of the issues we want to address in our design are to create a separate system that can raise awareness for the audio collection for the MLibrary. Moreover, we want to introduce a browsing system that creates for a novel experience, by having users to generate their own content in the system with their browsing history. This will allow users to have a form of input and output with the system, therefore enforcing an interactive flow between users and system. In sum, we hope that our design can generate a bigger presence of the MLibrary’s audio collection. Our ultimate goal is to increase the usage of the MLibrary resources and to create more opportunities for users to explore what the MLibrary can offer.
  • Aoide iDesign Presentation

    1. 1. Aoide: A Virtual Browsing Exploration for MLibrary Team Aoide School of Information University of Michigan Gin L Chieng, Pei-Chih (Bell) Shih, Pei-Yao Hung, Sylvia Szu-Hsuan Lai, Yi-Ying Lin
    2. 2. Project focus & Methods
    3. 3. Project Focus —  MLibrary audio collection—  Exploration for the online materials
    4. 4. Goal —  Understanding users’ behaviors—  Developing innovative methods
    5. 5. Design Process & Methods —  Brainstorming—  Interviewing—  Personas & Scenarios—  Comparative Analysis—  Prototyping—  Usability Testing—  Website Mock-up
    6. 6. Key Findings
    7. 7. Topics—  User Behavior—  User Preference on Design
    8. 8. User Behavior —  Adopt information seeking techniques like search engine, such as keyword search —  Ex, Google search; Library resources online search—  Need specific information to be explicitly displayed on the explore page —  Images: album covers —  Text: album name and artist
    9. 9. User preference —  Music sites tend to adopt information visualization —  AllMusic, Amazon music, and Pandora—  Users are easily influenced by peer recommendations
    10. 10. Prototyping
    11. 11. Paper Prototype—  Draft sketches of the web interface—  Finalized our design—  Main pages home page, result page, explore page, and profile page
    12. 12. Home Page Result PageExplore Page Profile Page
    13. 13. Interaction Map—  How information flow between pages—  How different pages interact with each other—  Interaction Map —  Visualize major functions —  Highlight possible routes
    14. 14. Mid-fi Prototype—  Interactive prototype—  Focus on home page, explore page, & profile page—  Pay more attention on function
    15. 15. Usability Test
    16. 16. Usability Test—  Recruiting: 10 students—  Age: 23-35—  Different backgrounds: music, information science, and engineering.—  Domestic & International : Unites State, India, Korea, and Taiwan
    17. 17. Result—  Explore page is confusing and need to address the relation between albums
    18. 18. Redesign
    19. 19. Result—  More guidance displayed on interface is needed —  Add more description
    20. 20. Redesign
    21. 21. Result—  Browsing history is useful but requires more details about each album and artist —  More text including artist name and album name.
    22. 22. Redesign
    23. 23. Demonstration Video
    24. 24. Discussion
    25. 25. Feedbacks from expoSItion—  ExpoSItion: student projects exhibition at the School of Information—  Participants —  Students —  Librarians —  Corporate associates —  Professors
    26. 26. Feedbacks —  Browsing Experience—  Department Favorite List
    27. 27. Surprising Feedback Music Graduate StudentAoide as a great resource for music students.“The timeline is an example of how the music schoolprofessors thinks – it’s their mental model all laid out in theirminds. And they want students to look for relationshipsbetween the different dynamics in consideration to artist,time and genre.” Future design ideas: Timeline as generable to differentvariables.
    28. 28. Limitations —  Aoide designed as an intermediate gateway to the MLibrary’s audio collection.
    29. 29. Limitation —  Privacy Concerns with Checked-out Records —  Non-personal recommendation system
    30. 30. Conclusion —  Aoide as a reflective design.—  Innovative Browsing Experience that allows for input and output. —  Strategy to retain users for using MLibrary’s audio resources —  Raise awareness —  Increase usage —  Opportunities to explore
    31. 31. Q&A Team AoideGin L Chieng, Pei-Chih (Bell) Shih, Pei-Yao Hung, Sylvia Szu-Hsuan Lai, Yi-Ying Lin