A Practical Use Case for AR

2-3 minute read

Background

My interest in AR began a couple of summers ago when I made an onsite visit to a client in the healthcare and education space. Having viewed the site's facilities and training hardware, it suddenly hit me how beneficial AR could be for the institution in terms of training new staff and upskilling existing ones.

After this, I started reading into AR and making 3D designs.

As an example, I looked at the problem of fixing a punctured bike tube. Anyone who cycles on a regular basis will experience a puncture at least a couple of times a year. The following case study shows my approach and examples to how an AR bike repair app would help a person to fix a puncture - and ultimately save on recurring costs throughout the year.

A repetitive problem a lot of cyclists face

What I have done so far

Process

1. Research

In order to get a better understanding of bike repair specifics, I went on to YouTube and looked at some popular videos on how to replace the tube of a wheel. From urban gardening to car repair, YouTube is well known for having a community of users that post DIY video tutorials on a wide variety of subjects. With that in mind, it felt like a good place to start. I viewed a number of bike puncture repair tutorials and jotted down the various steps involved with fixing a puncture.

In addition to this I contacted a family member who has repaired his own bike on a handful of occasions. He came to mind as I recall him hiring a bike repair specialist to do a workshop with his employees on how to fix a punctured tube.

I then compiled my findings and created some user flows.

user flow diagram

This is the high level user flow for fixing a bike tube. It made sense to break up the flow into more digestable chunks as there were a lot more granular steps within each one.

2. Low fidelity (paper) prototypes

Design for AR is still very much in its infancy - there are no well defined prototyping tools, UI patterns etc to go by so its still a bit of a guessing game. VR is a little bit ahead of AR in this respect and a lot of the same spacial design issues apply. I therefore used a VR paper prototyping template I found online in order to sketch out some typical flows in low fidelity.

process image

Low fidelity prototypes had to be made in the context of the physical world with the user seeing digital overlays through smart glasses. The mockup above shows how AR would guide a user through the process of inserting the new tube and then screwing the cap back on.

Similar to designing for mobile/web, paper prototypes enabled me to quickly iterate through potential interfaces and interactions in advance of producing more high fidelity concepts.

3. High fidelity concepts

I picked out some of the key concepts from the low fidelity prototypes and created some high fidelity views. I'm still working on these as they are quite time consuming to make - especially given that I'm relatively new to any form of 3D design. I made the concepts using a tool called Blender.

process image

Here's an example of one of the initial steps in fixing the puncture. The AR app is prompting the user to flip the bike over by overlaying rotating arrows on the user's smart glasses.

process image

The user must now release the brakes as part of taking off the wheel. AR helps to pinpoint where and how this next step is done.

process image

In addition to this, the screws on the damaged wheel must be taken off. Again, AR can prompt the user as to where and how this is done but also provide hints on what tools are required in order to do so.

process image

Through the use of 3D models, AR can show the user an example of how the new tube should be fitted in. In this is example, AR is prompting the user precisely where to fit the new tube and valve after the wheel had been taken off.

What I have learned so far