.webp)
To build delightful automotive experiences, designers need advanced tools enabling the creation of outstanding graphical user interfaces with minimal time and effort. Qt Design Studio includes all the resources to easily create stunning UI applications that include state-of-the-art 3D graphics and run with optimal performance on any embedded system.
The modern in-car experience is increasingly drifting towards the use of 3D graphics to enhance the in-vehicle experience. Surround-view monitors, parking assistants and navigation systems for head-up displays are just a few examples of applications that rely intensively on 3D graphics. These advanced driver-assistance systems (ADAS) are becoming more common as they widely extend the driver's situational awareness through realistic renderings of the car in its real-time surroundings. In all of these cases, the so-called “digital twin” has become a popular way of visualizing the vehicle’s status and performance inside the car by means of advanced 3D graphics.
Let's look together at how such great 3D graphics become part of the UI applications powering the modern car's digital cockpit.
3D-enhanced HUD navigation system
3D Design and UI creation
To begin with, 3D models are created in a 3D content creation tool such as Blender, Maya or 3ds Max. The 3D car model can include animations for turning on and off the lights, opening and closing doors etc. With current state-of-the-art graphics tools and abilities, the quality of such 3D images can be incredibly good, to the point that it may be hard to distinguish them from a high-resolution picture or video of a real object.
But in themselves, such 3D designs are just images and to drive meaningful in-car experience they should become part of a UI application, whose behavior is interconnected to other functions, services and sensors linking the visuals to the world. This is what happens in Qt Design Studio.
In Qt Design Studio, each component of the 3D model can be connected to data coming from car's sensors. In this way, the lights of the 3D model in my car's UI turn on when the real car’s lights are turned on, and similarly doors may open and close. The behavior of the 3D model appearing in the UI is now connected to the functioning of the real car. In a more sophisticated ADAS application, we see the 3D car model on the road with other 3D rendered cars and possibly pedestrians around it, in a 3D representation that mirrors the actual situation of the car.
Outrun ADAS scene
Through data binding, Qt Design Studio enables the connection of the design with the real world. Here the UI application comes to life from the visuals coming from the design and the data coming from the car’s sensors.
Design and Development
When the 3D graphics assets are imported in Qt Design Studio, no detail is lost, and the design remains intact and looks exactly the same as in the 3D content creation tool.
In Qt Design Studio, technical artists have all the tools to transform the visual content (designs, prefabs, textures, light) into a real UI application by adding states, transitions and property bindings to it.
All these operations can be implemented visually by clicking and dragging properties onto the model, without the need to write a single line of code. However, it is beneficial to know that, at every time of the process, the UI that is being created in Qt Design Studio is also automatically converted into QML code. At any point, the user is free to choose whether to change the UI visually or by editing the code. The two representations are synced in real-time so that any change made to one representation is immediately reflected in the other one. The possibility to work on code paves the way for the backend developers, who can use the same tool as the designers to work on other aspects of the UI, like data integration and testing.
This possibility for designers and developers to work together on the same tool ensures that not only the compelling appearance of the UI is preserved from prototyping to deployment, but also that the user experience is optimized in the backend and corresponds to what the UX designers had originally planned.
Creating the wow factor
Powerful 3D graphics have a wealth of important automotive use cases and increase the prestige of a car brand. Qt Design Studio offers full support to physically based rendering (PBR) for full compatibility with standard material models. Adherence to the PBR standard substantially simplifies the task of importing 3D assets in that it ensures that the model will look in Qt Design Studio exactly the same as in the content creation tool, without the need to create custom shaders for different surface types. PBR also enables access to thousands of 3D models available online that can be used and customized according to the UI application's needs. But there is more to it.
Light, shadows and reflections are essential to creating a realistic 3D scene. Qt Design Studio offers several types of light, including Image Based Lighing with HDR maps, for photorealistic rendering. In addition, the availability of Global Illumination allows to model indirect lighting and to make the scene even more realistic.
Post-processing effects add the final touch to the 3D model and scenes. Qt Design Studio has 21 post-processing effects to choose from – with more planned for future releases. Blur, depth of field, anti-aliasing, tone mapping are just some of the readily available effects (3D Effects | Qt Design Studio Manual 3.8.0). Post-processing effects can easily be added via drag-and-drop to make a 3D scene more immersive and add a cinematic touch to the full UI.
Finally, particle effects are excellent for creating eye-catching animations that simulate fluid and air flows inside and outside the car. Particles can be used for stunning animations involving morphing, sparks, dust and smoke. External weather conditions that may adversely affect driving – such as rain, wind or snow – can also be effectively represented through particle effects.
Qt Design Studio is optimized for creating particle effects in embedded environments, where processing power may be limited – as in the devices used in cars.
Particles effect modeling the in-car ventilation in the Outrun demo
