The HoloLens is a very new piece of tech, even though it’s been around for a few years, so a lot of the general do’s and don’ts are still being figured out and with a new version possibly around the corner it’s likely that these will change a bit in time.
Before I continue I just want to stress that I am by no means an expert in UI design, especially for the HoloLens, and a lot of this post will be me reiterating the tips and tricks I’ve picked up from the Visr leaders, HoloLens officials I was able to speak with a few people from the HoloLens team at Microsoft, as well as a few things I stumbled across and my own thoughts on each.
So without further ado, let’s begin.
I cannot put too fine a point on this but for the love of god either make your own mock ups or get someone else to do so, so you have something to work off or aim for. This can save you a lot of time and hassle later. In the worst-case scenario without it, like in mine unfortunately, you may end up with a sub-optimal user experience which doesn’t work for its intended use or user story and have to scrap the whole thing to get something decent.
How detailed these mocks are depending on personal preference and how much information you want to put into one image for the rest of your team to share; from what I’ve seen in examples you want to show the range of different states such as when a feature is being used or even when something goes wrong!
Personally, I tend to favour pen and paper drawings for how quick and simple they are to make, letting me jot down ideas as soon as they come, however they don’t offer much guidance on the overall design and can sometimes end up being very unclear. As such I’d recommend using the pencil and paper approach as a starting point and then moving on to digital, more refined versions later on.
Furthermore, you’ll probably want to give some idea of how the UX reacts to input, it doesn’t have to be too detailed at this point but as before you’ll want to have enough to get across the general idea of what’s happening; e.g. does something shake or change size when the user looks at it?
HoloLens stuff uses white on grey background and the colour black becomes invisible, and even darker colours can have this effect too so choosing the colours scheme suddenly becomes a lot more complex.
You’ll see in a lot of Microsoft own HoloLens products they favour the colours blue, white, and dark grey, as these colours work well not only with each other but a variety of different colours too. This is important to note as you may have a button with a transparent background so any text or icons on it must be a colour which can work well against a variety of different colours, textures and objects.
Additionally, some shaders on materials won’t work on the HoloLens hardware; one idea was to a frosted glass effect for the menus and whilst it worked on Unity it ended up crashing the app on the hololens.
If you want some help deciding on a colour pallet I’d suggest firstly keeping things simple and regulating yourself to just a select few and looking into some colour pallet generators for ideas. The two I recommend are Coolors and Color Mind both of which I use for my own projects on a regular basis.
The key goal of the HoloLens is to put information INTO the world; not over laid on something or stuck to the users face like a HUD, but IN the world.
Don’t stress if you’re struggling with this concept because I did too, and still do to a degree, and the best advice I can really give is to really look over the videos Hololens has on its YouTube channel and trawling through various websites to see what others have done. Try thinking of the World as the Desktop only that you’re not bound by having everything in a window (yes, I know that almost all of Microsofts own apps have everything in a window but it tends to defeat the purpose of the HoloLens, doesn’t it?) so you could have one button near to the users right hand or sitting atop a surface whilst the thing they’re looking at hangs on a nearby wall. Again, play around and see what works for what you’re trying to do.
You should also be aware that the human brain is very, very, very dumb and you’ll either find your user trying to reach out for the ui or gesturing to something that doesn’t actually exist (as I have done multiple times). To avoid this, you’ll want to keep things just out of arm’s length, or perceived to be just out of arm’s length, as much as you can although for some applications this may not be best for usability. There’s also something called a Clipping Plane, where the holograms become invisible if the user gets top close, which is normally set at 2.0m but depending on the type of application you’re making you may want to have this smaller or larger.
My ideas of HoloLens UX design The HoloLens is a very new piece of tech, even though it’s been around for a few years, so a lot of the general do’s and don’ts are still being figured out and with a new version possibly around the corner it’s likely that these will change a bit in time.
