Design Evolution of Bia

In this blog post, learn how Bia's design evolved over time and how input from fellow users shaped what it looks like today.

Conquer Emetophobia. Bia started out as Conquer Emetophobia, a static website with simple exposure content for emetophobia. The site explained how the avoidance cycle causes phobia and why exposure works to unlearn phobia, then provided a small amount of content in the form of letters, words, sentences, and images. I personally used this version for months during my first attempt at exposure therapy. I would visit each level in order on my phone or computer and practiced moving through the content until the content no longer triggered an anxiety response. The site was clear, easy to use, although not very pretty and had no engagement or personalization. All of the work of ensuring a positive exposure session was put onto me as the user, as the site offered not much more than a catalog of exposure content. As I shared this with others also embarking on their emetophobia recovery people asked for specific types of content, new levels, better support for mobile devices, but most importantly, a way to track their progress over time.

The Journey. Exposure is about incrementally taking your life back from phobia by intentionally seeking discomfort. It's a process built on trust - trust that by going through discomfort now you relieve yourself of the discomfort of your phobia later. The journey re-design was intended to visualize this trust. A full journey of 60 exercises was broken into 8 milestones, and each step recorded your progress. Having a way to visualize progress through the journey and see yourself improving over time was a massive benefit. All of a sudden, there was a clear path to overcoming phobia. Trusting the process became easier. A week of exposure showed real progress which made it easier to keep practicing exposure the next week.

Partnering with Professionals. If it's not clear from the first two screenshots, my personal design taste is not great. I had a vision, and the underlying content was there, but the UX on top was missing. I partnered with the digital design firm Tubik. We worked together through every step of the process, starting with reviewing my current site, designing the UX flow, aligning on a color scheme, and creating custom illustrations. I was extremely happy with the end result and I look forward to working with Tubik on more Bia features in the future.

The new design condensed exercises and takes much less vertical space. Custom illustrations for different exercise and lesson types make the site easier to navigate, and progress is easy to grasp at a glance. The mobile view collapses a milestone in a single horizontally scrolling view, with an expandable footer to help jump to each milestone.

Thank you for reading. I'm always interested in your stories and feedback, please contact us anytime. Also, check out this related blog post about the history of Bia.