Danceflavors
TIMELINE
Feb 2022 - Present
MISSION
Redesigning the app and website
MY ROLE
Ux designer
Introduction
Danceflavors is an online platform for dance schools, dance teachers, and dancers, where course-related information can be exchanged quickly and typical organizational processes are facilitated.
The main functions are the implementation of courses, workshops, and events. Danceflavors provides an overview of contents, and course information as well as participants and offers a communication channel for all persons involved. The platform addresses the complexity and individuality of dance schools and dance courses and offers a suitable solution for everyone.
Client's needs
When I first started this project one of the most significant tasks was the redesign of the entire platform both the web and the app. There was a need to make the design look more contemporary and accessible to make it clearer who we are and to better connect with our audience.
Problem
Here are the key problems with the core experience.
Outdated Design
The layout and composition have cluttered designs that do not prioritize content hierarchy. the color schemes, typography, and visual styles used are no longer in line with current design aesthetics.
Lack of Focus on Mobile Users
The mobile experience is far behind and is much poorer than the web experience. also very few of the screens seen on the website have their own responsive version.
Inconsistent Design
The inconsistency with the design is evident, using some elements on some screens and different ones on others, creating a chaotic and confusing experience for the users.
Low Conversion Rates
Low conversion rates on the homepage suggest that the content or design of the page isn't compelling users to take the next step, such as signing up or making a purchase.
Solution
I was in charge of redesigning the application and the website, starting with the most important parts of the platform such as the homepage, the search page, the events page, the courses, the purchase of tickets for the events, and the search for dance partners.
Before starting with the redesign I considered it very important to do some research and get to know our users better to understand what their goals and frustrations are.
Personas
After having interviews with 7 users of different ages and backgrounds I had the opportunity to learn about the problems they face. With the information gathered it can be divided into two archetypes:
User journey map
Paper first
So, when we kicked off the brainstorming phase, we started by doodling different main screens on paper. We played around with various ways to show the info, and this really helped bring our ideas to life and give us a better sense of where to head.
Design system
Final designs (before and after)
Before redesigning this platform the design was outdated and not very aligned with the spirit of the company. Here is a detailed walkthrough of what we improved after the entire conception process.
Mobile
Homepage
Previously to access the search results the user had to first select their location and then select a category, now they can view the results directly and see all available categories, making the experience more seamless.
Event page and ticket selection
Profile view
The profile is very important in a social network, how you present yourself to others, and therefore, we try to create a more attractive page using trends such as glasmorphism, and the use of icons to facilitate visual understanding.
Chat
In the chat, we incorporated a more colorful background, applied glasmorphism, and tried to create a more organic and minimalist look by rounding the corners of the buttons and text fields.
My tickets
Here we removed the shopping cart by moving to the checkout, unified the look of the cards to be consistent with the design, and reduced the visual complexity of the ticket by using simple geometric shapes.
Web
Homepage
The most significant changes in the home page were to remove all informative content and focus on search, change the order of the elements, first the user selects his location and then searches directly or selects a category beforehand.
Create dancemanager
Another of the most significant changes was the creation of a dancemanager. Initially, we had an unattractive form with very little relevant information and to improve conversion rates and to create more appealing dance school profiles for the end user we decided to use a stepper.
Event page
We not only changed the order of the elements or their visual appearance but also incorporated some new functions such as co-hosts or the incorporation of the map among many other things.
Chat
Ticket selection
Here we decided to move the content in a dialog to its own page to give a clearer context and improve navigation. We also changed the buttons since the existing ones were confusing, We focused on two main buttons continue or continue as guest to direct the user to the checkout.
What I learned
In all this process I have learned how important it is to first understand the problem to be solved and to get to know the users who are going to use this product, empathizing with their objectives and frustrations is key to being able to offer a solution that adapts to them and not in reverse.
On the other hand, this project has encouraged us to be more aware of the latest trends in UI design and how simplifying the visual complexity can greatly improve the appearance of an interface.
Future steps
Some of the future steps are:
Improve existing screens and user flows
Maintaining current functions requires observing and analyzing points of improvement in the current platform, either by conducting user tests or analyzing statistics and then reviewing the results and making the necessary changes.
Create new features
We are always open to creating new features that add value to the user, enriching the experience and complementing the current product.
