Skip to main content
Deep Dive

The Women's Building

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
The Women's Building northeast corner, San Francisco
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.
Guided Tours
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
🏛️
First-Time Visitors
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.
  1. 01Does this preserve the building's story?
  2. 02Can visitors confidently navigate and understand the experience on their own?
  3. 03Will staff be able to maintain this after handoff?
  4. 04Does this encourage continued engagement?
  5. 05Is this realistic for the organization's long-term needs?
  6. 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
The design team walking The Women's Building alongside staff on Tour Day

Tour Day, Spring 2025

Tour Journey
1
Lobby
2
Community Resource Room
3
MaestraPeace Mural (Exterior)
4
Interior Art Installations
5
Rental & Community Spaces

Walking the Experience

The Women's Building hallway
Natural transition pointVisitor decision pointOpportunity 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.

The Women's Building staircase
Transition to upper levelAccessible elevator alternativeStory continues upstairs
Flag and interpretive text at The Women's Building
Existing interpretationAvoid redundant contentAdd 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.

Interior murals at The Women's Building
Attention shifts between environment and interfaceKeep reading moments briefSupport environmental observation
MaestraPeace mural exterior of The Women's Building
Tour extends outdoorsBuilding becomes part of the experienceStorytelling 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?

Rejected
Concept 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
Rejected
Concept 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
✓ Selected
Concept 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.
placeholder
✓ Selected
Exploration 1
Exploration 2
9:41
●●●
Exploration 1 — Progress timeline with embedded building map
Scroll to explore ↓

Progress Timeline + Embedded Building Map — embedding the building map beneath every stop would continuously reinforce visitors' physical location throughout the tour.

9:41
●●●
Exploration 2 — Progress timeline only
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
9:41
●●●
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
9:41
●●●
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.
Direction A — Editorial Minimalism
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
Direction B — Expressive Maximalism
✓ 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.

9:41●●●
Contemporary editorial — information-heavy stop

Information-heavy stops — editorial hierarchy, structured layout

9:41●●●
Contemporary editorial — art-focused stop

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
9:41
●●●
Spanish tour — representative excerpt A
Scroll to explore ↓

Flexible layouts accommodated Spanish text length variations while preserving hierarchy and readability.

9:41
●●●
Spanish tour — representative excerpt B
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

9:41
●●●
History of the Mural — representative final screen
Scroll to explore ↓
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

9:41
●●●
A Closer Look at MaestraPeace — representative final screen
Scroll to explore ↓
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

9:41
●●●
Rental Spaces — representative final screen
Scroll to explore ↓
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

9:41
●●●
Art Installations — representative final screen
Scroll to explore ↓
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

Physical map — the printed companion to the digital experience
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.