Transforming Event Experiences: A Whova UX/UI Makeover
Overview
Whova is a comprehensive event management and networking application designed to transform how event organizers and participants discover, manage, and connect at live events. This redesign project addresses the fragmented landscape of outdated event platforms by creating a seamless, integrated experience that combines event management with vibrant community engagement.
Team
Role
Duration
Tools
The Problem
The existing Whova application suffered from several critical usability issues that hindered the event experience for both organizers and participants. The primary problems included an uninviting user interface that created barriers to user engagement, poor information hierarchy that made it difficult for users to find essential event details quickly, inconsistent navigation patterns that caused confusion across different app sections, and lack of meaningful networking features despite events being inherently social experiences. Users struggled with complex workflows, unclear visual feedback, and fragmented functionality that required multiple steps to complete basic tasks. The interface lacked the clarity and intuitive design necessary for users who are often multitasking during busy event schedules.
Re-Branding
The Whova logo redesign retains the essence of the original concept while enhancing its visual appeal and brand alignment. The logo symbolizes a user cheering, subtly forming a 'W' and incorporating small rectangles to represent analytics from event participation. Key changes include softening the edges of the rectangular elements for a more approachable look, tapering the ends of the linear elements to convey movement, and resizing a small rectangle to resemble a head for improved balance. The fonts Mansalva and Karla were chosen for their creativity and playfulness, complementing the logo style. Shades of blue were selected to evoke trust and professionalism, enhancing the logo’s friendliness and dynamism while effectively capturing Whova's identity as an innovative event management platform.
Research
SWOT Analysis
I Conducted comprehensive analysis revealing key insights into Whova's market position. Strengths included a functional event management system and customization options, while weaknesses centered on the uninviting interface and pricing transparency issues. Opportunities existed in streamlining processes and enhancing networking, with threats including technical reliability concerns and scalability challenges.
User Personas
To better understand user needs, I identified three distinct personas reflecting the core stakeholders of the event experience. The Event Attendee values efficient navigation, quick access to session details, and meaningful opportunities to network with peers. The Event Exhibitor is focused on generating leads, increasing booth engagement, and showcasing their brand effectively within the app. Meanwhile, the Event Sponsor prioritizes access to real-time analytics, engagement tracking, and visibility throughout the platform to measure ROI and impact. These personas helped guide design decisions that addressed varying goals while maintaining a cohesive and intuitive user experience.
Key Insights
Users needed simplified navigation with clear visual hierarchy
Community and networking features were highly desired but poorly implemented
Mobile-first approach was essential for on-the-go event attendees
Consistency across interface elements was critical for user trust and efficiency
Process
Analysis and Planning
Design Process
Low Fidelity Design
I started with rapid pen-and-paper sketches to explore different approaches to information hierarchy and networking features. This kept the process agile and focused on core functionality over visual polish. After creating initial sketches, I developed low-fidelity wireframes focusing on key screens: Home, Agenda, and Attendees. The mobile-centric approach ensured optimal accessibility for users navigating events on-the-go, with hierarchical grid systems enhancing navigation and decluttering interfaces.
Medium Fidelity Design
In this Whova UX/UI case study, the focus has been on medium fidelity wireframes, offering a preliminary visualization of key screens: Home Screen, Agenda, and Attendees. The redesign prioritizes a mobile-centric approach, ensuring optimal accessibility for users on the go. The Home Screen introduces a hierarchical grid system, enhancing navigation and decluttering the interface. The Agenda page employs a modular grid system for efficient event scheduling, aiming to simplify navigation and improve content understanding. The Attendees page features a hierarchical grid system for organized profile viewing, emphasizing decluttered and streamlined interactions. These Lo-Fi wireframes lay the foundation for a user-centric design strategy, with subsequent phases poised to refine and evolve these concepts toward High-Fidelity iterations, ensuring a polished and effective Whova mobile application.
High Fidelity Design
I developed comprehensive high-fidelity designs that brought the Whova redesign to life. Each screen received careful attention to create an immersive user experience highlighting seamless navigation, personalized content, and enhanced networking capabilities.
Solution
Revamp 1: Enhanced Home Experience
The revamped screen showcases impactful enhancements aimed at elevating the overall user experience. The addition of a back button facilitates seamless navigation, providing users with an effortless way to return to the previous screen. The relocation of the profile icon to the right ensures a consistent and visually balanced layout, contributing to an improved overall aesthetic. Strategic adjustments have been made to enhance visibility, with the event profile picture and information now positioned to avoid any obstruction of the banner. Essential event details have been elevated to a prominent top position, ensuring users can quickly access critical information. The inclusion of a map feature allows users to precisely locate the event and seamlessly open it in their phone maps for added convenience. Furthermore, the introduction of a collapsible/expandable option optimizes space utilization, culminating in an enhanced and more user-friendly interface.
Revamp 2: Intelligent Agenda Management
Several optimizations have been implemented to refine user navigation and streamline the overall experience. A filter icon on the left enhances content refinement, while relocating the profile icon ensures visual consistency. Separating the search bar minimizes clutter, improving the overall layout. Agenda tabs were redesigned for prioritized information, and an 'Add to My Agenda' button facilitates seamless user interactions. Introducing a 'Win a Prize' tag adds gamification and encourages engagement. The choice of the Poppins font elevates readability, contributing to an enhanced overall design.
Revamp 3: Immersive Event Discovery
An enhanced navigation experience is achieved through the introduction of a back button, facilitating seamless transitions between screens. Ensuring design consistency, the profile icon is strategically relocated to the right. The reorganization of event information emphasizes clarity, positioning speaker details below the event info for improved hierarchy and visual flow. The 'Win a Prize' section boasts a revamped UI with interactive animations, enhancing user engagement. Collapsible options under 'Event Insights' and 'Virtual Access' are redesigned, maintaining a cohesive aesthetic with the consistent use of the primary color palette and Poppins typography.
Revamp 4: Connected Community Hub
The redesigned screen incorporates several enhancements for a cohesive and user-friendly experience. Additional option icons are placed on the left of the top navigation, improving accessibility to key features. The profile icon is shifted to the right for a consistent and standardized layout. Separating the search bar from the top nav enhances clarity and organization. The button UI has been revamped for a modern look, and new replies notifications are more prominent, ensuring users don't miss important updates. Community cards are rearranged for improved information hierarchy, featuring a new follow button for user engagement. The pin icon is shifted to the right for better visual flow. Additionally, personalization is introduced with the inclusion of a profile image.
Revamp 5: Refined Attendee Experience
Several enhancements were applied to the existing screen to improve user experience and maintain design consistency. A back button was introduced to facilitate easier navigation, enabling users to seamlessly return to the previous screen. The profile icon was shifted to the right, ensuring a consistent layout. Personalization was added through a profile image. The primary color palette, predominantly utilizing Poppins for typography, contributes to a cohesive visual identity. The search bar was detached from the top nav, decluttering the interface. A bookmark icon replaced the star icon, positioned on the left for improved accessibility. Redundancies were removed, prioritizing simplicity, and the "say hi" button was repositioned to prevent accidental clicks.
Design System
Style Guide
The color palette has been thoughtfully designed to promote a cohesive and visually appealing user experience. The primary color, following a monochromatic harmony, establishes a consistent and versatile base, ensuring a unified brand identity. Complementing this, the overall color palette adopts a split complementary harmony, introducing subtle variations that enhance visual interest while maintaining a balanced and harmonious aesthetic. This strategic combination of color schemes contributes to a user-friendly interface, promoting clarity, brand recognition, and an engaging visual experience across the Whova application.
