YouVersion bible app: a UX case study

If you have ever attended a service in a pentecostal church, then you should understand the struggle of having to keep up with the bible passages being called by the preacher. It’s an extreme sport. Thankful for multiple fingers through which you can hold on to one passage while you view another in your hard-cover bible.

So imagine my shock at bible study on Tuesday, when I went to church without my hard-cover bible and could not easily switch between passages on my Youversion bible app. I had to lose one to gain another. And so it got me thinking, ‘I cannot be the only one experiencing this.’ That evening I asked close friends who had used the app to know what their experiences were like and found out that not only did they share my pain point, but they had others too.

The plan

I decided to run a 5-day design sprint, using the design thinking framework of empathy, define, ideate, prototype, and test. I was not focused on redesigning the whole app but on working on design features to make the experiences of users better.

The timeline

Wednesday

I put out the question on my WhatsApp status to ask who used the app specifically. I got a few responses, about 5 to be precise, and these acted as the audience for my work. I asked them questions about their experiences, how long they’ve been using the app and how often and what they use the app for mostly. After processing the information obtained in my research, I created two user personas to represent my audience. I also mapped out the collective experiences of these personas using a user journey map, showing emotions for better visualization of their experience.

Defining the problem

Pain point 1: Discoverability issue with the search bar on the ‘bible list page’

Although this problem was not expressly stated, it was expressed as a frustration of the users with statements like “and then I have to scroll.” Also, when I asked the users if they knew that a search bar existed, they were shocked.

Pain point 2: Users were frustrated with losing the current page whilst moving to another.

There is no way to track where they have been, and this means losing progress for them. 5/5 had this problem

Pain point 3: Users could not ‘tap reference.’

In each chapter, you have these little icons that appear on verses or words to show other passages that may have a relationship in some way. However, one must leave the page being read to view these passages. This generally affected the experience of readers.

One user, in particular, talked about the need for Greek and Hebrew translations. But I do not believe this is a design problem; hence I would not be working on this.

Thursday — Friday

To put into practice some of what I read about, I ran the crazy eights exercise, except I modified mine to crazy six (it does sound better).

I tasked myself with coming up with 2 ways to solve each of the 3 pain points I was working on. Here is a summary of how that went.

I know, not the best artist

Prototype.

Paper wireframe for all three pain points

<iframe style=”border: 1px solid rgba(0, 0, 0, 0.1);” width=”800" height=”450" src=”https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fproto%2FM4UCg10U7MJ96o1LUyIxgc%2FYouVersion-Case-Study%3Fnode-id%3D228%253A1080%26scaling%3Dscale-down%26page-id%3D228%253A839%26starting-point-node-id%3D228%253A1080" allowfullscreen></iframe>

I should mention that I made a design change to the ‘read’ page on the YouVersion app. I removed the search icon on the top right corner of the page because of its redundancy. People were more used to using the search icon at the bottom of the page called ‘discovery.’ Also, after using both, I discovered that their functionalities are about the same and do not serve any extra purpose. And so, I substituted it for an icon I believe would serve users better.

Pain point 1

I made the the field for the books act as an input field also. This way, you could either type the book you are looking for directly or scroll down the list after typing in the first letter of the book.

<div style=”padding:45.24% 0 0 0;position:relative;”><iframe src=”https://player.vimeo.com/video/753969004?h=454a76cd5e&amp;badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder=”0" allow=”autoplay; fullscreen; picture-in-picture” allowfullscreen style=”position:absolute;top:0;left:0;width:100%;height:100%;” title=”New Recording — 9/26/2022, 7:18:44 PM”></iframe></div><script src=”https://player.vimeo.com/api/player.js"></script>

<div style=”padding:45.24% 0 0 0;position:relative;”><iframe src=”https://player.vimeo.com/video/753962489?h=7648220171&amp;badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder=”0" allow=”autoplay; fullscreen; picture-in-picture” allowfullscreen style=”position:absolute;top:0;left:0;width:100%;height:100%;” title=”New Recording — 9/26/2022, 7:01:10 PM”></iframe></div><script src=”https://player.vimeo.com/api/player.js"></script>

Pain point 2

I introduced a ‘pin’ icon which allows users to pin the current page they are on, giving them the freedom to check other passages without fear of losing the page they are on.

Pain point 3

Now, when you click on the tap reference and the bible passages come up, you can click on the bible passage to see what it says without having to leave the current page.

<div style=”padding:45.24% 0 0 0;position:relative;”><iframe src=”https://player.vimeo.com/video/753966398?h=f8f5d0e224&amp;badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" frameborder=”0" allow=”autoplay; fullscreen; picture-in-picture” allowfullscreen style=”position:absolute;top:0;left:0;width:100%;height:100%;” title=”New Recording — 9/26/2022, 7:11:30 PM”></iframe></div><script src=”https://player.vimeo.com/api/player.js"></script>

Paint point 3

After conducting a usability test, these were my result: