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

  1. Navigation: Simplifying the menu and organizing items logically.
  2. User Support: Reducing support tickets by providing better information access.
  3. 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.
Sitemap of the Newport International Boat Show website structure.
No items found.

Navigation Overhaul

  • Simplified Menu: Reorganized and decluttered the navigation menu.
  • Logical Structure: Grouped related items for intuitive access.
Full-page view of the Newport International Boat Show homepage and tickets page.
 Close-up view of the homepage of the Newport International Boat Show website.
Mobile view of the general admission and contact pages of the Newport International Boat Show website.
Laptop displaying the Newport International Boat Show homepage.
Mobile view of the tickets page and boat show information page of the Newport International Boat Show website.
No items found.

📈 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.

Next projects