{"id":347979,"date":"2025-09-10T15:49:49","date_gmt":"2025-09-10T20:49:49","guid":{"rendered":"https:\/\/michigandigitalnews.com\/index.php\/2025\/09\/10\/android-developers-blog-hdr-and-user-interfaces\/"},"modified":"2025-09-10T15:49:49","modified_gmt":"2025-09-10T20:49:49","slug":"android-developers-blog-hdr-and-user-interfaces","status":"publish","type":"post","link":"https:\/\/michigandigitalnews.com\/index.php\/2025\/09\/10\/android-developers-blog-hdr-and-user-interfaces\/","title":{"rendered":"Android Developers Blog: HDR and User Interfaces"},"content":{"rendered":"

[ad_1]
\n<\/p>\n

\n
\n<\/p>\n

Posted by Alec Mouri – Software Engineer<\/em><\/p>\n

<\/a><\/p>\n

As explained in What is HDR?<\/a>, we can think of HDR as only referring to a luminance range brighter than SDR. When integrating HDR content into a user interface, you must be careful when your user interface is primarily SDR colors and assets. The human visual system adapts to perceived color based on the surrounding environment, which can lead to surprising results. We\u2019ll look at one pertinent example.<\/p>\n

Simultaneous Contrast<\/span><\/h2>\n

Consider the following image:<\/p>\n

<\/p>\n

\"contrast<\/div>\n

Source: Wikipedia<\/a><\/em><\/center><\/imgcaption><\/image><\/p>\n

This image shows two gray rectangles with different background colors. For most people viewing this image, the two gray rectangles appear to be different shades of gray: the topmost rectangle with a darker background appears to be a lighter shade than the bottommost rectangle with a lighter background.<\/p>\n

But these are the same shades of gray! You can prove this to yourself by using your favorite color picking tool or by looking at the below image:<\/p>\n

<\/p>\n

\"contrast<\/div>\n

<\/image><\/p>\n

This illustrates a visual phenomenon called simultaneous contrast. Readers who are interested in the biological explanation may learn more here<\/a>.<\/p>\n

Nearby differences in color are therefore \u201cemphasized\u201d: colors appear darker when immediately next to brighter colors. That same color would appear lighter when immediately next to darker colors.<\/p>\n

Implications on Mixing HDR and SDR<\/span><\/h2>\n

The effect of simultaneous contrast affects the appearance of user interfaces that need to present a mixture of HDR and SDR content. The peak luminance allowed by HDR will create an effect of simultaneous contrast: the eye will adapt*<\/b> to a higher peak luminance (and oftentimes a higher average luminance in practice), which will perceptually cause SDR content to appear dimmer although technically the SDR content luminance has not changed at all. For users, this can be expressed as: my phone screen became \u201cgrey\u201d or \u201cwashed out\u201d.<\/p>\n

We can see this phenomenon in the below image. The device on the right simulates how photos may appear with an SDR UI, if those photos were rendered as HDR. Note that the August photos look identical when compared side-by-side, but the quality of the SDR UI is visually degraded.<\/p>\n

<\/p>\n

\"contrast<\/div>\n

<\/image><\/p>\n

Applications, when designing for HDR, need to consider how \u201cmuch\u201d SDR is shown at any given time in their screens when controlling how bright HDR is \u201callowed\u201d to be. A UI that is dominated by SDR, such as a gallery view where small amounts of HDR content are displayed, can suddenly appear to be darker than expected.<\/p>\n

When building your UI, consider the impact of HDR on text legibility or the appearance of nearby SDR assets, and use the appropriate APIs provided by your platform to constrain HDR brightness, or even disable HDR. For example, a 2x headroom for HDR brightness may be acceptable to balance the quality of your HDR scene with your SDR elements. In contrast, a UI that is dominated by HDR, such as full-screen video without other UI elements on-top, does not need to consider this as strongly, as the focus of the UI is on the HDR content itself. In those situations, a 5x headroom (or higher, depending on content metadata such as UltraHDR<\/a>‘s max_content_boost) may be more appropriate.<\/p>\n

It might be tempting to \u201cbrighten\u201d SDR content instead. Resist this temptation! This will cause your application to be too<\/b> bright, especially if there are other applications or system UI elements on-screen. <\/p>\n

How to control HDR headroom<\/span><\/h2>\n

Android 15 introduced a control for desired HDR headroom<\/a>. You can have your application request that the system uses a particular HDR headroom based on the context around your desired UI:<\/p>\n