For best experience reading the case study please refer to https://medium.com/@oflaviav/soulvana-app-852f6229ad81

- - - - - -

This is my first task as an UI/UX designer where my role revolves around brainstorming between Product Owner, Senior Product designer, and developers, and of course mocking up wireframes and turn it into high fidelity screens. 

Brief idea of Soulvana:

Soulvana is a brand under Mindvalley focusing more on spirituality learning through daily meditation & energy work conducted by some of the greatest spiritual teacher in the industry. The app idea came to introduce the online group meditation feature to connect and meditate in real-time with thousands of people from around the world.  

Goals:

• Understand the product requirement, and creating user flower and pencil sketch wireframes
• Come up with the high fidelity design for soulvana app version 1 from scratch

App overview:

• The user will be divided into 3 types. User who doesn’t have any Mindvalley account, user who has Mindvalley account but doesn’t have subscription and user who has account and subscription. 
• All user can access the app, but to attend the session or access the library tracks, they have to have an account and subscribe to the monthly/yearly plan.
• This first feature of this app will be the online group session, where user can read through the session description, about the author and RSVP to attend the session. We would like to emphasise on the group. There will be countdown timer till when the session start.
• The second feature will be the library, where user can access full collection of audios, and guided meditations.
• The remaining features are pretty straight forward, community which lead them to facebook group, news that will direct them to soulvana blog and profile feature for setting and profile detail purposes. 

With that features in mind, I sketched out wireframe of the overall flow.

High fidelity screens:

For the sake of brevity, I will insert view of the screens here, but you can check out the full user flow here

PART II: Here comes the challenge

So after implementing the screens, tested and launched it, the team started to collect feedback and try to improve on the current version.

Challenge 1: Scalability
At the moment, we are displaying few cards on 1 screen because when Soulvana just started, there are not too many sessions playing in a week. So having a big cards fill up the gaps and more information can be shown. 

But with the growth of the brand and the app itself, how are we displaying the cards when there are example 50 sessions in one day or the growing amount of tracks the app has on the library? 

Challenge 2: Calendar view
At the moment, the app is showcasing the cards based on the nearest upcoming session, but how would we display more than just one day view. How would user view the next week sessions, and so on?

Challenge 3: Filtering
With the increase of amount of cards on the app, how to enable user to fast search for a specific author/session.

Challenge 4: Time selection
How to simplify the user experience to select time of the sessions they want to attend. For the current version, a card is duplicated with the same design but displaying different timing. 

Challenge 5: Featuring session
How to display a specific card that user raved about or a session that user might be really interested in. 

Back to wireframe

After listing down all the challenges, I am back to pen and paper, collecting some references and sketch out possible solutions for the app. The images below are the sketch and quick wireframe mock for the latest live tab.

Solution + current live version

After running through the mockup with the team, I designed the high fidelity screens and below is how it looks like. It’s still on iteration stage and most likely will be different by the time you download the app, but just would like to show the thought process and progress that has been made since the initial creation of the app.