Mindful Bloom

Spatial-Based Mindfulness for Augmented Reality
As we move towards a mixed-reality-centric future, wearing headsets all day and being constantly immersed in virtual environments will cause digital fatigue like nothing before. Mindful Bloom brings digital mindfulness to AR through lightly guided, spatially driven meditation.

For this project, I contributed to the concept design, and led both visual design as well as Unity development for the final experience.
Tools
Magic Leap
Unity
Figma
Roles
AR (Unity) Developer
UI Design
Timeline
April - May 2023
August 2023 -
Collaborators: Sunniva Liu, Anton Renouf
Overview

Mindful Bloom is a mindfulness intervention for the coming age of spatial computing, addressing concerns of increased cognitive load and reduced sense-of-self from wearing headsets throughout the day. We’re improving on current digital mindfulness solutions such as Headspace by taking an active, finger-painting approach to destressing, and allowing more flexibility between user to user in how guided or freeform their meditation should be.

Helping Beginner Meditators

Previous research in VR guided meditation has shown that virtual environments and objects can guide beginners’ attention towards body awareness subtly. Additionally, finger painting’s movements and tactility have been found to enhance one’s state of mindfulness and broaden their scope of attention.

Mindful Bloom would be breaking new ground thoughtfully - although digital finger painting has been less studied, we’d be adding tactility back by having our user paint onto their environment, brushing objects and surfaces around their bodies.

Understading Last-Gen, True AR Hardware

We wanted to make Mindful Bloom a working glimpse of the future, and the Magic Leap 1 was the best true AR device we could loan at the time. As a last-generation hardware package, I knew there would be drawbacks to design for from the start.

Limited Field-of-view

True AR headsets often suffer from a very limited field of view (FOV), so UI and 3D objects would have to be carefully placed to not be forgotten by the wearer.

Unavoidable transparency

True AR headsets allow the user to see the world, but introduce an additive color issue - colors on screen will be heavily manipulated by the background and lighting around them.

Input Performance

The Magic Leap’s hand tracking is - not good. Still, it would serve as the best option for interacting in AR, so I would have to rely on intuitive, large human motions and avoid precise gestures.

Exploring the Essence of Finger Painting

During ideation, the team utilized actual finger painting as a quick way to evolve concepts hands-on before jumping into Unity.

The freeflow nature of our unguided finger painting was something we decided to follow instead of a more guided, Headspace-esque approach, and we felt that being able to spatially paint would enrich the overall experience.

Concept Development

Developing a working experience in VR is big investment, so before I turned to Unity, I wanted to nail the core experience of AR finger painting down. Having experienced current digital mindfulness tools such as Headspace, we wanted to create a journey with a pace set by the user.

With an interaction flow created, I storyboarded the experience to get an idea of object hierarchy in AR, and how a user’s surroundings would be built over time as they painted through it.

Designing For AR, not Around It

When designing interfaces for AR, some UI rules can be broken for the better. I transformed pitfalls of the Magic Leap into strengths of design.

The Power of Occlusion

Darker objects can “cut out” lighter objects, helping them to pop against busier 3D environments, both augmented and digital.

Hierarchy of UI

In busy scenes with heavy use of 3D elements, the UI can become an additional distraction. Care must be taken to not overdesign interaces.

Fonts Matter!

I tested fonts extensively to ensure readability at small sizes. Inclusive Sans proved to be the most readable and a decent fit to the overall theme of mindfulness.

A Mindful Design System

I created the UI design language of Mindful Bloom, inspired heavily by rolling fog and clouds. The UI plays a secondary but important role - conveying guidance and context to the user to help them better understand the spatial interactions of this experience.

The power of using black

In true AR headsets, black is an impossible color to see. However, it can be used to occlude objects very effectively - becoming the most important tool for my design process.

Animations and Content Delivery

With busy scenes and text readability issues, I found it best to deliver UI content in sections, giving the user time to digest snippets, while iterating on gentle transitions to draw their attention back when there was new content. Here are iterations on a transition inspired by the movement of scattered clouds.

Balancing Visual Flair with Usability

I wanted to push the boundaries of visual UI design since Mindful Bloom was an augmented reality, immersive experience. However, I discovered that what might seem boring and “conventional” had value in adaptability, but could still be imbued with personality.

Taking the UI to Unity

When it came time to create a UI system in Unity for Mindful Bloom, the simple yet cute visual language immediately proved useful. In particular, I was able to 9-slice, layout, and animate UI components using just stock Unity components and a bit of extra scripting.

Through C# scripting and custom data structures, I enabled UI text to be easily be accessible and changed. In addition, I scripted this UI system to be able to listen to game state events and also trigger events when needed.

Creating Visual Polish with Performance

Working with older hardware - a first-gen Magic Leap - and having to implement our own designs without a large development team, we prioritized smooth experiences over aggressive technical exploration.

For example, brush strokes were Unity’s Line Renderer component with tweaks to make user input feel gratifying, and plane detection was not used in favor of pose detection - with the same effect of grounding the user before a meditative session.

I created a shader for visual “stress” objects in the environment that dynamically morph as the user finger paints more. Transparent objects show the best in AR, and the Fresnel effect looked wonderful.