ux/ui, graphic design, creative direction

email

210 347 8123

logo

CASE STUDY:

MIXABL APP

ROLE:

SOLE UX/UI DESIGNER

TIMELINE:

6 MONTHS (SEPT ‘20 – MAR ‘21)

DESIGN:

icon app XD | Case Study: UX/UI: Mixabl Appicon app Illustrator | Case Study: UX/UI: Mixabl Appicon app Photoshop | Case Study: UX/UI: Mixabl App

MARKETING:

icon app Acrobat | Case Study: UX/UI: Mixabl Appicon app InDesign | Case Study: UX/UI: Mixabl App
Mixabl app case study hero image

THE ORIGIN

The COVID-19 pandemic drastically affected the event industry, pushing event coordinators to explore virtual platforms as physical gatherings became a health risk. Simultaneously, many existing virtual event platforms failed to deliver a live, immersive, and interactive experience that mirrored real-world events. HiveHub identified this gap and initiated the creation of MIxabl, a live and virtual event application designed to replicate the dynamic experience of in-person events.

THE PRODUCT VISION

HiveHub’s initial vision for MIxabl was drawn from conversations with live video experts and event coordinators. Using my expertise in UX/UI design, I was tasked with planning the application flow, designing screen layouts, and defining the functionality for MIxabl’s MVP. This version included features such as live video streams, virtual vendor booths, interactive chat features, and comprehensive event schedules. Throughout the project, the application’s functionality evolved to meet the distinct needs of our key user groups: Event Coordinators, Attendees, and Vendors.

THE OUTCOME

el 5 stars | Case Study: UX/UI: Mixabl App

Mixabl was a resounding success, transforming the way events were hosted and experienced during the pandemic. The application enabled connections between attendees, coordinators, and vendors, recreating the atmosphere of physical events in a virtual setting. The feedback we received from user groups was overwhelmingly positive, with users appreciating the platform’s seamless experience and intuitive features.

THE PROCESS

DEFINE/UNDERSTAND

Field studies and user interviews with live video experts and event coordinators informed our understanding of the need for MIxabl. This phase included defining the initial requirements and constraints, as well as competitive testing of similar applications to learn from their limitations and successes.

RESEARCH

Research phase was crucial to Mixabl’s design. I conducted a competitive analysis and found few direct competitors, enabling us to create a unique product. Our user personas were built around the three main user groups, and I employed human-centered design principles to ensure that their needs were met. A pluralistic walkthrough, task analysis, (in-house) prototype testing, and user stories informed the design process and helped us anticipate the users’ needs.

ill understanding process | Case Study: UX/UI: Mixabl App

DESIGN/BUILD/DEVELOP

With the insights from the research phase, I crafted a comprehensive sitemap, wireframes, and high-resolution mockups, always considering the application’s responsiveness across multiple devices. Working closely with the development team, I ensured that our design was fully realized.

Based on Lessons Learned from work done on the Waltr app, I designed this “desktop only” app with future responsiveness in mind. Again… huge payoff when the mobile version was requested!
Mixable app sitemap
Mixabl app's birds-eye view
Mixabl admin screens with notes

Admin screens with notes for modification

Mixabl login and Exhibitor screens

Home screen and Exhibitor Directory list and grid views

Mixabl Presentation and Scheduling screens

Presentation, Exhibitor Profile, and Schedule Management screens

Mixabl admin screens with notes

Admin screens with notes for modification

Mixabl login and Exhibitor screens

Home screen and Exhibitor Directory list and grid views

Mixabl Presentation and Scheduling screens

Presentation, Exhibitor Profile, and Schedule Management screens

DELIVERY/TESTING

Extensive qualitative usability testing took place during the application’s first live event, giving us a wealth of feedback and areas for improvement. Further outreach to user groups, analysis of forum posts, and benchmark testing, along with accessibility evaluations, helped refine the application, ensuring a top-quality user experience.

method benchmark testing | Case Study: UX/UI: Mixabl App

LISTEN/ITERATE/APPLY

Post-event, we meticulously reviewed the usability and user feedback. Regular surveys and FAQ reviews allowed us to continuously iterate and improve the application.

If the project had continued, next stages would have included some interesting  and exciting features. 

Mixabl proposed Discussion Room

Proposed Virtual Meeting Rooms

Live music/festival event streaming app

Use in Virtual Live Music Festival

LESSONS LEARNED

Creating Mixabl was a pivotal learning experience in understanding the transformative power of digital technology in replicating real-world experiences. One key insight was the importance of incorporating diverse user feedback in shaping the product – this led to an application that was truly tailored to the needs of the events industry.

 

Moreover, this project reinforced the value of having an iterative process. Our readiness to learn from our initial version and continuously refine the platform based on user feedback played a significant role in Mixabl’s success.

The Mixabl journey has been a testament to the power of empathy-driven design and the potential of technology to create meaningful, interactive experiences despite physical barriers. It has been rewarding to see Mixabl bring together event coordinators, attendees, and vendors in a virtual space that is as interactive and engaging as a real-world .

PLUS

Since I have TONS of experience designing websites, I created promotional landing page and all digital and print collateral.

Responsive website promoting a live stage streaming app for business and music
Mixabl marketing one-sheet (print design)