09 — Digital Product Development
Shotbox
Electronic Music Events in Pakistan
What They Do
Shotbox is at the forefront of transforming Pakistan's electronic music scene, organizing premier events with innovative art, set production, and technologies never seen before in the country.
How I Collaborated
I developed the entire website, including a custom ticket booking system that streamlines the process for attendees from the moment they decide to go.
- Client
- Shotbox
- Industry
- Electronic Music Events
- Services
- UI/UX Design, Website
- Timeline
- 4 Weeks
- Year
- 2026
- Tools
- Photoshop, Figma, ChatGPT
(01)
Overview
Shotbox is an electronic music event organizer. The web application manages events and payments while reflecting their innovative aesthetic, with a seamless experience for both attendees and administrators.
- 80+
- Hours of design work
- 40+
- Figma screens
- 20+
- UI components
(02)
The Challenge
Shotbox hosts high-energy events, but the digital experience didn’t match the brand. There was no seamless way to discover events, verify attendees and manage bookings securely.
- 01
A Digital Experience Behind the Brand
The events are high-energy and distinctive, but the website did not carry that feel.
- 02
No Seamless Booking System
There was no single system to discover events, verify attendees, and manage bookings securely.
- 03
Boring, Overloaded Pages
Generic event websites bury the important details, with unclear registration and long forms that put people off.
(03)
The Approach
A smart, secure event booking ecosystem that joins discovery, verification, payments and QR-based entry into one smooth journey.
- 01
Discovery
Visitors find unique electronic music events, see who is performing and get a feel for the experience.
- 02
Verification
Organizers review attendee requests from a dashboard, approving or rejecting each one.
- 03
Booking and Payments
A short, three-step booking flow — ticket type, event questionnaire, invitation — keeps registration simple.
- 04
QR-Based Entry
Confirmed attendees download their tickets and walk in with a QR code.
Selected Screens
(04)
Process
Design Process
- 01
Empathise
Interviews · User Research · Competitor Analysis · Observation
- 02
Define
Design Strategy · Problem Statement · User Persona · Empathy
- 03
Ideate
Brainstorming · User Flow · Information Architecture
- 04
Prototype
Sketch · Wireframe · UI Design · Prototype
- 05
Test
Usability Testing · Implement Feedback
Timeline
- Week 1
Ideation & Research
- Week 2
Design
- Week 3
Prototype & Test
- Week 4
Presentation
(05)
Audience
Primary Persona
Hamza Ali
Project Manager · 28 · Karachi, Pakistan
Hamza is interested in underground electronic music, DJs, nightlife, art and new experiences. He doesn’t want a typical commercial club experience, and he discovers events mostly through Instagram, friends and artist pages.
Event Explorer / Music Lover / Tech-Savvy / Instagram User
Goals
- 01Discover unique electronic music events.
- 02Know who’s performing and what the experience will be like.
- 03Quickly understand date, venue and ticket information.
- 04Feel that the event is exclusive and worth attending.
- 05Easily complete registration and ticketing.
Pain Points
- 01Generic event websites feel boring.
- 02Too much information before getting to the important details.
- 03Unclear ticket and registration process.
- 04Doesn’t want to fill unnecessarily long forms.
- 05Wants confidence that the event is legitimate and well-produced.
(06)
Design System
Colour
#3D57EC
#7A1CC7
#FFFFFF
Typography
- NexaPrimary typography
- DM SansSecondary typography
Discover. Book. Walk right in.