Roles:
UI/UX, Branding
Tools:
Figma, Adobe Illustrator,
Adobe After Effects
Project Type:
Full prototype on Figma,
Complete brand identity
Timeframe:
12 Weeks, 2024
The Challenge: Traditional bar-hopping lacks engagement beyond finding locations. Many speakeasies have unique stories but no interactive way to experience them.
Opportunity: Create a gamified, narrative-driven app that enhances the exploration of hidden bars, providing an engaging and seamless discovery experience.
Key User Needs
Clue-based exploration rather than direct location listings.
Authentic speakeasy atmosphere through visuals, sound, and interactivity.
Clear navigation & accessibility for a diverse range of users.
Research & Discovery
Methods Used:
Competitor Analysis: Studied existing nightlife apps, escape room experiences, and AR-based games.
Primary Research: Focus groups and user interviews on social experiences, app expectations, and usability.
User Personas: Defined key audience types (casual explorers, history enthusiasts, nightlife seekers).
Key Insights:
Users want a dark, moody aesthetic to match speakeasy themes.
Gamified experiences increase engagement, but flexibility in navigation is important.
Accessibility features like text-to-speech and visual contrast improve usability.
Ideation & Design Process
Wireframes & Early Concepts:
Designed linear and non-linear exploration paths.
Created an Art Deco visual identity to reflect the era’s aesthetics.
Key Design Decisions:
Dark, immersive color scheme for an authentic speakeasy feel.
An interactive clue system that allows users to reveal hints progressively.
AR simulation of hidden entrances to enhance realism.
Prototyping & Testing
User Testing Methods:
Focus Groups: Evaluated engagement, accessibility, and ease of use.
Field Testing: Real-world navigation to assess app usability in different environments.
Iterations Based on Feedback: Adjusted aesthetics, navigation, and clue presentation for clarity.
Key Refinements:
Darker home screen & map UI for brand consistency.
Added accessibility options (text-to-speech, high-contrast modes).
Non-linear exploration to improve user flexibility.
Enhanced AR simulation with clearer imagery and location hints.
Final Design
Features:
Narrative-driven discovery of hidden speakeasies.
Immersive UI & branding with Art Deco influence.
Interactive clues & AR entrance simulation.
Accessibility-enhanced navigation & text-to-speech options.
Flexible location progression for a personalized experience.
Reflection & Next Steps
Key Takeaways:
User feedback was crucial in refining aesthetics and usability.
Balancing immersion with accessibility is essential for engagement.
First time using Figma – improved my proficiency in wireframing and prototyping.
Future Opportunities:
Introduce real AR integration instead of a simulated experience.
Expand with historical storytelling beyond speakeasies.
Develop a collaborative hunt mode for groups.