Nbibs
Navigational Ease and Ticketing System
Create a user-friendly website with streamlined navigation, integrated AI chat, and a parking information banner to enhance user experience and support efficiency.
Tools Used: Figma, Adobe XD, Webflow, JavaScript
𧩠Problem Statement
The previous website had a complex and cluttered navigation system, leading to user frustration and high support ticket volumes due to difficulties in finding parking and event information.
β
π Key Challenges
- Navigation: Simplifying the menu and organizing items logically.
- User Support: Reducing support tickets by providing better information access.
- Event Information: Improving visibility and access to event details and parking.
β
Design Process
Prototyping & Testing
- Wireframes: Developed wireframes to outline the new structure.
- Prototypes: Created interactive prototypes for user testing.
- Usability Testing: Gathered feedback and iterated on the design.
Implementation
- AI Chat Integration: Added AI chat for instant user support.
- Parking Information Banner: Implemented a banner for parking details during the show.
UX Research & Insights
- Feedback: Analyzed user behavior and conducted usability testing.
- Market Analysis: Studied best practices for navigation and user needs for event websites.
- Microsoft Clarity: Utilized heatmaps and session recordings to understand user interactions and identify pain points.
- Heatmaps: Analyzed areas of high user interaction.
- Session Recordings: Observed user behavior to find bottlenecks and areas for improvement.
Navigation Overhaul
- Simplified Menu: Reorganized and decluttered the navigation menu.
- Logical Structure: Grouped related items for intuitive access.
π Results & Impact
- User Engagement: Streamlined navigation and AI chat improved user experience.
- Support Tickets: Reduced support tickets by 50%.
- Visitor Numbers: Doubled visitor numbers with the new design.
- Heatmap Insights: Improved layout based on areas with high interaction.
β
Summary
The redesign of the Newport International Boat Show website focused on enhancing navigation, integrating AI support, and providing clear event information. Using Microsoft Clarity's heatmaps and session recordings, we identified key user interactions and optimized the website layout to improve user engagement and support efficiency.
β