Case Study - UI/UX Design · Figma · Prototyping
Theme park apps are built for insiders. Disney and Universal's official apps reward guests who've done weeks of homework, learning which Lightning Lane type applies to which ride, which dining reservation system requires a credit card, what "VQ" means, and which parks require park-to-park tickets for specific lands.
For first-timers and irregular visitors, the actual majority of guests, these apps are anxiety machines. They're designed around the assumption that you already know what you're doing.
Screen Park is built for everyone else.
"The parks are supposed to be fun. We handle the rest."
Target User: Families visiting every 1 to 2 years. Overwhelmed by complexity, underwhelmed by what the official apps actually explain. They want a great day, not a certification course.
My Disney Experience (MDE). Powerful but overwhelming. Feature-dense with a learning curve. Terms like "Lightning Lane Multi Pass" vs "Individual Lightning Lane" require explanation Disney doesn't provide in-app. Good for power users. Bad for first-timers.
Universal Official App. Cleaner than MDE but still park-first, not guest-first. Map and wait times are solid. Intel is sparse. No community layer, no insider tips, no "what does this actually mean" explanations.
Ride Ready and third-party apps. Closer to the right idea but cluttered, ad-supported, and designed around data density rather than an actual guest journey.
"Every app I studied was built for the person who already knows. Nobody built for the person who doesn't."
The gap wasn't information. Both official apps have plenty of information. The gap was translation, converting park complexity into a plain-language, guided experience that anyone could pick up and use in the first 60 seconds.
Before a single screen was designed, the design system was built. Color palette, typography scale, icon language, component library, all locked, all documented, all componentized with variants before any screen touched them.
Screen Park needed a mark that could survive being shrunk to a 48 pixel app icon and still communicate the concept instantly. I sketched the first version on a sticky note during the Figma course, imagining a roller coaster crest anchored to a pin. The course covered vector drawing and shape tools around the same time, so I applied those lessons directly to bringing the sketch to life.
Final lockup, dark mode variant
Every major UX decision in Screen Park has a documented rationale. These aren't aesthetic choices - they're answers to real problems observed in competing apps.
This project didn't start with 41 screens. It started with a sticky note sketch, a Figma course that was three days old, and a decision to build something real instead of following along with tutorial files. What follows is the honest version of how ScreenPark came together: the research that shaped it, the architecture that structured it, the iterations that refined it, and one mid-build move that changed how the whole thing was tested.
Sarah and Luis Lopez aren't a made-up archetype. They're a composite of every family I've watched navigate a theme park — and I've spent a lot of time in those parks. The behavior is consistent: phone out constantly, confused at the map, missing shows they didn't know existed, spending too much on food because they didn't know the hacks, leaving exhausted instead of exhilarated.
The quote that anchored every design decision in this project came from a real conversation:
"I didn't know you had to book dinner 60 days in advance. We ended up eating corn dogs at 4pm because everything was full. Never again."
That's the user. Every screen was filtered through that lens: would Sarah understand this in two seconds, standing in a crowd, with a seven-year-old pulling her sleeve?
Before a single high-fidelity screen was touched, the full information architecture was mapped. Five tabs, each owning a distinct job. A seven-step onboarding flow designed so that every question fed directly into a useful output. The Genie Survey collects thrill level, max wait tolerance, food preferences, daily budget, party ages, and experience level. That data doesn't just personalize the experience — it builds the entire day plan automatically.
The tab structure decision mattered most. Both official apps use hub-and-spoke navigation with heavy menus. ScreenPark uses a flat five-tab bottom nav because this app gets used one-handed, mid-stride, in loud and crowded environments. Every primary destination needed to be one tap from anywhere. No menus, no drilling, no getting lost.
Most park apps color-code their maps by land. The logic makes sense at the macro level — you can orient yourself across the whole park at a glance. But land-coded color only helps when you're trying to figure out where you are relative to the entire park.
The problem is that's not the most common navigation need. Most of the time, guests are already inside a land and need something specific right now. A bathroom. A food cart. A photo op. At that point, a land-coded map tells you nothing useful because everything around you is the same color.
ScreenPark codes by function instead. You learn the system once and it works in every land, in every park, on every visit. Your seven-year-old can find the bathroom in two seconds without reading a legend.
Useful for macro orientation across the whole park. Stops being useful the moment you're already inside a land and need something specific right now.
Learn it once, works everywhere. Every land, every park, every visit.
Midway through building the Universal flow — before the Disney variant was started and before the prototype was wired — the file got closed and a day was spent at the actual parks. Not as a guest. As a researcher.
Families weren't consulting the map at ride entrances, they were consulting it in the middle of walkways, stopped in foot traffic. The moments of confusion weren't about features — they were about orientation: where am I, what's near me, what should I do next. The phone came out most at decision points, not at attractions.
That observation directly influenced the Near Me feature in the Park tab, the Land Intel card behavior in Discover, and most significantly, the Closing Hour Ritual.
The ritual came from watching families at park close with no exit strategy. They'd been reactive all day and were now standing in a parking lot figuring out what just happened.
One hour left. One last ride based on live waits. Best spot to watch the lights come on. Final snack near the exit. How to beat the parking crush. A designed ending — something no official app has.
"Don't worry, we got this" is the entire philosophy of ScreenPark in four words.
Three specific components went through documented rounds of iteration. Each one has a clear problem, a clear decision, and a clear reason.
The first version had category tags on the left side of each list item, ahead of the activity name. In testing the drag interaction, left-leading tags created visual noise at exactly the point where the eye needed to track reordering. Tags moved to right-trailing position. The left edge became clean, the drag handle sat flush, and the list became readable in motion.
Three changes in one pass. "Absolute No-Gos" simplified to "No-Gos" — cleaner, less intimidating. Arrival Time added as a standalone field because the day plan was generating time-stamped slots with no anchor. Most significantly, Switch Park or Resort promoted from a buried settings row to a full-width primary CTA — multi-park ticket holders switching mid-day is common, it happens under time pressure, and it triggers a full replan. Burying it was the wrong call.
The icon system went through three documented rounds. The first pass established the function-color logic and rough geometry. The second resolved shapes at 48px and confirmed legibility across all six categories in context. The third locked the final set: fully geometric, consistent stroke weight, readable at small sizes without labels. The function-coded language is what makes the map work at a glance — getting the icons right at small sizes is what makes the language trustworthy.
The Secrets tab inside Discover exists because of a specific frustration with how theme park knowledge gets distributed. The Butterbeer foam hack, the single rider line on Hagrid's that cuts 90 minutes to 20, the child swap program most parents with young kids have never heard of — these live on YouTube channels and Instagram accounts that require following, subscribing, and already knowing where to look.
That's a class system. The people who know get better days. The people who don't, don't.
The Untappd-style community model was the answer: users submit tips, the community votes, an editorial layer verifies. Nothing is locked behind a follow. A first-timer gets the same information as someone who's been fifty times. That's the entire philosophy of ScreenPark expressed as a single feature.
Five tabs. Each one a distinct, complete experience. The architecture is designed so guests can navigate entirely by context - where they are, what they need, when they need it.
Screen Park is designed as a multi-resort platform. The Universal Orlando and Walt Disney World variants share identical information architecture, navigation logic, and interaction patterns. Only the color language and content adapt.
This symmetry is the point. Once a guest learns a feature in one park, they own it everywhere. That shared muscle memory matters most when it counts, heads down in thick crowds, kids tugging on a sleeve, two minutes to decide the next move. Confident navigation translates directly into faster decisions, fewer missed reservations, and more time actually in the experience.
Started the Figma course April 9. Cert in hand April 14. True prototype build started April 17. Four days later this existed. The eleven days matter because they show the ramp -- the four days matter because they show what happens when the ramp is done.
A selection of screens from the Universal and Disney flows. Each screen was designed to component spec and updated with the final icon and nav component library.
This project taught me more about design systems than any tutorial could. The constraint of building a second variant (Disney) after completing the first (Universal) forced every decision I made in the design system to be defensible. If a component couldn't adapt to a different color language while keeping the same structure, it wasn't actually a system - it was a one-off.
I went to Universal's parks mid-build specifically to stress-test the UX assumptions in the app against real guest behavior. Watching how actual families navigate the parks - the moments of confusion, the missed turns, the time spent looking at phones instead of the experience - confirmed every design decision I'd made and surfaced a few I hadn't thought of.
The anti-gatekeeping model is the one I'm most proud of. Theme park expertise shouldn't be a class system. The Butterbeer foam hack, the best photo spot at golden hour, the single rider line on Hagrid's that nobody advertises, the child swap program that lets parents with young kids take turns on thrill rides without re-queueing, these are the things that make the difference between a stressful day and a great one. Screen Park exists to equalize that.
For seven years at SOPO I designed in Adobe XD, the tool the company paid for and standardized on. When our developers recommended moving to Figma, I advocated for the switch. Leadership chose to stay on XD, so I kept shipping on XD, biweekly updates across five platforms for 25+ full redesigns. The work speaks for itself.
The industry, understandably, has moved on. Figma is the current standard, and matching the standard is table stakes. So I closed the gap. Eleven days to get fluent, four days to build something that shows what I can do with it. Screen Park isn't my proof that I can design, my portfolio already does that. It's my proof that when the tooling shifts, I shift with it fast, and I raise the bar on myself in the process.
