锦上添花:让图示穿上颜色说说话

2016-02-16 23:24 11 1 收藏

下面,图老师小编带您去了解一下锦上添花:让图示穿上颜色说说话,生活就是不断的发现新事物,get新技能~

【 tulaoshi.com - 平面设计 】

文字、图片以及图示可以说是用户界面中最重要的三种基本元素,使用图案代表文字有很多的优点:例如跨越语言限制、降低制造成本、降低学习成本等等。

最常见的一个例子就是男女生厕所的区别标志,从最常见的人形符号、性别符号以外,我们也常在许多场合看到各种创意的性别区别符号,像是电影「赌侠」中在赌神号中的厕所门口即是用PUKE牌的 King 以及 Queen 来做为男女厕的区别符号。

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

用户界面系统中也有许多常见的符号标示:打勾代表确认、叉叉代表取消或删除、放大镜可能是代表搜寻、放大或者是缩小、垃圾桶当然很直觉的就是删除了。以及来自于音响界面上的播放、停止、跳转等等。从极度形象化的到抽象的皆有,这些都是我们相当熟悉的用户界面符号。

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

而其中有一个容易被大家忽视的符号:0 与 1,我们可以在很多开关中发现其踪迹,像是以下这个是 iOS 系统中开启「勿扰模式」的状态:

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

0 与 1 的符号在现今被简单的定义为开与关闭的意思: 0 代表着 off (断电),而 1 则代表 on (接通)的状态,在计算机以及电路中皆是如此,事实上在许多应用场合中并不是写上 0 或 1 的符号,更多时候是使用简单的 一槓符号(│)以及圆圈符号(○)来表示,也带有更强烈的符号性。

在 iOS 系统中常见的开关符号中即可以看到这个符号的踪迹,不过我们在确认的时候发现,当系统语言设定为英文时,开关符号上依然是写着 ON / OFF,而在中文、韩文、法文等系统的情况下中则是以 (│) 以及 (○) 符号来表示:

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

虽然猜测是因为各种语言文字长度的关系(有些语言的开与关可是非常长的),所以苹果的 UI 设计师如此设计。但其实日文系统中亦是书写日文的情况看来,在这个空间里面要写上中文的「开」以及「关」应该是没什么难度吧。

而值得一提的是,代表着电源开关按钮的这个即是 (│) 以及 (○) 的合并,来代表这个按钮的功能:开与关。

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

先望其色,才读其形比起形状,其实人们对于色彩的辨识能力更为优先且强烈,以下我们看看几个常见的例子:例如作业系统中随处可见的代表应用程式入口的图示。你有思考过你是怎么去寻找这些图示的吗?以下这个是 Photoshop 以及 Illustrator 软件,软件公司在 CS3 以后便以简单的色彩来区别每一套软件,相信大家在找寻它们的时候都是先想:「Photoshop?就是那个蓝色方形的图示」

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

这或许还能解释一部分关于为什么通讯软件大多喜欢用绿色作为形象以及图示设计的标准色彩,你是不是也是先找绿色,然后才确认 APP 的图示内容是个气泡框里面写着LINE呢?

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

其实这是因为我们在快速滑动手机画面、寻找应用程式时,眼睛并不会一直停下来扫描画面上的每个细节,而在快速的浏览动作中最容易感受到的视觉资讯就是色彩了,我们可以透过模糊后的画面来模拟类似的情况:

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

而 iOS7 中一直被认为过度极简的细字图示设计,也在 beta5 的版本中对于设定图示重新加上了色彩的设计,可以发现调整后的效果在辨别上来说提高了不少:

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

而正因为人们更习惯透过颜色、发光与否来分辨状态,因此许多电源延长线的开关都制作成会发光的样式,甚至可能根本不需要文字描述也可以正常的使用,底下右图即是 iOS7 中新版的开关按钮型式。

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

当然厕所性别识别符号也是。其实在许多时候我们看到这组符号都是制作成彩色的版本:红色代表女性、蓝色代表男性的色彩组合,看起来是再直觉不过了。其实当我们看到这组符号时,首先接受的是也色彩的讯息,接下来「也许」才会依据图形的细节而确认实际上代表的性别。(以防走错门)

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

如果有一天有人把厕所的门做成这样,你直觉会想走进哪一监厕所呢?

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

就像有人可能会因为蓝色的门而误闯女厕一样,你有发现上面 iPhone 画面中勿扰模式的符号其实是颠倒的吗?

锦上添花:让图示穿上颜色说说话,PS教程,图老师教程网

来源:http://www.tulaoshi.com/n/20160216/1576383.html

延伸阅读
标签: 编织
步骤1: 步骤2: 步骤3: 以一根80cm的线为轴用五根线为绕线编斜卷结,从上到下线的尺寸是80、60、60、60、60,注意图中特别留长的线,也就是两根80cm的线,那是我们的结尾线,留长至10cm左右 步骤4: 把右边第一根线分出来做轴挂四根线 步骤5: 挂好了 步骤6: 把右边中间的第一根线为轴拉...
标签: 电脑入门
安装Windows 7第三方主题:Windows 8 Skin Pack 1.0 For 7,可以将自己的Windows 7装扮成Windows 8 M3 Build 7959。近日这款主题的作者hameddanger对主题包进行了升级,发布了Windows 8 Skin Pack 1.1,主要新增了对Win7 SP1的支持。 Windows 8 Skin Pack 1.1支持系统: Windows 7(SP1) 32位和64位版本 支持各语言版本 官方下载:http:/...
孩子的乳牙早脱落应该怎么处理 孩子未到换牙的年龄,却因好动磕碰或者龋齿、牙龈炎等疾病导致乳牙早脱的现象屡见不鲜,也不容小觑,家长应该引起注意。 因为乳牙早脱会导致相邻牙会发生移位,而乳牙丧失时的年龄越小,邻牙倾斜的机会越多,甚至影响以后恒牙的萌出或使恒牙出牙不齐。为了预防乳牙早脱,我们要给父母提些意见: 第...
标签: 办公软件
    有时在文章中要加入一些说明图来表示某种实物之间的关系,但是如果自己画真的是太麻烦了,在Word中准备了一种叫图示的功能,它分为以下几部分:组织结构图、循环图、射线图、棱椎图、维恩图、目标图。 (1)组织结构图:用于显示层次关系。 当我们插入时,默认是二级层次,当我们想添加固定的框时,只要我们右...
标签: 电脑入门
许多QQ秀都是要收费的,不过笔者找到了一个免费换QQ秀的方法,只在三十秒就可完成了。 第一步:在浏览器中输入“http://qqshow.qq.com/cgi-bin/qqshow_camera_getsuc?no=14082&uin=261701316&forinit=1”。在出现的页面中点击“在qq上显示该合影” 。如图一所示: 图一 第二步:在随后出现的页面中输入自己的QQ号...

经验教程

122

收藏

43
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部