Color Gradients in Mobile Themes

Have you even find you mobie theme show uncomfortable colors with many line? Actually the theme contains many color gradients and color blending. To make a perfect theme we need to solve this problem, how exactly makes color gradients look nice in mobile theme.

This is a subject that pops up every now and then. So I thought I might delve a little deeper into the subject for your reading pleasure.

To summarize; most computer screens displays images in 32-bit (or actually 24-bit (+8-bit)) color depth, also known as truecolor. Whereas mobile phone screens uses a lower color depth. Typically 16-bit, or in the case of newer SE phones; 18-bit (which means that the screen can show a range of 262.144 different colors).
What this means is that when you use gradients in an image for a phone theme, you’ll usually end up with something that on the phone doesn’t look quite like what it does on your computer screen. You’ll get an effect known as color banding, as shown in this example:

You can avoid this by being careful using gradients (i.e. not using them), or by adding noise/texture/pattern to break up the gradient. Like this:

If you’re using Photoshop there is a freeware plug-in available (DepthDither 2.0 – download here) that can help in processing your images for mobile phone use. Here’s an example gradient run through the plug-in:

Just download depthdither and install it in your computer, it’ll automaticly built into your photoshop program.

and i think this is the best setting for depth ditter, i alwaays use this setting in all my themes when I used images with gradients :

Set the colour depth mode into R6G6B6 (18bit) and choose the noise mode (move the pointer)

Source : eseth.net

 

4 responses to “Color Gradients in Mobile Themes

  1. wow use photoshop Gan. like that.

  2. jee

    whatta nice tutorial, i wonder if those action script can be used in adobe flash :p

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

Join 15 other followers

%d bloggers like this: