What is Jendrix Rock Bar Website?
Jendrix Rock Bar Website is a pro bono design proposal for a live music venue and themed bar in my city. The project was carried out with the goal of creating an immersive digital experience with a strong brand identity that would attract users to visit the venue and attend their free events. The main challenge was balancing a bold aesthetic rich in visual content with technical feasibility and performance, which is crucial for event promotion.
💡 The Challenge and Research: Design for Identity and Engagement
User Profile and Emotional Motivation
User research focused on understanding the rock music fan's motivations: they seek authenticity, clear event information, and a digital experience that reflects the venue's energy. This led us to define a strategy where Visual Design would be the main engine.
Interface Goal
The design focused on a single conversion goal: that the user visits the bar or check information about an event. The interface had to be functional, but above all emotional, utilizing your Illustration background for the distinctive look and feel.
Moodboard
🗺️ UX Strategy: Event Flows and Conversion to Attendance
Event Agenda as the Central Element
The UX strategy positioned the Event Agenda as the most important navigation and conversion element. The user flow was designed to simplify the search for bands and date information, minimizing friction when accessing event information or the bar's location.
Immersive Mobile-First Design
The design was developed with a Mobile-First approach, ensuring that the heavy visual aesthetic and image loading were efficient and attractive on small screens.
Paper Crazy 8s
User Flow for Viewing Event Details
Homepage Wireframe
Events Page Wireframe
💻 Technical Feasibility and Hybrid Role: Performance and Multimedia Content
Technical Feasibility of Aesthetics (Performance)
Websites with strong branding and abundant multimedia content often suffer from performance issues. My Frontend Development experience allowed me to specify solutions such as the use of optimized image formats (WebP), the implementation of lazy loading, and a lightweight component architecture, ensuring the bold aesthetic was fast and efficient.
Prototyping Dynamic Interactions
I used high-fidelity prototypes to simulate the site's dynamic interactions (e.g., transitions, band carousels), which are essential for the immersive experience. This guaranteed that the visual design was optimized for a clean code implementation and good navigation performance.
Hand-off Dev Annotations (Images)
Hand-off Dev Annotations (Text)
Hand-off Dev Annotation (Carousel Component)
🎨 Visual Design: Immersive Branding and Musical Aesthetic
Immersive Design and Branding
Leveraging my experience in Illustration and Graphic Design, visual design was the main driver of the UX. A dark color palette and custom typographies were defined to convey the raw energy of rock. Unique brand assets were designed that reinforce the bar's personality and authenticity.
Emotional Visual Hierarchy
The use of textures, contrasts, and an adaptive grid was defined to guide the user's gaze directly to event information and calls to action (CTAs), balancing the visual chaos of rock with a functional hierarchy.
Mobile Homepage
Tablet Homepage
Desktop Homepage
Mobile Homepage Scroll
Mobile Events Page Scroll
Mobile Drinks Menu Page Scroll
Mobile Games Page Scroll
Mobile About Us Page Scroll
📈 Conclusion, Impact, and Learning
Impact and Brand Communication
The final proposal is a website that is not only usable but acts as an authentic extension of the Jendrix brand. The design is optimized to increase event attendance and prolong user stay on the site, converting digital visitors into regular customers of the bar.
Key Learning
The Jendrix project taught me that the best UX is one that reflects the brand's personality without compromising functionality and performance. It demonstrated how merging Design Thinking with a solid foundation in Graphic Design can create emotionally authentic and memorable digital experiences, even in a pro bono collaboration project.
Step 1: Visit Jendrix Rock Bar
Step 2: Review the events and select one.
Step 3: Check the event details and sign up.
