Ashwin Santiago's profile

Soccer World Cup - Booking UX

1. Zone Selection
An overview of the match with stadium & timing. Filters are kept on top to better help the user narrow down on a result.
Interactive map of the stadium with colours depicting various zones. The details are provided on the left along with pricing.
The user can also switch between matches just in case the seats are booked or if he has changed his mind.
2. Hover On Zone
When the user hovers on a zone, an image showing the view from that zone along with details of pricing and available tickets are shown.
3. Zone Filter
If a user wants to view a particular zone, he can do so by clicking any option from the left menu.
4. Sub-Zone Selection
Once the user clicks on a zone the stadium map animates to zoom and set on the selected zone.
Sub zones which are available are shown along with available seats(blue boxes).
5. Seat Selection
Available seats are shown in green. By default the system selects from these available seats which is shown in blue. These can be changed. Pricing details for the seats are populated below with the fare break-up.
Thank You 😊

Soccer World Cup - Booking UX
Published:

Project Made For

Soccer World Cup - Booking UX

An Interactive way to book tickets with focused user actions & a rich visual feel. USer's can view other upcoming matches, view nearby hotels & a Read More

Published: