A work for The Fish ><////°> in collaboration with the great team of Singular Factory
Menu
NEOM means “New Future”. In 2017 Saudi Arabia launched a project involving the construction of a futuristic $500 billion smart city in the middle of the desert that will be built to run entirely on alternative energy.
One of the ideas for the inhabitants of this new city under construction is that from day one they will have Augmented Reality tools to make their day-to-day life easier.
We designed the Design System for the interfaces of the Augmented Reality Applications, current and future, and the UX, UI and Unity development for applications such as Map Layers, Activity Daily Living, Remote Training and Maintenance.
Such a large project requires a good foundation. Colors, fonts, Information Architecture and more mundane issues such as the different types of cursors or the appearance of the logo must be established. All this taking into account that the elements will be displayed using virtual reality devices mixed with the Real World™.
Many designers talk about pixel-perfect design lightly. The reality is that it’s difficult to show to developers what that really means for each of the elements without proper guidance. Sometimes the automatic CSS from tools like InVision is simply insufficient. I worked hard to define the basis of the interaction elements common to all applications, with all their measurements and distances, as well as all their states and animations. 250 pages of pixel-perfect joy!
For the main menu, we seek the simplicity of the elements so that it obstructs the user’s view as little as possible. The menu folds and retracts with gestures in an animated fashion and it is possible to relocate it in your field of vision by pinching and dragging. Semi-transparent colors and glow effects complete the idea.
Imagine that while walking down the street you could have a combination of layers of information in real-time that overlap the Real World™. Imagine that you can also do this inside your house on a 3D map of your city that floats on a table or your living room floor. That is Layers.
I designed the product for all the layers:
Now think of a 3d map of your city that you can scale, scroll and rotate, in a rectangular or circular shape. What if you could also add 3d street furniture to your streets to plan them? That’s the concept of Maps I designed for the NEOM AR experience.
What if we combine Augmented Reality with a depth capture device like Azure Kinect DK? Then we can do things like a Yoga app that simulates your posture and compares it to the ideal pose in real-time so you can correct it. If we add to this a virtual trainer and gamification, with scores and rankings, the result is an application that encourages you to train every day and be healthier.
We all want our city to be clean and shiny. This App allows you to take a picture and geolocate the position of maintenance problems you encounter and report them: a broken streetlight, a request for a wheelchair ramp, a pothole to fix… Surely this will work in NEOM because in NYC this would be a fantasy.
Let’s say you are an Audi car mechanic working in Saudi Arabia. Audi have just launched a new model of car and you have to learn how to maintain and repair its engine.
With this remote training system, you would put on your augmented reality glasses in front of the engine and call your official Audi trainer in Germany at the scheduled time. He/she can see on his/her tablet the same thing you see through the glasses and can use some of the many actions available to explain all the steps necessary to complete the training:
The trainee visualizes everything his trainer does and can also use the same tools and interact with all the elements in his field of vision.
The result is a time and cost-saving and a safe way to continue training in covid-19 era.
Besides designing the product and all its features, I also designed the app to search, buy, and manage the courses resulting in about 100 screens.
To add applications to your Augmented Reality experiences in NEOM, nothing better than having an App Store that you can access from your device. These are some of the screens I designed.
But I think that’s enough screens for today. This project was huge. They were 4 very intense months putting my mind in Augmented Reality mode and learning every day a little more about this technology.