Design-Based Research Capstone

Poway Symphony Orchestra Capstone

A design-based research capstone focused on expanding community engagement through a more accessible, modern, and story-driven Poway Symphony Orchestra website experience.

Status: Research and Testing Phase (Deployed Prototype Complete)
Team: Wi-Fighters, Meryl, Kailyn, Hope, Laya

Poway Symphony Orchestra - Connecting Community Through Live Music

Redesigned Website Experience

Home page introduces the orchestra with a cleaner layout, accurate mission content, and faster access to concerts, donations, and events, replacing the original's dense text block and image-only structure
Concert section shows real 2025-2026 season data with a live countdown, interactive calendar, and ticket links, replacing the original's external-only event flow
Conductor section presents John LoPiccolo's biography and PSO history in a structured, visually engaging format instead of a single text-heavy page
Musician directory includes roster cards organized by section with instrument filters and audio playback instead of a plain text roster
EXP bar gamifies browsing so visitors see progress as they move through the experience
Orchestra Builder turns section placement into an interactive milestone that teaches how a symphony is structured
Responsive layout keeps the full experience usable across phones, tablets, and desktops
Join section consolidates rehearsal schedules, registration info, attire, and contact details in one place
HTML CSS JavaScript Responsive Design Figma User research and testing Flask Backend Integration

Interactive Elements

EXP Bar: Visitors earn visible progress as they move through the site, turning browsing into a guided journey
Orchestra Builder: Users place instrument sections onto a real stage layout and unlock a featured PSO performance on completion
Virtual Conductor: A rhythm game that puts the user in the conductor's role, keeping time the way John LoPiccolo guides the ensemble
Tuning The Orchestra: Users experience tuning the ensemble before a performance, making the pre-concert ritual tangible and educational
Musician Profiles and Audio: Visitors explore roster cards filtered by section or instrument and hear audio tied to each family of the orchestra

About

This project redesigns the PSO's existing Google Sites-based website into a full custom web experience. Where the original site is a static, text-heavy Google Sites page with minimal navigation and no interactivity, the capstone site introduces dynamic concert listings, interactive games, a musician directory with section filtering, media playback, and gamified exploration while preserving the real orchestra's content accurately.

Problems Solved

The original site is built on Google Sites with no custom interactivity -> we rebuilt it as a fully custom site with dynamic content and user engagement features
The original musician page is a plain text list -> we replaced it with filterable profile cards and section audio
The site felt passive and informational only -> we introduced the EXP bar, games, and interactive milestones to reward exploration

Wow Factors

The capstone preserves real PSO content while significantly modernizing how visitors discover and interact with it
Concert, conductor, musician, support, and join experiences are all surfaced within one cohesive on-site journey
EXP progression and Orchestra Builder make an arts organization website feel interactive without losing accuracy or professionalism
Games like Virtual Conductor and Tuning the Orchestra make symphonic concepts tangible for broader community audiences
The live deployed frontend and admin UI demonstrate that the project moves beyond mockups into a working prototype

Improvements Made

Rebuilt the original Google Sites experience as a custom frontend with modern layout, richer navigation, and interactive storytelling
Integrated real concert season data, ticket links, and time-based event elements directly into the site
Replaced passive text sections with structured content modules for the conductor, musicians, support, and join flows
Added interactive games, progress tracking, and media elements to turn browsing into guided participation