museum-live_poster (1).jpg


A web-based virtual tour creator





The Frick Pittsburgh

Mattress Factory


AWAACC (August Wilson African American Cultural Center)

The Westmoreland Museum of American Art

16 weeks, Aug- Dec 2020

Frontend Developer

Derek Chan

Angela Chen

Kathryn Eiland

Grace Kang

Ningshan Ouyang


Web Development



In the Fall semester of 2020, I got the opportunity to work on a student team to deliver a semester-long project for a real client. The team is called Museum.Live, which is a team of 5 Graduate students consisting of a product manager, 2 designers, and 2 programmers. I was a programmer in the team and mainly responsible for the front-end development.


During the semester, we built a storytelling tool to enable museum staff to design and execute virtual museum experiences for their guests. These live virtual experiences will be conducted through a digital platform, such as Zoom, and enhanced by our web-based tool.

The goal of the product:

  • Be simple and easy for museum staff to navigate.

  • Support diverse, accessible experiences.

  • Enable conversation between tour host and guest.


In January 2021, a functional website is delivered to each of our 5 partners.



 Brainstorming, Understanding Client's Needs 

During the semester, as part of the team, I kept close connections with our client and met with them at least once a week to report weekly progress and gain feedback on our work. By working closely with the client, we analyzed their needs, set up design goals and usability goals. Based on our understanding, I brainstormed with the team to come up with solutions to solve our clients' problems.

Screen Shot 2020-09-24 at 3.07.30 PM.png

Meeting with Clients

Screen Shot 2020-11-19 at 12.24.33

Working with Designers

 UI Implementation with React.js 

One of the strongest desires of our clients is a delightful and present-ready interface for them to show to guests during the virtual tours. As the front end developer in the team, I worked closely with the designers to design and implement different pages every week. I chose React.js as the development tool to build the customized UI components that fit the needs of both internal communication within the staff and external presentation to the guests. 



Present a tour

Present a tour

Edit a tour

Edit a tour

 Technical Documentation 

After we deliver the website to our client, they will possibly hire some developers to continue on maintenance. Therefore, I worked with the backend developer to prepare technical documentation to help them understand how this website works and also troubleshoot any future issues.

Screen Shot 2021-02-13 at 6.19.38 PM.png
Screen Shot 2021-02-13 at 6.20.11 PM.png


At the end of the semester, our product is well received by our client. They have conducted several sample tours with 50+ guests using the website.


From Jan 2021, the current version of the website will be launched and the museums will start training staff on using the tool and conducting virtual tour experiences to public.