Latest posts

Olli Laiho October 20, 2016 Cars UI Design

Porsche Launches the New Panamera

Olli Laiho September 16, 2016 Cars UI Design

Audi Q7 Named One of Wards 10 Best User Experiences

Olli Laiho September 9, 2016 Cars Kanzi

5 Things You Should Know About the Karma Revero

Olli Laiho August 16, 2016 Kanzi Products UI Design

Digital Cockpit Review, August 2016

Olli Laiho August 8, 2016 Interviews Kanzi UI Design

How Audi Creates Their In-Car Digital User Experience

Olli Laiho July 25, 2016 Prototyping UI Design

Working With Tomorrow’s Automotive Design Leaders

Olli Laiho July 4, 2016 Kanzi Kanzi Prototyping Tutorials UI Design

Webinar Archive: Managing UI Screens with Pages

Olli Laiho May 24, 2016 Kanzi Press Releases

Kanzi Connect Nominated as Finalist for 2016 TU-Automotive Awards

Olli Laiho March 4, 2016 Engineering Kanzi Kanzi Prototyping UI Design

How to Easily Connect the User Interface with Data

Olli Laiho February 12, 2016 Kanzi UI Design

Kanzi Scores a Touchdown at Super Bowl 50

Olli Laiho January 22, 2016 Kanzi Products Prototyping UI Design

5 Reasons Why Cars are the Next Digital User Experience

Olli Laiho January 4, 2016 Engineering Kanzi Kanzi Prototyping

Creating HMIs for All Car Segments

Olli Laiho October 7, 2015 Engineering IoT Kanzi Prototyping UI Design

Using Realtime 3D Visualization in IoT

Olli Laiho September 23, 2015 Engineering Kanzi Performance

Improving Graphical Performance with Progressive Rendering

Olli Laiho September 21, 2015 Kanzi Prototyping UI Design

How We Printed a Dashboard

Olli Laiho September 10, 2015 Kanzi Tutorials

How to Create a Digital Dashboard

Olli Laiho August 3, 2015 Engineering Interviews Kanzi

Interview: Visteon – How We Create HMIs for Connected Cars

Olli Laiho May 26, 2015 Kanzi

Rightware Newsletter 5 / 2015

Olli Laiho May 12, 2015 Kanzi UI Design

Cooking in the labs right now…

Olli Laiho March 3, 2015 Kanzi UI Design

Hacking the Car Dashboard

Olli Laiho February 10, 2015 Kanzi UI Design

Audi Virtual Cockpit claims awards

Olli Laiho January 27, 2015 UI Design

Welcome to the Rightware Kanzi blog

Improving Graphical Performance with Progressive Rendering

In this video and article, we discuss the challenge of balancing between graphical performance and visual quality in automotive user interfaces.


Progressive Rendering in Rightware Kanzi

Visual quality in graphics is paramount in the automotive industry. Car makers want the digital user experience in the cockpit to have the same brand quality as the rest of the vehicle. There is however another, even more important part in the equation, which is graphical performance. Especially in the instrument cluster it’s essential for your user interface to maintain a high framerate (usually 60 frames per second) – due to both safety reasons and driver expectations.

Every automotive hardware platform has its limits, and car makers tend to find that in order to increase performance on the hardware they’ve selected, they need to reduce the visual quality and vice versa. Quite often, the user interface ends up looking like a watered-down version of what the designers intended it to look.

Here at Rightware, we wanted to make it possible to maintain a high framerate without significantly reducing graphical quality. To explain what we did, let’s first talk graphics:


In order to run graphics at 60 frames per second, you need hardware that can calculate and draw every on-screen element in under 16.6 milliseconds (1000ms / 60 = 16.6 ms ). If your hardware isn’t fast enough and the update time goes over 16.6ms, the entire user interface will start to slow down, resulting in jerky movement and a bad user experience.


Image: Example performance analysis on automotive hardware, with content types separated. Render time of each frame exceeds 16.6ms – performance will be affected.

With the new Progressive Rendering in Kanzi introduced in Kanzi 3.1.1, you can now assign different framerates for different content in your user interface. This means that you can distribute the rendering load of selected elements across multiple frames – rendering them a bit slower, but giving more system resources for your performance-critical elements.


Image: Progressive Rendering is now enabled. Rendering load for each frame has been reduced. Objects in green group will now render in 60 fps. Objects in blue group will render every second frame (30 fps).

How does Progressive Rendering work in Kanzi?

For more information on this feature, check out the documentation in Kanzi, as well as the dedicated tutorial. But in a nutshell:

  1. Decide on which content you want to use Progressive Rendering for (your car model, media player, maps, entire pages, individual animations etc.)
  2. Divide your content into a few equal-size groups (similar graphical complexity) in Kanzi
  3. Create a Progressive Rendering render pass for each of your groups in Kanzi
  4. Voila.

Any questions? Ask in the comments section, or contact us.

Leave a Reply

Your email address will not be published.

Contact us
X Leave a message,
we will contact you within 48 hours.