Designed desktop & mobile website (UI/UX) for Suppoment Gallery during the internship over the summer of 2020.
Role: Website Design, UI/UX Design
Duration: 9 weeks (Jun - Aug 2020)
Tools: Adobe XD, InDesign
Celebrating the 10th anniversary of SUPPOMENT Co. Ltd., Suppoment Gallery initiated a brand remodeling project. Part of the project was to redesign the gallery website with a greater emphasis on easier navigation and archive. I researched examples of gallery and museum websites, constructed information categorization and hierarchy, and designed image-centered website user interface.
How can we gain visitor’s interest in learning more about our artists and help collectors to easily navigate through the website?
The main purpose of the gallery website is to provide information about artists, exhibitions, and gallery news. Suppoment Gallery’s website has had more than 260,000 visitors with an average of approximately 500 visitors per day, playing an important role in communicating with the collectors both domestically and internationally. Especially with the shift to the virtual world due to the pandemic, online platforms now play an even crucial role in connecting with the public.
Oftentimes, the website visitors either have a specific piece of information that they’re seeking for, or simply wish to explore the site to learn more about the gallery and the represented artists. Whatever the intention of the user is, the website should be easy to navigate and display gallery’s characteristics across the website. The previous version of the website mostly had a good information hierarchy and organization, but it lacked chronological organization, as well as an opportunity to learn more about the stories and concepts behind the artists’ artworks.
For this project, I constantly communicated with both the gallery director and the third-party web developer to seek feedback throughout the design process. I discussed the design aspect of the website with the gallery director, while the execution aspect of it with the developer. This made this project a great opportunity for me to engage both fields of my major (computer science and art).
1. Analyzing Existing Resource
I researched other gallery and museum websites to analyze their method of audience engagement and the flow of information architecture. I mainly considered PACE gallery, Gagosian gallery, and the Metropolitan Museum of Art websites in this process.
I also conducted short user interviews with the exhibition visitors in the primary audience age range (late 20s - 50s) to hear about how they utilize gallery websites in discovering artists and gallery information. They informed me that they only visit the gallery website to learn more about a specific exhibition or an artist they’ve seen or heard elsewhere. In other words, they were using the gallery website more like an online dictionary to look up a given description, rather than like a social media stream where they can explore and learn more about upcoming/ongoing exhibitions, recently joined artists, and newly added artworks.
2. User Flow & Information Architecture
I then categorized the website’s content into 8 groups with sub-categorization as necessary to ensure an easy user experience.
3. Low & Mid Fidelity Wireframing
Based on the user flow defined, I sketched lo-fi wireframes to visualize the connections among pages. Iterative deliverables and feedback have been given back and forth to finalize the design and interactions. All communication has been done in a remote setting due to the pandemic, so I learned how to effectively communicate the changes and needs over written and verbal communications.
4. High Fidelity Prototyping
Multiple prototypes for different display sizes have been produced in the process of presenting the responsive interface design. The interactive prototype presented under is one of the high fidelity prototype iterations designed for the tablet display.
Applying all the feedback and research analysis, I finalized the user interface design and helped the web developer put the design into an active site by providing codes for user interactions (e.g. 3D hover effects).
Visit Suppoment Gallery website to see the live interactive interface!
Reflection & Takeaways
Through this internship, I was able to practice human-centered design, information hierarchy, and remote communication skills. I also learned how to construct information architecture considering the context (gallery) and the audience (collectors). It was interesting to observe the growing trend of online viewing rooms among galleries as well, as online viewing rooms were not a common form of exhibition even just a few years ago.
Overall, UI/UX design intern at Suppoment Gallery taught me skills varying from application of UI/UX design components in a gallery context to presentation and communication in a remote setting. Communicating with the visuals always delivers the idea much clearer than just the text. They’re also great for documenting the developmental process.