Mobile app version of vmapp.org
Login or Join
Connie430

: How can I achieve consistent colours in my app on different mobile displays? We are working on a mobile game that will run on iOS and Android devices. The graphic theme has been designed during

@Connie430

Posted in: #Android #Color #Ios #Mobile

We are working on a mobile game that will run on iOS and Android devices. The graphic theme has been designed during the first steps of the development by a single person. Now he's no more an active part of our team (he was enrolled exclusively for this purpose, for a shorter amount of time, and now he's focusing on other external projects).
Such theme is very colorful, mainly composed by green, light brown and orange elements.

The problem for the mobile dev team is that those shades have been selected by the designer using his Apple iMac and Photoshop, and we discovered that only the iPhone displays are capable of rendering them to look as the designer originally intended.

Instead, all the different Android phones use different color palettes that makes them much too bright, or much too saturated; depending on the display quality.

I'm sure that this is not an isolated issue when developing mobile app graphics.

How can we manage to render the same colours when the app runs on different displays?

All I know is that the original PSDs have been designed using the sRGB color space, should they have been done in a different way?

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Connie430

3 Comments

Sorted by latest first Latest Oldest Best

 

@Samaraweera207

This is a problem in all apps on all devices.

Mainly, the colours do not impact the user's experience.

There are millions colours of around us, but there are different manufacturers with different resolutions for all of the different models of android mobile that are available, no mobiles device supports all colours.
Mobile device hardware supports some 8 bit colours, some 16 bit colours etc.

Because of this we can't make consistent colours for all devices. They automatically choose the closest and most suitable colours.

10% popularity Vote Up Vote Down


 

@Kevin459

You could continuously adjust the shade of colour slightly until you find one that looks good both with full saturation and brightness as well as with very little saturation and brightness.

In addition to this, you could use the phones onboard light sensor to adjust the colours based on the level of ambient lighting, as seen with this app (light for daytime, dark for nighttime):



For anyone wondering if this will ever be possible for websites, the answer is 'Yes! Probably, maybe'. The CSS4 spec alludes to a Luminosity media query.

Anyway just a few options that might help. :)

10% popularity Vote Up Vote Down


 

@Samaraweera207

Not all displays are equal. This is a problem in the desktop world, too. I got shiny new monitors last year, and looking at some of my old work now emphasizes just how poorly calibrated my monitors were at the time.

My advice is to just accept it as something you can't control and ensure that there is sufficient contrast between your colors so that it does not impact the user's experience. If the user can't tell that there's something wrong (eg. "I know that button is supposed to be green, but it looks yellow to me" or "I can't tell the difference between these 2 colors"), they're going to assume that's the way it's supposed to be and happily go about using your app.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme