方寸之间——图标的设计方法及技巧.docVIP

方寸之间——图标的设计方法及技巧 ??? 图标的含义? ? 不同的人对图标的定义是有不同的，司机眼中的图标可能是交通指示牌上的指示图形；机械操作员眼中的图标可能是操作面板中按钮上的图案；计算机开发人员眼中的图标可能是电脑中的桌面图标、文件图标。而对于使用移动设备的我们来看，图标就是手机中的应用程序。? ? 图标是标志、符号、艺术、照片的结合体，是图形信息的结晶。而我们今天所要说的图标则是在我们生活中接触越来越多的手机应用图标。? ? ? ? 手机应用图标的大致可以分为以下四类：? ? A、图像类。利用实体物品说明应用途。? ? 例如:、iReading童话故事、乐顺备忘录、中国全史、CameraGenius、VirtuosoPiano? ? ? ? 这类中多为书籍、现实生活中常见的物品，这种表现方法能够直观的展现应用的使用方式和操作方式，让用户能直接清楚的了解这些。? ? B、内容类。将应用或游戏的操作方式或是出现的代表性的图形展现出来。? ? 例如：水果忍者、CuttheRope、FIFAgame、Asphalt5、FaceFighter? ? ? ? 使用展示内容的多为游戏应用，这类应用更需要给用户展示尽可能多的游戏玩法和内容。? ? 例如水果忍者和CuttheRope这款游戏，很好的表现了游戏玩法。? ? C、比喻类。用其他物体让人们产生对应用的联想方式。? ? 例如：k歌之王、计算器、LiveSketch、todo、MSN、影片播放器? ? ? ? 这类图标往往会在效率类／聊天类／健康类的应用中，因为这些类型的图标往往都比较抽象，所以我们需要利用更多人们熟知的形象和物品来为应用内容做隐喻，让用户能够联想到其里面的内容，而不是去看简介。? ? D、标志类。利用本身已有产品或已经深入人心的标识来展现。? ? 例如：虚拟人生3、凯立德移动导航、列车时刻表查询、UNIQLO、掌中新浪? ? ? ? 严格意义上讲这种类型并不属于图标的范畴，但由于人们对其已经印象深刻，所以在应用图标中可以借助这种“印象”来阐述应用内容。对于一些已经有一定用户基础的公司或是应用使用这种方式更加合适。? ? 除此之外，我们还能看到一种图标，是使用文本的方式，但这种并不能称之为图标。这种只局限在使用少量字便能说清楚应用内容时。文字过多就会影响用户的识别，在小图标时便无法识别。? ? 整理图标创意? ? 图标最关键的点在于“隐喻”，这是图标的灵魂。当你在设计你的应用程序图标时，第一件事就要考虑什么样的图标能够说明你的应用程序，能够吸引你的目标用户。这也就需要我们去认真的分析和提炼，让这枚图标更有生命力！? ? 下面通过仔细分析《水果忍者》这款游戏图标。我分成5个部分来给大家介绍这枚图标创意的过程。这是一个分析过程，希望大家能从中得到一些启发。? ? ? ? 分析应用程序的性质? ? 你的应用程序是游戏？还是书籍？还是应用软件？是否能使用一个词或是一个句子就能够说清楚？这是设计一枚图标最根本的事情，也是隐喻的开始。? ? “《水果忍者》这款游戏是一款第一人称视角的游戏，你将扮演忍者，而你的手指便是忍者刀，尽力切开屏幕中出现的所有水果，同时避开与水果一起弹出的手雷。”? ? 游戏简介很清晰的介绍了游戏的性质和规则，其是一款容易上手，规则简单的切水果游戏。? ? 根据内容进行关键词提炼重组。? ? 如果应用程序是一款游戏，我们需要尽量用一个词语，或是一个动词＋名词的形式将游戏内容展现出来。提炼关键词和关键点是非常重要的，尽可能去掉副词和形容词，以及描述性的语言。? ? 通过提炼游戏说明，最终我们会得到以下几个关键词：忍者、刀、切开、水果、手雷。? ? 接下来重组这些关键词：忍者用刀切水果，并避开手雷。其中“忍者”“刀”均为用户自己，可以不用在图标中展现。而需要展现的后面的“切水果、避手雷”。最终经过精简该图标的内容就会清晰很多：“切+水果”。? ? 将词语具象化，语言图形化。? ? 这个过程是确定图标的一个很重要的部分，也是将语言图形化的第一步。? ? 首先，要将词语尽可能名词化。由“切”这个动词，我们可以联想到“刀”“刀痕”等。? ? ? ? ? ? ? ? 其次，名词需要更具体，并选择更具代表性、更饱满的形态。“水果”容易图形化。但需要进一步具象化，给用户更直观的感受。? ? ? ? 在选择水果时，需要选择更具有视觉冲击力的色彩、饱满的形态。西瓜这个形态非常饱满，且红色有着比较强的视觉冲击力。容易让人产生好奇心和破坏的欲望。? ? 定位你图标的风格，清楚你的用户。?