Break Konnect
Break Konnect
Break Konnect
Crafting a mobile platform to discover and manage break dancing events.
Crafting a mobile platform to discover and manage break dancing events.
Crafting a mobile platform to discover and manage break dancing events.
Click Above to See Our Final Report!
Click Above to See Our Final Report!
TIMELINE
TIMELINE
TIMELINE
September 2025 – April 2026
September 2025 – April 2026
September 2025 – April 2026
TEAM
TEAM
5-person UX design team
(myself included)
5-person UX design team (myself included)
3 Software Engineers
2 Product Owners
2 Business Managers
Me as the sole UX Designer
SKILLS
SKILLS
SKILLS
User Research, UX Strategy, Interaction Design, Design Systems
User Research, UX Strategy, Interaction Design, Design Systems
User Research, UX Strategy, Interaction Design, Design Systems
OVERVIEW
OVERVIEW
OVERVIEW
I Turned a Confusing Tool into a Trusted Community Hub
I Turned a Confusing Tool into a Trusted Community Hub
I Turned a Confusing Tool into a Trusted Community Hub
Break Konnect is a platform for promoting and managing break dancing events. My team worked on crafting the final design of the mobile website.
My contributions included:
User Research & Usability Testing:
Conducted usability tests of both the existing platform and our final prototype.
Event Creation Flow Redesign:
Led the end-to-end redesign of the event organizer’s creation journey.
Modified confusing terminology and introduced required-field indicators
Design System & UX Specifications:
Established a design system to establish consistent visual language
Annotated our high-fidelity prototype with design rationale hand off to our client.
Break Konnect is a platform for discovering, promoting, and managing breaking (breakdance) events. Prior to the project, the existing platform centered around event registration, and there were many usability issues within the event registration process. My team worked on transforming key organizer flows, conducting user research, and crafting the final design of the mobile website.
My contributions included:
User Research & Usability Testing:
Conducted usability tests of both the existing platform and our final prototype.
Synthesized findings that drove the new filtered discovery system, the dancer “Folio” concept, and the re-prioritization of event information.
Event Creation Flow Redesign:
Led the end-to-end redesign of the event organizer’s creation journey.
Modified confusing terminology on the platform.
Introduced required-field indicators and a post-publish summary screen
UX Specifications & Design Handoff:
Authored the complete UX Specifications document
Annotated our high-fidelity prototype where every design choice is mapped to a specific rationale.
Break Konnect is a platform for promoting and managing break dancing events. My team worked on crafting the final design of the mobile website.
My contributions included:
User Research & Usability Testing:
Conducted usability tests of both the existing platform and our final mobile website prototype.
Event Creation Flow Redesign:
Led the end-to-end redesign of the event organizer’s creation journey.
Modified confusing terminology and introduced required-field indicators
Design System & UX Specifications:
Established a design system to establish consistent visual language
Annotated our high-fidelity prototype with design rationale hand off to our client.
Break Konnect Logo
Break Konnect Logo
PROBLEM SCOPING
PROBLEM SCOPING
PROBLEM SCOPING
Break Konnect Has Two Interdependent User Groups
Break Konnect Has Two Interdependent User Groups
Break Konnect Has Two Interdependent User Groups
Event Organizers create, promote, and manage dance events on the platform.
Dancers discover and register for those events.
The platform’s success depends on serving both sides: organizers need an engaged dancer audience, and dancers need a steady stream of available events.
Event Organizers create, promote, and manage dance events on the platform.
Dancers discover and register for those events.
The platform’s success depends on serving both sides: organizers need an engaged dancer audience, and dancers need a steady stream of available events.
User Persona: Event Organizers
User Persona: Event Organizers
User Persona: Dancers
User Persona: Dancers
However, we initially didn't know the exact issue with the current platform.
During an early client meeting, our client, a product designer himself, said he believed the primary roadblock was on the event organizer side, because organizers drive event creation and revenue. So, we decided to prioritize their experience while also interviewing dancers, but as a secondary concern.
USER RESEARCH
USER RESEARCH
USER RESEARCH
Research Helped Us Define the Real Problems
Research Helped Us Define the Real Problems
Research Helped Us Define the Real Problems
We administered google surveys with both organizers and dancers
Key Organizer Survey Insights (10 responses):
100% of organizers used external platforms (Instagram, word‑of‑mouth) to promote events
Organizers would often be confused when creating an event and would often call BK support for help.
Key Dancer Survey Insights(18 responses):
83% of dancers decided to attend events based on who else was going above anything else.
After registration, dancer engagement on BreakKonnect's platform dropped off.
We then conducted usability tests with both groups on the existing platform
We organized task‑based usability testing with 6 organizers and 5 dancers.
Key quote: “I use [Break Konnect] for learning about an event, and then go elsewhere to learn more information”
We administered google surveys with both organizers and dancers
Organizer survey insights (10 responses):
100% of organizers used external platforms (Instagram, word‑of‑mouth) to promote events
Only 30% of organizers felt Break Konnect helped them reach a wider audience.
Organizers were often confused about the entire event creation process and would call BK support for help.
Dancer survey insights(18 responses, 4 with BK experience):
83% of dancers decided to attend events based on who else was going above anything else.
After registration, dancer engagement on BreakKonnect's platform dropped off.
This was a key indicator that community on the platform had problems.
We then conducted usability tests with both groups on the existing platform
We organized task‑based usability testing with 6 organizers and 5 dancers.
Key quote: “I use [Break Konnect] for learning about an event, and then go elsewhere to learn more information”
Key Insights from Current Platform Usability Testing
Key Insights from Current Platform Usability Testing
Our research uncovered significant usability issues in the event creation process. Furthermore, we also found that Break Konnect didn’t support any community dynamics, meaning both organizers and dancers would continue to be disengaged with the current platform.
In essence, we realized that dancer needs were also vital to the platform’s success.
Now that we knew the problem, we created a problem statement to address the needs of both user groups.
Official Problem Statement:
"Break Konnect’s event creation flow has poor information architecture, which makes it difficult for organizers to create events with adequate information. At the same time, the platform lacks the community features dancers need to connect with each other and attend events. As a result, Break Konnect is unable to become a trusted, self‑sustaining hub for either group."
Our research indicated that the root issue was that Break Konnect didn’t support the community dynamics that drive event‑attendance decisions. Without a digital community layer, both organizers and dancers would continue defaulting to Instagram and word‑of‑mouth.
In essence, we realized that dancer needs were also vital to the platform’s success.
However, we also uncovered significant usability issues in the event creation process. Now that we knew the problem, we could move forward with creating a problem statement to address the needs of both user groups based on our research findings.
Official Problem Statement:
"Break Konnect’s event creation flow suffers from poor information architecture which makes it difficult for organizers to create events with adequate information. At the same time, the platform lacks the community features dancers need to discover events and decide to attend. As a result, Break Konnect is unable to become a trusted, self‑sustaining hub for either group."
USER FLOW & UX REQUIREMENTS
USER FLOW & UX REQUIREMENTS
USER FLOW & UX REQUIREMENTS
We Mapped the Entire User Flow of the Existing Platform
We Mapped the Entire User Flow of the Existing Platform
We Mapped the Entire User Flow of the Existing Platform
After finalizing our problem statement, we mapped the user flow of Break Konnect's current platform to align on entry points, decision branches, and system feedback moments.
After finalizing our problem statement, we mapped the user flow of Break Konnect's current platform to align on entry points, decision branches, and system feedback moments.
We Translated User Needs into Seven UX Requirements.
We Translated User Needs into 7 UX Requirements.
We defined our 7 UX requirements as UX elements we thought were very important to include in our design. The requirements were grouped by core experience themes that would guide the design phase.
We defined our 7 UX requirements as UX elements we thought were very important to include in our design. The requirements were grouped by core experience themes that would guide the design phase.
FLOW AUDIT
FLOW AUDIT
FLOW AUDIT
Simplifying The Seven-Step Event Creation Process
Simplifying The Seven-Step Event Creation Process
Simplifying The Seven-Step Event Creation Process
While I contributed across the full design, I took sole responsibility for redesigning the event creation experience.
The UX requirements I targeted most directly were:
Required event details before publication.
Easily scannable event information.
While I contributed across the full design, I took lead responsibility for redesigning the event creation experience. This directly addressed the client’s original request to improve the organizer tool while also trying to address the issue that incomplete events eroded dancer trust.
The UX requirements I targeted most directly were:
Required event details before publication.
Easily scannable event information.
Clarity of system state and feedback.
Original Event Creation Flow:
The original creation process had 7 disconnected pages that created significant cognitive load:
Too many pages – Steps were split arbitrarily.
Date and time had their own entire page (page 2), while location was on the first page.
Missing required fields – Critical information like city/location wasn’t required fields
Organizers could publish events with no location, forcing dancers to verify elsewhere.
Confusing terminology – Labels like “Carpets” (meaning digital screen displays during the event) were unfamiliar even to experienced organizers.
Original Event Creation Flow:
The original creation process had 7 disconnected pages that created significant cognitive load:
Ex. Date & time and Location were on different pages.
Critical information like city/location wasn’t in required fields.
Organizers could publish events with no listed location, causing dancers to be confused.
Confusing terminology – Labels like “Carpets” (meaning digital screen displays during the event) were unfamiliar even to experienced organizers.
WIREFRAMING
WIREFRAMING
WIREFRAMING
I Restructured the Flow Into 3 Clear Steps
I Restructured the Flow Into 3 Clear Steps
I Restructured the Flow Into 3 Clear Steps
I consolidated the five disjointed steps into a logical three‑page sequence, each with a clear theme that matched organizers’ mental models:
Basic Information
Added “Date & Time” to basic information page.
Mandatory fields are now enforced with asterisks, preventing incomplete events from going live.
Impact: Having event name, image, location, date/time, and description on a single page kept core event identity fields together.
Event Staff & Battles
Combined the former “Battle” step with role assignments (admins, hosts, DJs).
Impact: Battles define the competition structure, and the people running them are part of the same process.
Grouping them together reflects how organizers actually think about competition setup.
Pricing & Display
Combined the old “Display Mode/Carpets” and “Payment System” steps.
Impact: Both relate to the public‑facing presentation and monetization of the event, so it made sense to combine them.
I consolidated the five disjointed steps into a logical three‑page sequence, each with a clear theme that matched organizers’ mental models:
Basic Information
Added “Date & Time” to basic information page.
Mandatory fields are now enforced with asterisks, preventing incomplete events from going live.
Impact: Having event name, image, location, date/time, and description on a single page kept core event identity fields together.
Event Staff & Battles
Combined the former “Battle” step with role assignments (admins, hosts, DJs).
Impact: Battles define the competition structure, and the people running them are part of the same process.
Grouping them together reflects how organizers actually think about competition setup.
Pricing & Display
Combined the old “Display Mode/Carpets” and “Payment System” steps.
Impact: Both relate to the public‑facing presentation and monetization of the event, so it made sense to combine them.
Redesigned Event Creation Wireframes
Redesigned Event Creation Wireframes
Important Note about Payment System
Important Note about Payment System
I intentionally omitted including the payment system in my event creation redesign, knowing the client planned to add full payment processing later.
After the project, the client extended this step into a complete payment setup with bank integration.
(Pages 5-6 in the original event creation flow)
While on the project, our team designed the ticket wallet and the ticket-purchasing experience for dancers, planning for an end‑to‑end flow once the client's payment system went live.
Important Note about Payment System
I intentionally omitted including the payment system in my event creation redesign, knowing the client planned to add full payment processing later.
After the project, the client extended this step into a complete payment setup with bank integration.
(Pages 5-6 in the original event creation flow)
While on the project, our team designed the ticket wallet and the ticket-purchasing experience for dancers, planning for an end‑to‑end flow once the client's payment system went live.
I intentionally omitted including the payment system in my event creation redesign, since the client planned to add payment processing later.
After the project, the client implemented a complete payment setup with bank integration, which was shown in the original event creation flow.
However, our team did design the ticket wallet and the ticket-purchasing experience for dancers, planning for an end‑to‑end flow once the payment system went live.
FINAL PROTOTYPE
FINAL PROTOTYPE
50% of Users Found Event Creation the Most Intuitive Part of our High-Fidelity Prototype
50% of Users Found Event Creation the Most Intuitive Part of our High-Fidelity Prototype
To keep the demo focused on layout and navigation, I autofilled the input fields rather than building out every text interaction.
The existing platform already had a working system for text entry and battle management, and my goal was simply to show how the information architecture removed friction.
Direct impact from usability testing:
In our second round of testing with event organizers, 50% of participants named event creation as the most intuitive part of our new prototype.
This was a strong indicator that the three‑step structure and improved clarity addressed the core friction points they had described in earlier testing.
I built a high‑fidelity prototype of the redesigned event creation flow and recorded a walkthrough to demonstrate the improved structure.
To keep the demo focused on layout, navigation, and the reduced step count, I autofilled the input fields rather than building out every typing interaction.
Justification: The existing platform already had a functional system for search, text entry, and battle management, and my goal was to show how the information architecture and progressive disclosure removed friction, not to re‑create existing form mechanics.
Direct impact from usability testing:
In our second round of testing with event organizers, 50% of participants named event creation as the most intuitive and straightforward part of the new prototype
This was a strong indicator that the three‑step structure and improved clarity addressed the core friction points they had described in earlier sessions.
DESIGN SYSTEM
DESIGN SYSTEM
DESIGN SYSTEM
A Single Design Guideline Unified the Whole Prototype.
A Single Design Guideline Unified the Whole Prototype.
A Single Design Guideline Unified the Whole Prototype.
Beyond the event creation flow, the platform needed a consistent visual language for every new feature we introduced.
So, I created a design system that standardized:
Typography
Color Palette.
Spacing & Layout.
Reusable Components.
Beyond the event creation flow, the platform needed a consistent visual language for every new feature we introduced.
So, I created a design system that standardized:
Typography
Color Palette.
Spacing & Layout.
Reusable Components.
Impact:
The prototype we designed included almost every flow on the existing platform, including discovery, registration, profiles, community features, ticketing, and organizer tools. The design system made sure that all parts of the design looked and behaved cohesively.
Impact:
The prototype we designed included almost every flow on the existing platform, including discovery, registration, profiles, community features, ticketing, and organizer tools. The design system made sure that all parts of the design looked and behaved cohesively.
ADDITIONAL FEATURES
ADDITIONAL FEATURES
ADDITIONAL FEATURES
While I led the event creation redesign, I collaborated closely with the team on three other areas that addressed the remaining UX requirements, and the key improvements we focused on were event discovery, personal identity, and community connection.
While I led the event creation redesign, I collaborated closely with the team on three other areas that addressed the remaining UX requirements, and the key improvements we focused on were event discovery, personal identity, and community connection.
151% Improvement in Event Discovery
151% Improvement in Event Discovery
UX Requirements Addressed: Filtered Event Discovery, Easily Scannable Event Information
What changed:
Introduced a robust search system allowing dancers to narrow events by various filters.
Standardized event cards so time, date, and location were immediately visible without clicking into details.
Required event details before publication (from my new event creation flow) ensured every listing was complete and trustworthy.
UX Requirements Addressed: Filtered Event Discovery, Easily Scannable Event Information
What changed:
Introduced a robust filter system allowing dancers to narrow events by date, ticket price, distance, location, dance style, and skill level.
Standardized event cards so time, date, and location were immediately visible without clicking into details.
Required event details before publication (already covered) ensured every listing was complete and trustworthy.
Event Discovery
Event Discovery
Filter Events
Filter Events
View Event Details
View Event Details
Impact (from usability testing of our new prototype)
+151% increase in users successfully finding relevant events.
83% of test participants actually used the new filter tool.
Impact (from usability testing of our new prototype)
+151% increase in users successfully finding relevant events.
83% of test participants used the new filter tool.
122% Increase in Satisfaction Through Profile Personalization
122% Increase in Satisfaction Through Profile Personalization
UX Requirements Addressed: Personalized Profiles
What changed:
Rebuilt user profiles to include follower counts and a media gallery (Folio).
Folio: a dancer portfolio where users publicly upload photos and videos of their dancing, providing an opportunity for self-expression.
Added a private “Upcoming Events” section (visible only to the profile owner) and “Events Hosted” if the user is an event organizer.
UX Requirements Addressed: Personalized Profiles
What changed:
Rebuilt user profiles into a living identity hub: bio, location, follower counts, event achievements , and a public media gallery (Folio).
Introduced Folio, a dancer portfolio where users publicly upload photos and videos of their dancing, providing an opportunity for self-expression.
Added a private “Upcoming Events” section (visible only to the profile owner) and “Events Hosted” for organizers.
Revamped Profile Page
Profile Page
Dancer Folio
Dancer Folio
Easily Track Events
Easily Track Events
Impact (from usability testing of our new prototype)
In the first test, 82% of interviewees originally wanted a more personalized experience.
After the redesign, 100% expressed approval for the increased personalization.
+122% increase in satisfaction with personalization features.
“I would use this as a way to track my own involvement in the community and to track logistics” — Event Organizer quote.
Impact (from usability testing of our new prototype)
In the first test, 82% of interviewees originally wanted a more personalized experience.
After the redesign, 100% expressed approval for the increased personalization.
+122% increase in satisfaction with personalization features.
“I would use this as a way to track my own involvement in the community and to track logistics” — Event Organizer quote.
Building Community For Everyone on the Platform
Building Community For Everyone on the Platform
UX Requirements Addressed: Dancers Can Connect with Each Other, See Other Event Attendees
What changed:
Added a “Konnect” system so dancers can build a network within Break Konnect.
In every event description, a “See Who’s Going” section shows familiar faces from a dancer’s network.
The Folio feed lets users browse posts from the broader community, like and share content, and discover new dancers.
UX Requirements Addressed: Dancers Can Connect with Each Other, See Other Event Attendees
What changed:
Added a “Konnect” system so dancers can build a network within Break Konnect.
In every event description, a “See Who’s Going” section shows familiar faces from a dancer’s network.
The Folio feed lets users browse posts from the broader community, like and share content, and discover new dancers.
Konnect
Konnect
Folio Feed
Folio Feed
Community Validation
Community
Impact
In the past, 100% of users relied on word-of-mouth for discovery, promotion, and attendance decisions.
The community features now make Break Konnect the place where that social validation happens.
“This platform feels more straightforward and more connected to the community” — Dancer Quote.
Impact (from usability testing of our new prototype)
In the past, 100% of users relied on word-of-mouth for discovery, promotion, and attendance decisions.
The community features now make Break Konnect the place where that social validation happens.
“This platform feels more straightforward and more connected to the community” — Dancer Quote.
New Event Analytics Pages Empowered Organizers with Real‑Time Data
New Event Analytics Pages Empowered Organizers with Real‑Time Data
UX Requirements Addressed: Easy Access to Event Data + Metrics
What changed:
An Event Dashboard that shows all hosted events (both past and present).
A live gauge showing the percentage of registered attendees who have checked in.
Battle‑level check‑in statuses (Checked‑In / Pending).
A targeted announcement tool with scheduling, recipient selection (by battle or everyone), and post‑send view counts.
UX Requirements Addressed: Easy Access to Event Data + Metrics
What changed:
An Event Dashboard that shows all hosted events (both past and present).
A live gauge showing the percentage of registered attendees who have checked in.
Battle‑level check‑in statuses (Checked‑In / Pending).
A targeted announcement tool with scheduling, recipient selection (by battle or everyone), and post‑send view counts.
UX Requirements Addressed: Easy Access to Event Data + Metrics
What changed:
An Event Dashboard that shows all hosted events (both past and present).
A live gauge showing the percentage of registered attendees who have checked in.
Battle‑level check‑in statuses (Checked‑In / Pending).
A targeted announcement tool with scheduling, recipient selection, and post‑send view counts.
Centralized Dashboard
Centralized Dashboard
Centralized Dashboard
Specific Event Details
Specific Event Details
Specific Event Details
Monitor Event Check-in
Monitor Event Check-in
Monitor Event Check-in
Drafting Announcements
Drafting Announcements
Drafting Announcements
Impact
Delivered real‑time control that organizers previously lacked, creating a self‑sufficient event‑management command center.
Removed guesswork around communication, enabling organizers to engage attendees directly inside Break Konnect instead of relying on external tools.
Allows organizers to build trust in the platform for day‑of-event operations.
Impact (from usability testing of our new prototype)
In the past, 100% of users relied on word-of-mouth for discovery, promotion, and attendance decisions.
The community features now make Break Konnect the place where that social validation happens.
“This platform feels more straightforward and more connected to the community” — Dancer Quote.
UX SPECIFICATIONS
UX SPECIFICATIONS
Annotated Specifications That Eliminated Client Guesswork (Link to Document)
Annotated Specifications That Eliminated Client Guesswork (Link)
I authored the complete UX specifications document for the project so that our prototype could be used faithfully to our vision (the design system was also provided to the client on top of the UX Specifications).
What the deliverable included:
Annotated prototype page – Every screen in the prototype was marked with notes explaining why a design choice was made so the client could understand the rationale.
Global component specs – The Hamburger Menu, Create post/event popup, Ticket Wallet, and Purchase Ticket bottom sheet, defining how they appear, animate, and respond across contexts.
I authored the complete UX specifications document for the project so that our prototype could be used faithfully to our vision (the design system was also provided to the client on top of the UX Specifications).
What the deliverable included:
Annotated prototype page – Every screen in the prototype was marked with notes explaining why a design choice was made, so the client could understand the rationale without a live walkthrough.
Global component specs – The Hamburger Menu, Create post/event popup, Ticket Wallet, and Purchase Ticket bottom sheet, defining how they appear, animate, and respond across contexts.
Impact
Because the client was a product designer who was currently developing the Break Konnect mobile app, the specifications for our mobile website prototype were written to be a self‑contained reference. This meant the client could hand the file to a developer or revisit it months later without losing the reasoning behind each choice.
REFLECTION & LEARNINGS
REFLECTION & LEARNINGS
User Evidence Turned a Transactional Tool into a Thriving Community
User Evidence Turned a Transactional Tool into a Thriving Community
We entered the project without a clear problem definition, but I learned from this project that structured user evidence reveals where to focus, and that everything else in the design process falls naturally into place when the findings are grounded in real behavior.
We entered the project without a clear problem definition, but I learned from this project that structured user evidence reveals where to focus, and that everything else in the design process falls naturally into place when the findings are grounded in real behavior.
Impact metrics:
+151% increase in users finding relevant events
83% adopted the new filter tool
100% appreciation for personalization
50% of users named event creation the most intuitive part of our prototype
Impact metrics:
+151% increase in users finding relevant events
83% adopted the new filter tool
100% appreciation for personalization
50% of users named event creation the most intuitive part of our prototype
Ultimately, we didn’t replace Break Konnect—we expanded it from a transactional tool into a community‑driven platform where dancers find both a community and events that are right for them.
Ultimately, we didn’t replace Break Konnect—we expanded it from a transactional tool into a community‑driven platform where dancers find both a community and events that are right for them.
