Designing a scalable self-guided tour that preserved the heart of a historic nonprofit's visitor experience.
- Timeline
- Jan–May 2025 · 10 Weeks
- Role
- Project Co-Lead & Design Lead
- Team
- 7 Designers + 2 Project Leads (Invention Corps at Berkeley)
Launched August 2025Bilingual ExperienceStaff-OwnedWeekly Public ToursDesigned for Long-Term Sustainability
Background
When a nonprofit loses the ability to tell its own story
Some stories are too important to go untold.
For more than 45 years, The Women's Building has served as a cornerstone of San Francisco's Mission District, providing advocacy, education, and community services for women, gender-diverse people, and families. Every mural, gathering space, and community program reflects decades of history — and for years, staff-led tours were how visitors connected with that story.
That was no longer sustainable.
For the organization, budget cuts and reduced staffing meant the people who knew the building's history best were needed elsewhere — serving the community, running programs, keeping operations moving. Dedicating staff time to repeatedly guiding visitors through the building was no longer realistic.
For visitors, losing a human guide meant losing their primary way of making sense of the space. Without someone to lead them, they had no clear way to navigate a three-story building, know where to go next, connect rooms with their stories, or understand the significance of what they were seeing.
For staff, any solution needed to be realistic after handoff. No developer. Limited budget. Something they could update and maintain on their own.
Growing operational constraints
↓
Need for a scalable visitor experience
Because there would no longer be a person guiding visitors through the building, the experience itself now needed to take on responsibilities that had always belonged to a human guide — communicating navigation, pacing, storytelling, and context. The interface had to do what a person once did.
How might we design an experience that replaces the human guide — without losing the warmth, history, and meaning that made those tours worth taking in the first place?
Before
Staff Guide
↓
Guided Tour
↓
Visitor
After
Self-Guided Tour
↓
Visitor
↓
History
Events
Services
Donations
Community
Project at a Glance
- Client
- The Women's Building
- Industry
- Nonprofit / Community Center
- Primary Users
- Visitors, Staff, Organization
- Organizational Goal
- Create a scalable visitor experience that deepens community engagement while reducing staff dependency
- Deliverable
- Bilingual self-guided mobile tour
Answering that question first meant understanding each of these groups more deeply — and whose needs would ultimately define what success looked like.
Who we were designing for
Each of those three groups — visitors, staff, and the organization — brought distinct needs that didn't always point in the same direction. Understanding how those needs overlapped, and where they created tension, became the foundation for every design decision that followed.
Balancing Three Stakeholder Needs
The Women's BuildingDefines Mission & Sustainability
↓
StaffMaintain & Update
VisitorsExplore & Learn
Community EngagementShared Outcome
VisitorsPrimary Users
The self-guided tour needed to support several types of visitors, each arriving with different motivations. Rather than designing for a single “average user,” we designed an experience flexible enough to support multiple visitor journeys.
Tap any card to reveal their goal and core needs
🏛️
🏛️
First-Time Visitors
tap to reveal
🏛️
Goal
Learn about the building's history and mission while exploring independently.
Core Needs
- Clear wayfinding through an unfamiliar three-story building
- Context that connects each space to the building's broader story
- Enough structure to feel oriented without staff support
- A sense of pacing so the experience doesn't feel overwhelming
tap to flip back
🌎
🌎
Spanish-Speaking Visitors
tap to reveal
🌎
Spanish-Speaking Visitors
Goal
Experience the tour comfortably in their preferred language.
Core Needs
- A full experience in Spanish, not an afterthought translation
- Layouts that accommodate longer text without losing readability
- Equal depth and quality across both language versions
tap to flip back
🎒
🎒
School & Community Groups
tap to reveal
🎒
School & Community Groups
Goal
Explore the building as an organized group — middle school, high school, or community visits.
Core Needs
- A clear entry point that works for groups arriving together
- Flexible pacing that accommodates different group sizes
- Educational storytelling that doesn't require prior knowledge
tap to flip back
Staff
Goal
Maintain and update the tour without relying on developers or additional operational resources.
Needs
- Easy content updates
- Reusable templates
- Long-term maintainability
- Minimal staff overhead
Success looked like
The organization could confidently maintain the experience after project handoff.
The Women's Building
Goal
Create a scalable visitor experience that strengthens community engagement while supporting the organization's long-term sustainability.
Needs
- Encourage donations
- Increase awareness of programs and services
- Promote events and community involvement
- Preserve the organization's history
Success looked like
The tour becomes an ongoing entry point into the organization's broader mission.
Understanding each stakeholder's goals helped us define what success actually meant — and gave us a framework for making decisions throughout the project.
Defining Success
Before opening Figma, we aligned with The Women's Building on what a successful experience needed to accomplish. Rather than optimizing for aesthetics alone, we established six guiding questions that became the benchmark we returned to whenever we evaluated competing ideas throughout the project.
Our decision-making framework
Every design decision began
with six questions.
- 01Does this preserve the building's story?
- 02Can visitors confidently navigate and understand the experience on their own?
- 03Will staff be able to maintain this after handoff?
- 04Does this encourage continued engagement?
- 05Is this realistic for the organization's long-term needs?
- 06Does this work equally well for every visitor, regardless of language or ability?
These six questions became the benchmark we returned to whenever we evaluated competing ideas throughout the project. Every design decision in the following sections can be traced back to one or more of them.
With a shared definition of success, we turned our attention to the constraints that would shape every decision that followed.
Designing Within Real-World Constraints
⚙️No Engineering Support
The final experience needed to function without custom development, requiring us to communicate rich information through static interfaces.
🔄Website Redesign Mid-Project
The Women's Building planned to launch a new website during our project, requiring us to adapt our work to an evolving visual identity.
🔑Long-Term Stewardship
The organization would ultimately maintain the experience, so every design decision needed to be realistic for staff without dedicated technical resources.
🌐Bilingual Experience
From the outset, English and Spanish were treated as equal experiences rather than one being translated after the other.
🏛️Existing Building
The Women's Building was never designed as a museum or guided attraction. There was no built-in signage or physical wayfinding — visitors had to navigate entirely through the experience we created. This directly shaped our approach to navigation, physical directions, the printed map, and how QR stops were organized throughout the space.
With a clear picture of who we were designing for, what success looked like, and the constraints we were working within, we immersed ourselves in The Women's Building — walking the space, speaking with staff, and uncovering the insights that would shape the experience.
Learning Before Designing
Before proposing solutions, we experienced The Women's Building the way visitors would. Walking through the space, speaking with staff, and documenting the environment helped us uncover opportunities that wouldn't have been obvious from behind a screen.
Site Visit

Tour Day, Spring 2025
Tour Journey
3
MaestraPeace Mural (Exterior)4
Interior Art Installations5
Rental & Community Spaces
Walking the Experience

↗ Natural transition point↗ Visitor decision point↗ Opportunity for QR tour stop
Observation
Without a guide, it wasn't always obvious where visitors should go next.
Design Insight
We mapped the building's natural circulation before defining tour stops, ensuring the experience followed intuitive movement through the space rather than an arbitrary sequence.
Design Decision
We aligned tour stops with natural transition points throughout the building so visitors could navigate confidently without staff guidance.
Observation
The staircase functioned as both a navigation landmark and an art installation.
Design Insight
While the staircase naturally encouraged visitors upward, relying on it alone would exclude some guests.
Design Decision
We incorporated the staircase into the narrative while clearly providing an equivalent elevator route so every visitor could experience the tour regardless of mobility.

↗ Transition to upper level↗ Accessible elevator alternative↗ Story continues upstairs

↗ Existing interpretation↗ Avoid redundant content↗ Add value beyond physical signage
Observation
Many exhibits already included interpretive text.
Design Insight
Rather than repeating information visitors could already read, we identified opportunities where the digital experience could add context, connect stories, or reveal perspectives not immediately visible in the physical space.
Design Decision
We designed the tour to complement existing interpretation rather than duplicate it.
Observation
Visitors naturally shifted their attention between the murals and their phones.
Design Insight
The artwork demanded attention. Long passages of text would compete with the environment instead of enhancing it.
Design Decision
We intentionally designed concise reading moments that encouraged visitors to alternate between observing the artwork and engaging with the digital experience.

↗ Attention shifts between environment and interface↗ Keep reading moments brief↗ Support environmental observation

↗ Tour extends outdoors↗ Building becomes part of the experience↗ Storytelling beyond the interior
Observation
The building itself functioned as an exhibit.
Design Insight
The MaestraPeace mural is one of The Women's Building's defining landmarks and an essential part of its story.
Design Decision
We intentionally extended the tour outdoors, allowing visitors to experience the mural while learning about its history, symbolism, and relationship to the organization's mission.
These observations became the foundation for every major design decision that followed.
Designing the Experience Architecture
One of our earliest design decisions was determining how visitors should progress through the digital experience. We explored multiple ways of organizing the tour while balancing engagement, navigation, accessibility, and the building's physical layout.
How should visitors progress through a long self-guided experience without becoming overwhelmed?
RejectedConcept A
One QR Code for the Entire Tour
Advantages
- Scan only once
- Simple onboarding
- Easy implementation
- Easy for visitors to keep track of
Tradeoffs
- Endless scrolling
- Easy to lose place
- One very long PDF
- Lower engagement over time
- Difficult navigation
- Few natural moments for visitor interaction
RejectedConcept B
One QR Code Per Stop
Advantages
- Bite-sized interactions
- Easy to revisit individual stops
- High engagement
- Creates anticipation
Tradeoffs
- Requires constant rescanning
- Increased interaction friction
- Easy to confuse QR codes
- Visitors may stop scanning altogether
- Requires significantly more wayfinding support
✓ SelectedConcept C
Three QR Chapters
Benefits
- Reduced cognitive fatigue
- Created meaningful progress checkpoints
- Matched transitions between floors
- Introduced anticipation through new chapters
- Created additional opportunities for contextual calls-to-action
- Balanced engagement with convenience
Breaking the experience into three chapters transformed one long static document into a series of manageable experiences that aligned naturally with the visitor's physical journey through the building.
The Final Experience Architecture
Visitor Entry — Main Entrance
Picks up printed map + QR Code 1
QR Code 1
Lobby
↓Community Resource Room
↓MaestraPeace Exterior Mural
Visitors begin with spaces closest to the entrance before briefly exiting the building to experience the mural.
↓Scan QR Code 2
QR Code 2
Rental Space (Ground Floor)
↓Stairs or Elevator
↓Rental Space (Second Floor)
The transition upstairs mirrors the building's natural circulation while maintaining an accessible route for every visitor.
↓Scan QR Code 3
QR Code 3
Art Installations
↓Reflection
↓Get Involved
↓Donate
The experience concludes by emotionally connecting visitors to the Women's Building before inviting them to continue supporting its mission.
Designing for Wayfinding
How visitors tracked their progress through the tour was a separate design challenge from the QR architecture. We explored two competing approaches.
Exploration 1
Exploration 2
Scroll to explore ↓Progress Timeline + Embedded Building Map — embedding the building map beneath every stop would continuously reinforce visitors' physical location throughout the tour.
Scroll to explore ↓Progress Timeline Only — removing the repeated map allowed the printed map to remain the primary navigation tool while the progress timeline communicated tour progress.
After evaluating both approaches, we realized the printed map already fulfilled the role of spatial navigation. Repeating the map beneath every stop introduced unnecessary redundancy and distracted from the content itself. Instead, we focused on a lightweight progress timeline that communicated current stop, overall progress, and corresponding map color — without overwhelming visitors.
Rather than duplicating spatial information throughout the digital experience, we allowed the printed map to remain the primary navigation tool while using a lightweight progress timeline to reinforce orientation and communicate progress.
Each stop uses a unique accent color that corresponds directly with the printed map, allowing visitors to immediately connect their digital progress with their physical location inside the building.
Refining the Experience
Designing the First Impression
Visitors needed immediate context before beginning a self-guided experience. We explored different ways of introducing the organization while balancing orientation, mission, and navigation without overwhelming first-time visitors.
Lobby — Lo-Fi Exploration
Scroll to explore ↓Tested onboarding structure, progress communication, and initial orientation for first-time visitors.
We established a consistent onboarding structure that immediately introduced the tour, communicated progress, and set expectations for the experience ahead.
Connecting Visitors to Community Resources
The Community Resource Room connected visitors to real organizations and community services. We explored ways of integrating educational content, resource cards, and community organizations without interrupting the narrative flow of the tour.
Community Resources — Lo-Fi Exploration
Scroll to explore ↓Explored how to surface community organizations and services naturally within the tour narrative.
Resource cards created a natural transition from learning about the Women's Building to engaging with its broader community network.
Establishing a Visual Language
With the structure in place, we turned to how the experience should look and feel. One of our earliest questions wasn't simply what the tour should look like — it was what it should feel like. We needed a visual language that respected the Women's Building's history while celebrating its creativity, community, and artwork.
RejectedDirection A
Editorial Minimalism
Characteristics
- Strong typography
- Editorial hierarchy
- Large whitespace
- Museum-inspired presentation
Strengths
- Excellent readability
- Historical content remained the focus
Tradeoffs
- Felt too institutional
- Missed opportunities for delight
RejectedDirection B
Expressive Maximalism
Characteristics
- Collage-inspired layouts
- Layered imagery
- Paper textures
- Organic composition
Strengths
- Captured the artistic spirit
- Reflected the surrounding artwork
Tradeoffs
- Reduced readability
- Less suitable for information-heavy stops
✓ SelectedFinal Direction
Contemporary Editorial System
Rather than one universal layout, this became a flexible design system — prioritizing clarity where information was dense, and visual expression where the artwork became the story.
Information-heavy stops — editorial hierarchy, structured layout
Art-focused stops — collage-inspired, visual storytelling
Rather than applying one visual style across every stop, we developed a flexible design system that adapted to each space — prioritizing clarity where information was dense and visual expression where the artwork became the story.
Because the experience existed entirely as a static PDF, we intentionally introduced changing layouts, timelines, architectural motifs, collage treatments, and varied information structures to create rhythm throughout the experience. These changes reduced visual fatigue while creating the feeling of progression without relying on animation or interaction.
Designing for Accessibility
Rather than designing an English tour first and translating it afterward, we treated both languages as equal experiences from the beginning. This required building layouts that could accommodate differences in text length while preserving hierarchy, readability, and visual consistency.
Representative Excerpt A
Representative Excerpt B
Scroll to explore ↓Flexible layouts accommodated Spanish text length variations while preserving hierarchy and readability.
Scroll to explore ↓Both language versions were treated as first-class experiences throughout the design system.
Supporting Spanish-speaking visitors required more than direct translation. Different languages occupy space differently, requiring layouts that remained flexible without compromising readability or visual balance. We designed a flexible visual system capable of accommodating varying text lengths while preserving the same hierarchy, pacing, and reading experience across both languages.
Accessibility isn't only about making experiences available — it's about ensuring every visitor receives the same quality of experience, regardless of language.
The Final Experience
The complete self-guided tour is now owned and maintained by The Women's Building. To respect the organization's intellectual property and paid visitor experience, only representative screens are shown below.
Representative Final Screens
Representative Screen
History of the Mural
Design Highlights
- ●Transformed more than three decades of mural history into a vertically paced timeline with clear chronological milestones.
- ●Alternated imagery and text across the central timeline to create visual rhythm and make a long historical narrative easier to scan.
- ●Used milestone colors that connect with the broader tour's color-coded navigation system.
- ●Placed the preservation call-to-action after visitors had learned the mural's history, allowing support to feel like a natural continuation of the story.
- ●Ended by introducing the original muralists, returning the narrative to the people responsible for creating MaestraPeace.
Representative Screen
A Closer Look at MaestraPeace
Design Highlights
- ●Paired concise walking directions with photographed mural details, connecting the mobile guide directly to visitors' physical surroundings.
- ●Divided the five-story mural into curated observation moments that encouraged slower exploration without overwhelming visitors.
- ●Sequenced navigation around recognizable landmarks—including the main entrance, the O'Keeffe-inspired roses, and the gated corner—making the exterior route intuitive to follow.
- ●Used alternating image-and-text compositions to create visual rhythm as visitors progressed around the building.
- ●Transitioned naturally from observation into the mural's history, creating one continuous storytelling experience.
Representative Screen
Rental Spaces
Design Highlights
- ●Created a reusable information structure combining room features, photography, ideal uses, historical context, and booking information.
- ●Designed the path to the Audre Lorde Room as a visually scannable sequence using real photographs, environmental landmarks, and concise step-by-step directions.
- ●Included both the staircase and elevator routes so visitors could easily understand the accessible path without relying on staff assistance.
- ●Embedded booking opportunities after visitors had explored each space, allowing calls-to-action to feel like a natural extension of the experience rather than a separate marketing page.
- ●Connected room rentals directly to the Women's Building's mission by explaining how reservations help support community programming.
Representative Screen
Art Installations
Design Highlights
- ●Adapted the design system for artwork that required less explanatory text and greater visual emphasis.
- ●Used collage-inspired layouts, layered imagery, paper textures, and expressive typography that reflected the artistic character of the installations.
- ●Incorporated location-based prompts that connected each digital story to the artwork's physical location within the building.
- ●Balanced artwork descriptions, artist context, historical significance, and interpretation while maintaining a highly readable editorial layout.
- ●Concluded the experience with clear end-of-tour instructions that provided visitors with a satisfying sense of completion.
Designing a Unified Wayfinding System
Design Highlights
- Designed the printed map and digital guide as one cohesive navigation system rather than two separate artifacts.
- Assigned every tour stop a unique color and icon, allowing visitors to quickly distinguish locations throughout the experience.
- Reused the exact same color-coded stop timeline at the beginning of every digital stop, highlighting the visitor's current location while showing overall tour progress.
- This shared visual language helped visitors seamlessly connect their digital progress with their physical location inside the building, reducing navigation uncertainty throughout the experience.
Final Deliverables
- ✓ Bilingual self-guided tour
- ✓ Interactive PDF experience
- ✓ Printed visitor map
- ✓ Color-coded navigation system
- ✓ Flexible editorial design system
- ✓ Staff-ready editable files requiring no developer
Designing the final experience was only one measure of success. What made this project especially meaningful was seeing it become part of a real community space — supporting visitors, generating revenue for the organization, and continuing to tell stories long after our semester had ended.
Impact, Outcome & Reflection
Impact & Outcome
Our mentors at The Women's Building were ecstatic with the final deliverable. They expressed immense gratitude for the resource we had created and welcomed us to attend the grand opening of the tours. (We were unfortunately unable to make it, but that invitation meant everything.) They shared how meaningful it was to receive something made with such care.
The tour launched in August 2025 and is available every Tuesday from 10:00 AM–3:30 PM with $5 admission. Since launching, the tours have run consistently with overwhelmingly positive visitor feedback. Beyond engagement, visitors who complete the tour regularly purchase merchandise afterward, generating direct revenue for the nonprofit at a critical time.
For a building navigating budget cuts and limited staff capacity, creating a bilingual self-guided experience that staff could update independently — without requiring a developer — helped support both accessibility and long-term sustainability.
Knowing that visitors are now experiencing the building's history and stories through something our team built is something I carry with real pride.
Client Testimonial
"Tanvi was an exceptional project lead and designer. She is organized, communicative, and possesses a remarkable eye for detail. Her natural ability to incorporate every nuance of our organization into the project was incredible; she seamlessly blended the new product into our existing ecosystem while pushing us to adopt a fresh perspective on how we engage with our community. Ultimately, our new self-guided tours created a more inclusive environment and drove revenue growth for our non-profit at a critical time."
— Betty Azori, The Women's Building
Reflection
This project reminded me why I chose design in the first place. I witnessed firsthand how creativity, when paired with empathy and compassion, can uplift communities, connect people, and honor culture. Learning about the impact The Women's Building has on the people and families around it made the work feel urgent in the best way possible. It sparked something in our team that made us all want to give it everything we had. Seeing the tour in use today brings me genuine pride and joy.
This was also my first time co-leading a team of seven designers. I learned how to create structure without sacrificing humanity — balancing organization, communication, and accountability while making space for the wellbeing of the team. I showed up every week with snacks, planned bonding activities and warm-up exercises, and ended the semester by giving everyone Women's Building-themed bouquets alongside handwritten notes celebrating what they had contributed.
That experience reinforced something I continue to believe:
When people feel seen, supported, and valued, they do their best work.
I also found an incredible co-lead in Taylor Tsan. We divided responsibilities according to our strengths, communicated openly, and trusted each other completely. Because of that partnership, the entire project ran smoothly from beginning to end.
Looking Forward
If I were to continue this project, I would conduct post-launch usability testing with visitors to better understand how different audiences navigate both the physical and digital experience. Observing real visitors would allow us to validate our assumptions, identify moments of friction, and continue refining the experience over time.
I'd also love to revisit this project with the tools available today. When we built the tour, agentic AI and modern rapid-development workflows weren't nearly as capable as they are now. Given the opportunity, I would transform the experience into a fully interactive web application — complete with ambient audio, guided narration, subtle transitions, and richer interactions that deepen visitors' connection to the space.
The goal wouldn't be to add technology for its own sake, but to make the Women's Building's stories feel even more immersive while preserving the warmth, accessibility, and intentional pacing that made the original experience successful.
This project fundamentally changed how I think about design. It taught me that meaningful experiences aren't defined by complex technology — they're created through thoughtful systems, intentional storytelling, and a deep understanding of the people you're designing for.
If I could do this project all over again, I would — without hesitation. It remains one of the most rewarding, memorable, and meaningful experiences of my time at Berkeley.