Transforming EAI into an Intuitive Student-Learning Site




Overview

EAI has been a non-profit organization for art video archives since the 1970s, while they have great content for art workers and students, the user experience of the website is unpleasant. Our team focused on the educational streaming service of the platform and provided 3 solid suggestions for the website redesign and structure.
    Info

    • Timeline:  Oct 2024 - Dec 2024
    • Team: Allison Chen, Mia Greenburg, Conor Mack, Hridya Nadappattel, Iris Sun(me)
    • My Role: User interview, wireframing, prototyping, group meeting


    Client Presentation

    Prototypes



    EAI  - a great art video archive platform with a poor visual design

    Why? – Because they have been using the same IT team since the 1990s and rarely update.

    When I browsed the EAI website for the first time, I saw a long list of artists' names without any images or descriptions. I had no intention of clicking on any of the links. My teammates felt the same, so the major problem is to make the website more like a webpage for art and attract more attention from students and researchers.




    Cycle: Brainstormed by our own – Design – Iteration interview
    Brainstorm
    Our team decided to have a brainstorm sketch on our own, which is known as “6-8-5”, and vote for the ideas in the weekly meeting. The initial decision is to redesign the search page (me), artist page, video page, homepage, and some spicy ideas about the user profile feature (they don’t have that).



    Design
    After making the wireframes and discussing meetings and classes, we just realized there were too many tasks to be done, while the whole project was only a month long. Besides, our design decisions were limited by our client’s limited budget. After we got the inspiration from Taylor to think big and ignore the client’s limitations, we started the project.



    We then decided to focus on MVP quickly, so we gave up the search page and made our redesign goal clearer – focus on the educational streaming and make it a useful tool for educators. The main focus is the artist page, and video page with educational toolkit. But we also knew the homepage was important as it makes an impact on the user’s first impression, the homepage design was also added into our task.

    While doing the redesign, we kept the weekly check-in meeting with our client and they seemed satisfied with the progress. And we made a design guide and component library to keep the consistency within the team.




    Iteration
    The usability test is a core during the whole design iteration process. As we focus on the educational service and Pratt has a partnership with the service, we targeted our interviewees as Pratt students. To make the most use of the usability test, one of the focuses was Pratt art students so they could share their thoughts on the artist page and video page, another focus was information students that could provide professional insights on our overall design and features. We used our own network to approach the art students, and we sent out a Google form in the school of information google group to reach out to information students. These both helped us collect the participants quickly and efficiently.

    I did 3 interviews, two with art majors, and one with information majors. Each of them was done in different stages, which were mid-fi prototypes, MVP, and final hi-fi prototypes. This helped me gain useful insights into our design. We used different testing methods for different stages, when doing the mid-fi prototype testing, we provided two versions of designs and asked for impressions. When doing the MVP and hi-fi interviews, we tested the version that stood out in the mid-fi interviews and asked for further impressions.

    After finishing the interview, we all left comments in Figma to make sure each teammate could get the latest feedback, and we also left meeting recordings and notes in Google Drive as archives.






    The three suggestions that made EAI a better art platform for educators

    At the final hi-fi prototype, we focused on three major issues of the EAI website. First is the mission statement, as the current mission statement is long and plain, none of the interviewees finished reading it. We redesigned the homepage to add more visual elements and implemented the mission statement in the hero image.




    The second one is the information architecture. As a video streaming website, the texts outweigh much more than the videos, which made the interviewees confused about where to click. As a result, we redesigned the navigation bar and made a clear hierarchy to help direct the users to the video page. We also added the thumbnail feature when hovering over the video covers to save time for the users.




    Most importantly, the educational toolkit, which I worked on, included citations, timestamped note-taking, similar video recommendations, personal collections, and a discussion board. All of the interviewees were satisfied with the features and thought it would be helpful for their art research.

    View the hi-fi educational toolkit




    The whole team endeavor finally paid off
    Our final presentation was one week ahead, but it went well with the endeavor of the whole group. We went to their Chinatown office, and they all said the suggestions were helpful and contained some aspects they never thought of. As a UX consultant team, we overworked and created prototypes that were much more complicated than the requirements. But as a prototype itself, it can still be developed in terms of its homepage design, interactive artist mapping, and artists cataloged layout.  I would continue working on the interactive artist mapping, as I think it’s an interesting feature that can be put on the homepage as a hero image, and the same feedback was received in the usability testing as well.  But overall, the prototypes look gorgeous.





    What we did well

    • Keep weekly internal meetings and check-in meetings with clients 
    • Everyone was working hard on the whole work 
    • Active group chat 
    • Had a good direction 
    • Did not limit the ideas to the client’s requirements, especially budget

    What we could do better

    • Express our thoughts more directly (Sometimes we get confused by others’ opinions or thoughts but don’t express them in time)
    • Only focus on the major points at the beginning (we thought too big and did a lot of irrelevant things and wasted time)
    • Have a better contribution balance between the group leader and teammates (the group leader did a lot for the whole team, but sometimes I felt guilty and did not know how could I contribute more to them)



    ©Iris Sun 2024