LVL Wellbeing is the solution to self care at work. Nourishing your mind, body and soul.
I designed the mobile and web applications for LVL. Among the services provided by LVL, there are on demand and live wellness videos which range from mindfulness to workouts.
There are 4 pillars of the company - mind, body, pursuits and community. Often, work takes majority of the time in one’s life and taking care of one’s self becomes tricky. This was proven to be true even after most jobs offered their employees to work remotely during and after covid. LVL makes it easier for its users to concentrate on what they need and helps them help themselves.
Conception of UI elements
Objective: Create UI elements that reflect the branding and core values of LVL while making it colorful and cheerful.
LVL’s branding is colourful and each pillar of the company is associated with a different colour and pattern. It was important for the user to recognize these colours.
Because there were patterns with thick strokes and bright colors, it needed something that could soften up the UI. I used light, faded colors in the background to bring everything together.
Atomic design system
Working for a startup I was aware of the rapid changes and challenges we would face during the early design stages. In an environment like that, having a scalable intuitive design system was crucial.
Atomic design system gives us the flexibility and the structure we needed. It helped us make changes, replace components and maintain a nomenclature that was scalable.
Profile pictures
Objective: Design default profile pictures for users that look neutral, fun and vibrant
To create neutral shapes I took inspiration from patterns in our brand guidelines. I’ve also used all brand colours to offer more options. Profile pictures appear in multiple instances on the platform and we wanted to create something fun playful and colourful.
Daily check in widget
Objective: Design a colorful widget with simple inputs that checks up on the users everyday.
As the check in widget is meant to be used, ideally, everyday, it was important for the UI to stand out and be visible to the users. The options are kept simple with easily understandable text and corresponding emojis on top. I chose to use a colorful border while keeping the inside of the widget white and plain as to not interfere with the options.
Teams
Objective: Design a “slack-like” experience for the users where one can be part of groups, in which they can upload, share, comment and react to wellbeing content.
The most challenging part of designing teams was not the interface of teams but the addition of extra navigation in the existing interface. The navigation has important CTA’s that need to be visible or accessible to all the users at all times. The solution was the design a pop out navigation that only exists for teams interface. It does not disrupt the existing nav in anyway and makes space for additional information that needs to included in the future.
The interface of teams is kept quite simple to let the content shine. To encourage more interaction and make it more fun, we included a range of reactions the users can choose from.
Champion metrics
I designed data visualizations that provide user statistical information to the champions (team leads and other users who might have to access other members’ data)
Data Visualization
I collaborated with our Data Analyst to produce a data visualization for the daily check in widget data. Champions (users who have access to their team members information) can use this data to help improve their team’s communication and check in with their team when needed.
Arabic design system
Having primarily middle-eastern audience, LVL needed an arabic version to accommodate our arabic user group.
Since Arabic is a right to left language it required all the atomic design system elements to be re designed. All the navigation elements were changed to be on the right.
