观察|今天你了解icon设计吗?它就在我们身边

比起文字,图片更能引起人们的注意。

因此,icon的首要功能就是代替文字,用图形化的语言来传达信息。

观察|今天你了解icon设计吗?它就在我们身边

相信大家都在电视上看过这么一则广告:洗了一辈子头发,你洗过头皮吗?也是因为这个广告,让无硅油洗发水的概念来到人们身边。那么,用了一辈子的智能手机,你又知道什么叫icon吗?今天我们就来聊聊关于icon的那些事儿。

何为icon

icon,中文译为图标。图标又可拆分成图案与标记。

早在远古时期,人们就知道用图案和标记来传递和记录信息。如中国的“甲骨文”,古埃及的“象形文字”,都是原始人民模拟原始社会生活所描绘的图案和标记。

又比如沧源岩画中的《舞蹈牧放战争图》,上半段描绘的是群舞场景,中间是氏族生活中的放牧场景,下半段是战争图。这幅岩画将氏族生活中所有重要的事件全部描绘在同一幅画面中,也是原始人民用图案来传达和记录信息的一大佐证——在文字还没有产生的时候,我们的祖先就知道用图案来传递和记录信息了。

随着科技的发展,智能手机

的使用率越来越高,人们每天都要通过智能手机来进行各种操作、获得各种信息,因此信息的准确传达与接收变得非常重要。

研究表明,大脑处理视觉内容的速度比处理文字的速度快6万倍。比起文字,图片更能引起人们的注意。因此,icon的首要功能就是代替文字,用图形化的语言来传达信息。

观察|今天你了解icon设计吗?它就在我们身边

早在远古时期,人们就知道用图案和标记来传递和记录信息。

相对于icon,可能人们更加熟悉的是logo。Logo同样是一种图形视觉语言,用图形来传达信息,那么icon和logo有什么不同之处呢?

我认为,icon重在展示功能,是功能识别图标。比如:当你看到安全出口这个icon的时候,它主要想传达的是前方是安全出口。而Logo是一种身份识别图标,主要想传达的是身份信息。比如:当你看见可口可乐的logo时,你就知道它是可口可乐公司生产的饮料,它主要传达的就是可口可乐公司这个品牌身份。

在我们的日常生活中,icon的应用随处可见。我们可以笼统地将其应用场景分为三大类:智能界面、产品的说明书及表面、交通指示类。智能界面就是指我们的智能手机界面以及网页界面;产品表面及说明书中也有很多配合文字讲解功能的icon;交通指示类的图标包括:安全出口、方向指示、卫生间图标等等。

想象一下,不管你去哪个国家旅行,哪怕你看不懂那个国家的文字,但是你也不会上错厕所,因为一般的公共厕所都会贴有代表男女的icon,虽然语言不同,但是我们可以通过图片进行交流。其实,icon的应用就在我们身边,与每个人都息息相关,本文主要为大家介绍的是智能界面图标,也就是icon在智能界面中的应用。

icon在智能界面中的应用

智能界面中的icon主要分为三大类:

第一种是“解释说明型”图标。顾名思义,这一类的图标主要承载的就是解释说明特定的功能,它不一定是可以操作的元素,有时仅仅只是静态的图标,起到对文字说明的辅助作用。一般这种图标会配有一些简单的小文本来增强其信息传达的识别性和准确度。这种图标一般都出现在界面的导航栏、标签栏、以及首页的核心功能区域(如图一)。

观察|今天你了解icon设计吗?它就在我们身边

图一

第二种是“交互可操作型”图标,这种图标主要参与到用户的交互过程里。当用户按下这种图标之后,它给予回应,触发相应的功能,在它的帮助下用户完成一个交互过程,是此过程中不可或缺的组成部分。最典型的就是“点赞”的操作了(如图二)。

观察|今天你了解icon设计吗?它就在我们身边

图二

第三种是装饰性图标。这种图标不一定具有什么功能性,不一定要解释说明特定的内容,也不一定会触发什么程序,仅仅只是起着提高界面的整体美感和视觉效果的作用,可以给用户带来更好的体验感(如图三)。

观察|今天你了解icon设计吗?它就在我们身边

图三

设计风格总是在不断演进的,icon的设计风格也一样。不知道你有没有发现,手机系统过一段时间就要更新一次,其实每次更新之后除了系统修复一些bug之外,icon的风格也会有所变化。

人们总是用已知的思维逻辑去认识未知,对待icon也一样。

所以当用户界面刚出现的时候,第一代的设计师采用的是拟物风格。拟物风格的精髓就是模拟现实物品,包括光影、细节、投影等等,模拟得越真实越有利于用户的理解和操作。但是随着icon的发展,拟物化风格也带来了一些问题。因为用户

关注的是信息本身,华丽的装饰、真实的模拟,或许在设计前期受到用户的青睐,但久而久之,过多的装饰、纹理等会对用户信息的读取产生一种干扰。

2013年,苹果推出了iOS7,掀起了拟物化向扁平化发展的风潮。

扁平化在拟物化的基础上发展而来,它去掉了多余的装饰、纹理、渐变、投影等,只保留最显著的信息特征。提倡的是:“简约”“抽象”“符号化”的特征。相比于拟物化,扁平化风格可以使用户更加快速、准确地接受到信息。但是扁平化的设计也有一些弊端,比如过于抽象简约,令用户没有得到很好的情感体验。这也表明Ui设计的趋势再一步向“突出内容”的本质靠拢,即“认知简约”。

观察|今天你了解icon设计吗?它就在我们身边

消除原有的拟物化、变成扁平化成为了新的iOS7的主要风格体现。

icon设计发展至今,开始向“微扁平、轻拟物”的方向发展。“微扁平、轻拟物”的设计风格相较于拟物化风格更加简约、信息更加突出,它相较于扁平化风格有了丰富的情感内容。所以,我们现在经常看到手机里有一些增加了渐变、轻质感的icon。

未来的icon在向“动态icon”的方向发展,动态icon相较于静态icon更加具有趣味性、互动性、情感性,越来越多的设计者开始热衷于让手机里的icon动起来。

icon的设计道路从未到达高潮,一直在发展的路上。由于智能手机的发展、交互方式的不断更新,以及人们不断变化的需求和情感的需要,icon的设计风格也会一直随之改变。但是“以人为本”,是icon设计不变的设计原则。

作者简介

刘俊卿

北京交通大学视觉传达专业硕士在读,主要研究方向为UI设计,曾参与北京大学人工智能团队“aiXcoder”的网页界面设计,对UI设计尤其是icon设计具有大量丰富的经验以及独特的理解。

观察|今天你了解icon设计吗?它就在我们身边

以上为内容精选,

完整版见杂志2019年第9期~

观察|今天你了解icon设计吗?它就在我们身边

即可网购。

观察|今天你了解icon设计吗?它就在我们身边


分享到:


相關文章: