AR experience for historical museum in NYC
The museum corner needed an accessible way for visitors to learn about the photography darkroom.
Due to architectural constraints, visitors are unable to access the second-floor darkroom at the Alice Austen House, leaving an important part of the museum experience underutilized.
[Project Overview]
This project is an augmented reality experience designed for the Alice Austen House Museum. It allows visitors to explore Alice Austen’s darkroom and photo development process through their mobile devices, making the space accessible to those who cannot physically visit the second floor.
Industry
AR Experience
My Role
UXUI Designer & Animator
Team
Una Zhang, Seun Elemo, Joyce Zheng,
Cathy Li, Isabel Wu, and Fiona Wang.
Tools
Figma Web.GL HTML CSS Maya
Timeline
September 2024- Jan 2025
+80%
Engagement time compared to traditional verbal tours.
90%
Users found the mobile interaction intuitive.
+200
Visitors like the AR guide over static signage
Select this text to see the highlight effect
Discover
Context Research
We began with context research on-site to understand the physical environment—measuring dimensions, identifying projection locations, and determining optimal viewing height.
Visitor Interviews & User Observation
We interviewed visitors and staff to understand how people currently engage with the darkroom content. Most learned about the process through verbal explanations, but many expressed confusion and a desire for a more visual, interactive experience.
Key User Insights
The darkroom is physically inaccessible for many visitors.
Visitors lack understanding of the photo development process.
Some interaction to make the museum tour funny and attractive
Ideation
Bringing the Process Out of the Room
We brainstormed ways to make the invisible visible. Several concepts were proposed—from projection mapping to printed booklets—but the solution had to be immersive, intuitive, and work in limited space. AR stood out as the most viable medium.
Deciding with client on AR as the UI Medium
After developing the AR miniature concept, we presented it to the client during a design review session. The client was excited about its potential to make the darkroom process more accessible and engaging. Together, we finalized the idea of using a web-based AR experience triggered by a physical model, ensuring the solution was both technically feasible and aligned with the museum's goals.
Design Phase 1
When UX Meets Physical Challenge
The darkroom was small and closed off, so we created a 1:12 compact 3D-printed model. It served as a replica and an AR trigger, connecting physical space with digital interaction.
User Flow Guided by Research
By observing visitor routes and interviews, we identified key touchpoints and designed a user flow that fits naturally into their journey, making the scan moment intuitive and the experience easy to follow.
Lofi-Prototype and Technical feasibility
To validate our concept early, we built a clickable low-fidelity prototype simulating the step-by-step darkroom process.In parallel, we began testing the technical feasibility of using a physical model as the AR trigger. We experimented with scale, surface texture, and marker placement to ensure consistent image tracking under varied lighting and visitor positioning. This step helped us avoid potential AR detection issues later in development.
Hi-Fi Prototype Support
I assisted my teammate in building a hi-fi prototype based on our early wireframes. The prototype included core interactions and visuals, allowing the client to preview the mid-stage experience.
Design System
To ensure visual consistency across the AR experience, we created a modular design system that includes color schemes, typography, icon sets, and interaction patterns. The system was designed to function well across various screen sizes (mobile/tablet) and real-world lighting conditions, ensuring the interface remained clear and accessible throughout the experience.
Hi-Fi Prototype Support
We conducted another round of hands-on testing with the client, guiding them through each of the seven AR interaction steps. During this walkthrough, we observed how they interpreted visual cues, navigated between stages, and reacted to the pacing and clarity of content.
Design Phase 2
Design Iteration
Building on my teammate’s initial design, I refined the interface to better suit real-world AR conditions. I adjusted button transparency and background blur to create a lighter, breathable layout that blends naturally with the live camera view—ensuring key UI elements remain visible without blocking the physical environment.
Final Output: How does it work?
Miniature Darkroom as an AR Marker – Users scan a physical model of Austen’s darkroom to trigger the AR experience.
Step-by-Step Process Navigation – Visitors can explore 7 key steps of photo development through interactive animations.
Free Exploration Mode – Users can jump to different steps via a numbered navigation bar to see animation.
Completion Reward – At the end of the experience, users see a fully “developed” digital photograph as a final output.
Final Output: How does it work?
After the low-fi prototype, the contractor and I implemented responsive components for web and mobile, ensuring seamless support for dark and light modes. We developed an accessible color scheme for readability and contrast in both modes, using CSS variables for dynamic theme switching.
What I learn
I found that programming skills are especially valuable for designers, particularly in AR or visually dynamic projects. Many design elements can’t be fully represented in 2D tools like Figma. For example, in an AR experience, the live camera feed introduces natural blur and lighting variations, which directly affect the readability and contrast of foreground elements. By designing directly in the development environment, I was able to test visual properties—such as card transparency, shadow depth, and background blending—in real-time. This approach not only improved visual accuracy but also significantly reduced rework and design guesswork.
Wanna work with me?