building icons for mobilellow

Search Options	close
Search the following clips: All Clips

news science politics food economy art
technology health internet religion psychology

Sign Up Install Learn More Login


	building icons for mobilellow

onestepahead

5-21-2008 5:00 PM

159 views

onestepahead says:

a few rules to fo

Add a Comment

Login to Comment. Not a member yet? Sign up

Today's Top Clips

visit the Top Clips page

View the Top Clips from May 21, 2008

Embed This Clip In Your Site...

<div style="margin: 12px 0px; font-family: arial; color: #333333; background: #ffffff; border: solid 4px #e5e5e5; width: 100%; clear: left;"><div class="CM_CTB_Content_Wrap" style="margin: 0px; padding: 0px;background-color: #ffffff;"><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content.clipmarks.com/blog_embed/1038fdfa-5bb3-4e87-a9af-9fb6effc346d/05786CA3-425C-4E2F-A788-E135DF20817D/" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://mobiko.blogs.com/mutant/2008/05/ramblings-about.html" href="http://mobiko.blogs.com/mutant/2008/05/ramblings-about.html" style="font-size: 11px;">mobiko.blogs.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://mobiko.blogs.com/mutant/2008/05/ramblings-about.html"><P>We all love icons. Icons are commonly used everywhere in GUI. At a recent project meeting where we were discussing "<A href="http://mobiko.blogs.com/mutant/2008/05/what-am-i-worki.html"><STRONG>Titan</STRONG></A>". A few interesting observations came out from the brainstorming session on the purpose of icons and how we are going to use that in our design. First of all, I must say I ain't no big fan of using icons in mobile UI, but if I have to use it, I suggest the following common sense principles.</P></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://mobiko.blogs.com/mutant/2008/05/ramblings-about.html"><li style="margin-left:16px;padding-left: 0px;">Keep icons "recognizable". All handheld devices have small displays and although your icon may be beautiful, it takes up valuable screen real estate. If the users cannot tell what the icon is meant to represent, it detrimentally affects the user interface.</LI></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://mobiko.blogs.com/mutant/2008/05/ramblings-about.html"><li style="margin-left:16px;padding-left: 0px;">Use contrast colors, show depth with shadow and gradients. Handhelds are used in different lighting conditions, and in sunlight they can be "washed out".</LI></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://mobiko.blogs.com/mutant/2008/05/ramblings-about.html"><li style="margin-left:16px;padding-left: 0px;">Make icon edges stand out. Thick lines are easier to identify in soft light.</LI></blockquote></div><div style="margin: 0px 6px 6px 4px;"><table style="font-size: 11px;border-spacing: 0px;padding: 0px;" cellpadding="0" cellspacing="0" width="100%"><tr><td style="background:transparent;border-width:0px;padding:0px;">&nbsp;</td><td align="right" style="background:transparent;border-width:0px;padding:0px;width:107px" width="107"><a href="http://clipmarks.com/share/05786CA3-425C-4E2F-A788-E135DF20817D/blog/" title="blog or email this clip"><img src="http://content8.clipmarks.com/images/c2b-foot.png" border="0" alt="blog it" width="107" height="17" style="border-width:0px;padding:0px;margin:0px;" /></a></td></tr></table></div></div>

New from the makers of Clipmarks: Amplify.com - Don't just share the news...Amplify it!

Clipmarks: Home; New Clips; Top Clips; Dashboard

Popular Topics: News; Life; Science; Technology; Entertainment

Get Started: Sign Up; Install Clipping Tool; How Clipping Works; Clip-to-Blog™; ClipSearch

Tools and Resources: FAQ; ClipWeek; Top Clippers; Top Tags; Site Map

About Clipmarks: About Us; Contact; Copyright; Privacy; EULA

Search Options

Today's Top Clips