November 2024
UI/UX Design
Challenge & Results
Two identities. One site. Zero clarity.
Ravinia came to us with a clear problem, stated plainly by their team: "Ravinia is a unique venue that is complicated and mysterious for a first-timer. We provide a ton of written information, but it's overwhelming."
On top of that, the site had to carry two completely different stories: a world-class summer festival with 100+ performances, and a year-round nonprofit running music education programs in schools across Chicago. Neither story was landing.
And it all needed to shift seasonally, the same site had to feel like a festival destination in the summer and a mission-driven organization in the off-season.
100+
Annual Performances
shown on the redesign
400K
Annual guests needing a clear path to the right information
1.35M
Visits per quarter on the redesigned site
Pre-Redesigned ravinia.org
Redesigned ravinia.org
The Dual-Sided Challenge
A festival in summer. A nonprofit all year.
Ravinia Festival is the oldest outdoor music festival in North America, hosted each summer in Highland Park, just outside Chicago, with over 100 performances ranging from the Chicago Symphony Orchestra to pop headliners.
But beyond the stage, Ravinia operates as a full nonprofit, running music education programs in schools across the Chicago area year-round.
The design had to honor both identities without one swallowing the other. That meant building a dynamic system, not just a layout.
Festival / Ticketing
Education / Nonprofit
Chicago Symphony Orchestra
Seasonal
Discovery & Process
Starting with the problem, not the pixels.
Before touching Figma, I worked directly with the Ravinia team to understand their content, their audience, and where the old experience was breaking down. The steps below walk through that process, with the search bar as a live example.
1
Content audit & hierarchy
The old site had the information, but it just wasn't organized for how people actually think. We mapped out what a first-timer needs to know vs. what a returning patron needs to access quickly, then laid out wireframes around that.
2
Competitive & reference analysis
Through our call we referenced other carbonhouse sites and performing arts with a high level of imagery and color coding needs.
3
Wireframe Exploration
After address needs and concerns I laid out wireframe options to help functionality and usability was efficiency before diving into brand redesign.
4
High-fidelity Figma design
Translated goals into high-fidelity Figma designs, building out a flexible component system and partnering with developers to bring it to life in carbonhouse's Showtime CMS.
Search, wireframe
Search, high-fidelity
Search, mobile
Key Core Decision
An Event Card connected to a dynamic Event Detail Page
Ravinia runs 100+ performances a season. Patrons needed to scan fast: show name, date, venue, series type, all readable without clicking. The event card handled that.
Once they clicked through, the Event Detail Page carried the rest. Ticket types (Pavilion, Lawn, and beyond) surface dynamically per showing, so pricing is always specific, never generic. Accessibility icons for OC, CC, and audio description are built directly into each individual event, not buried in a FAQ.
And anchored to every page: a Know Before You Go section. Parking, doors, what to bring, seating rules. Day-of information that used to live across five pages, now one scroll from the ticket button.
Sat, may 23, 2025
12:30pm
Buy Tickets
Sun, may 23, 2025
1:30pm
Buy Tickets
Hunter Pavilion
Get Now
Still needing a chair?
Doors & Times
Getting Here
Key Core Decision
A flexible tile system built for two brands and all four seasons.
Title Goes Here
Lorem ipsum odor amet, consectetuer adipiscing elit.
Button Text
More Info
Get in Touch
Here to help!
Learn More
Steans Institute
Empowering the next generation of musicians
Summer Day Camps
Enriches community day camp programs for 1,400 children with music classes and instrument-making and performance opportunitie
Learn More
Title Goes Here
Lorem ipsum odor amet, consectetuer adipiscing elit.
Button Text
Title Goes Here
Lorem ipsum odor amet, consectetuer adipiscing elit.
Button Text
The Outcome
A site that works as hard as the organization does.