深度专访:图标的故事
Tofloor
poster avatar
cxbii
deepin
2014-03-28 18:03
Author

为了比其他Linux发行版更具不同的魅力,Linux Deepin自12.06版本起,就开始的制作属于自己的系统主题。历时整整一年,Linux Deepin12.12发布,属于Linux Deepin自己的主题——Deepin主题也一同发布。今天,我们采访了Linux Deepin团队的设计组主要成员——郭攀,让她带您一起聆听Deepin主题的发展历程吧!

作者简介


郭攀,深之度设计部图标设计师。
电脑艺术专业毕业,早起从事游戏和动画的前期美术设计;在接触IPAD应用程序界面设计后,逐渐爱上并专职从事UI设计中的图标主题设计。

先说说你是如何知道并加入Liniux Deepin团队的吧。
在加入Linux Deepin之前,我从事的是游戏与动画的前期美术设计,业余爱好插画。
其实那个时候呢,我并不知道有Linux这类操作系统的存在,我的设计图稿除手绘外也多是在Windows操作系统下设计完成的。
因为对精致ICON的喜爱,我会在业余时间临摹大量优秀设计作品,临摹的多了,变会自己原创了,设计的多了,就会有想法了,既然这么喜欢,为何不专职从事这类设计呢?
于是我就转行啦。第一份UI设计工作是为一家香港公司做IPAD图书应用的界面设计,在那里他们教会了我不少东西,让我受益匪浅,在此谢过。
但求精的理念迫使我从新做了选择,我遇见了Linux Deepin,一个有挑战,有激情,有梦想,勇于改变世界的团队,我眼前一片光明,就这样我加入了Linux Deepin这个团队。

为什么要制作深度图标主题,深度图标主题的设计理念是什么呢?
为了用户能够有愉悦舒适的使用体验,并产生深层的认知与情感的交流。我们拒绝一味的追求酷炫的设计表现形式,更多的是从思想理念与用户情感需求的层面高度上来展示设计。在图标设计上,我们没有去跟风扁平化,更注重的是拟物传情。人们对物体的形态,色彩以及材质都有着特别的感知能力,所以,图标设计的情感和寓意主要是通过造型风格,色彩以及质感来表达的。具体怎样拟物传情呢,2014发布之时便拨开迷雾见真晓啦,敬请期待吧~

简单的告诉我们一枚图标的设计流程吧。
看似简单的一枚小图标,其实也是经过对图标用途的理解后绞尽脑汁的构思;绘制N副草图后,海选合格的,再进行单色稿绘制,其中需要把握好统一的规格与风格,这一步经过反复调试OK后,才能进入彩色稿部分;要保证图标与界面的色彩完美搭配的同时,还需要把握好所有图标色彩搭配上的和谐度,这些都完成后,也避免不了各种小修小改,因为我励志要将每枚图标都做的尽善尽美。虽然,我不可能满足所有人的审美,但至少我要做出让自己满意的设计。
用即将亮相的“游戏中心”图标来举例说明吧~

* 早期的深度游戏中心的图标是长这个样子的,取“DG”字母形象化,运用游戏设计中的加冕皇冠,展现游戏的胜利给玩家用户带来心理上的满足感。不过呢,最后被吐槽说像极了某某电影公司的标志,好吧,如有雷同,纯属巧合…


* Deepin2.0图标设计重新构思了游戏中心。从头脑风暴开始,说到游戏,你能想到什么?魔兽,dota,LOL …?拜托,能想点实际的嘛,我得把他表现在48x48px的小方块里,那么手柄,摇杆,游戏币,棋球牌类,奖牌奖杯等?恩,比较靠谱了,那么就画下来吧。表现手法,自定,这个自定,你需要考虑很多,后续我会简单说明!

那么先看设计草图吧,之所以叫草图,就是因为它很草~


黑白单色稿是在挑选草稿OK后的一步,虽然我一不小心多放了几枚图标上来,但你也不要多想,因为他们离彩色定稿还远着呢~


彩稿设计过程
我迫不及待的将图标主体物色彩化,但似乎出来的效果并不满意。


于是我又多设计了几种样式。选择自己最满意的那一款,然后将她放置底板之上。


对于一枚图标来说,底板与主体物一样同等重要,好的底板可以为图标加分不少。所以,我又开始了各种底板的设计调试,以游戏中心的色系为例,设计底板效果如下:


接下来我要做的便是将底板与主体物的各种搭配:
就像选妃一样,有魅力的,她总能脱颖而出,加冕黄袍,炫彩夺目!


在设计期间,有遇到过什么挑战呢
做设计,不像是画一幅随心所欲的写意插画。一个图标设计可以有很多种表现形式,想在如今表现效果绚丽多样的众多图标主题设计中脱颖而出,让用户看一眼便记住那是Deepin独有的特色,真的很难。哪一种才是最适合Deepin的,这需要设计师的创意,团队的交流,用户的反馈等等,你必须要考虑到的各种存在因素,才能展现Deepin图标主题独有的设计理念。

加入LinuxDeepin团队,有什么感想想和大家说的呢?
我想,对于常用Windows来的说的我,虽然Windows简单易用,但我不得不说Windows的设计缺乏品味。因为用了这么多年,我也没有很爱他;对于Mac来说,设计是我喜欢的,但操作体验方面还是些不敬人意的地方;而Linux Deepin励志要做简单易用,设计美观的操作系统,即便他现在也还不完美,但我们一直都在努力,能为Linux Deepin操作系统做图标主题这对于我来说真的很酷,并具有挑战性。

能不能提前发出有点新版本深度主题的详细呢?
Deepin2.0图标在设计上采用中轴线的构图形式,并大胆尝试以圆形为基础,和谐的展现以似变不变的衍生出一系列色彩绚丽夺目的精美拟物图标,不知道你是否很期待呢~


对于未来LD主题的设计走向,能有什么和大家分享的么?
简洁和拟物将持续2014版始终。

最后,还有什么想和大家说的么?
希望看完此文的同学们能了解到LD的设计并不是随性而来,批评的同时也同样给予赞美,你们的支持就是给予我们最大的动力!

下期预告
前两天看过我们微博的朋友,都应该知道我们正在使用超级本拍摄视频,将来我们会用这台碉堡的超级本,给大家带来更多精彩的视频,现在先给大家看下视频拍摄花絮过过瘾!
视频地址:http://v.youku.com/v_show/id_XNjkxMDczNTgw.html

相关链接
•深度专访:深谈的故事

关注我们:官方网站 | 论坛 | 新浪微博 | Twitter | Facebook | Google+

via:http://planet.linuxdeepin.com/2014/03/28/story-of-deepin-icons/
Reply Favorite View the author
All Replies
2 / 2
To page
sweetsmiledp
deepin
2014-03-30 08:51
#21
这个觉得框框风格太死板了,立体、灵动的风格可能会更好看些
Reply View the author
chenghao0610
deepin
2014-03-30 18:31
#22
我是来看妹子的
Reply View the author
能吃善睡
deepin
2014-03-30 21:05
#23
我觉得深度音乐图标的颜色改成粉色也很不错,
比如多米,音乐本来就是浪漫的东西。

嗯,暖色系的随便选一种都行。
Reply View the author
Summving
deepin
2014-03-31 07:49
#24
我认为,这次图标还是比较烂的,为什么要这样说?因为我还是看不出来deepin应用的图标的一致风格,IOS7的图标就有一致性的风格,用户一看就知道这些是IOS7的图标。那个翻译软件的图标比原来的更差,我总觉得就是一个搜索应用的图标,怎么看也看不出是翻译的。说到风格,除了加了一个正方形与圆形的底板,还真的未能看得出风格一致性。我很赞同前面的用户所说的,黑白效果看起来更加好,加颜色就次了。在色调上太炫了,不同的应用选用不同的颜色,本人就感觉到有一丝的视觉疲劳,不能一下子就分辨出该应用是什么,功能是什么,需要仔细的识别圆圈中真正其识别作用的部分图标。文件夹和dtalk有点灰灰的与其他彩色的相比,反而感觉不怎么自然了。当然这只是我个人看法,希望成品出来后不会让我们这些老用户失望哈。
Reply View the author
188******76
deepin
2014-03-31 08:01
#25
我认为,这次图标还是比较烂的,为什么要这样说?因为我还是看不出来deepin应用的图标的一致风格,IOS7的图标就有一致性的风格,用户一看就知道这些是IOS7的图标。那个翻译软件的图标比原来的更差,我总觉得就是一个搜索应用的图标,怎么看也看不出是翻译的。说到风格,除了加了一个正方形与圆形的底板,还真的未能看得出风格一致性。我很赞同前面的用户所说的,黑白效果看起来更加好,加颜色就次了。在色调上太炫了,不同的应用选用不同的颜色,本人就感觉到有一丝的视觉疲劳,不能一下子就分辨出该应用是什么,功能是什么,需要仔细的识别圆圈中真正其识别作用的部分图标。文件夹和dtalk有点灰灰的与其他彩色的相比,反而感觉不怎么自然了。当然这只是我个人看法,希望成品出来后不会让我们这些老用户失望哈。
您难道不觉得这次的图标比2013已然强多了么?人家做了那么多工作,没有一句理解和表扬,一一个烂字作评,窃以为稍稍冷酷了点。
诚恳的建议是多看积极面,多换位思考。
当然有意见还是可以换一种温和的口吻提出来的。
Reply View the author
Summving
deepin
2014-03-31 08:03
#26
[quote]我认为,这次图标还是比较烂的,为什么要这样说?因为我还是看不出来deepin应用的图标的一致风格,IOS7的图标就有一致性的风格,用户一看就知道这些是IOS7的图标。那个翻译软件的图标比原来的更差,我总觉得就是一个搜索应用的图标,怎么看也看不出是翻译的。说到风格,除了加了一个正方形与圆形的底板,还真的未能看得出风格一致性。我很赞同前面的用户所说的,黑白效果看起来更加好,加颜色就次了。在色调上太炫了,不同的应用选用不同的颜色,本人就感觉到有一丝的视觉疲劳,不能一下子就分辨出该应用是什么,功能是什么,需要仔细的识别圆圈中真正其识别作用的部分图标。文件夹和dtalk有点灰灰的与其他彩色的相比,反而感觉不怎么自然了。当然这只是我个人看法,希望成品出来后不会让我们这些老用户失望哈。
您难道不觉得这次的图标比2013已然强多了么?人家做了那么多工作,没有一句理解和表扬,一一个烂字作评,窃以为稍稍冷酷了点。
诚恳的建议是多看积极面,多换位思考。
当然有意见还是可以换一种温和的口吻提出来的。[/quote]
不好意思,我的语气是很不礼貌了。
Reply View the author
BingoLove
deepin
2014-03-31 08:06
#27
[quote][quote]我认为,这次图标还是比较烂的,为什么要这样说?因为我还是看不出来deepin应用的图标的一致风格,IOS7的图标就有一致性的风格,用户一看就知道这些是IOS7的图标。那个翻译软件的图标比原来的更差,我总觉得就是一个搜索应用的图标,怎么看也看不出是翻译的。说到风格,除了加了一个正方形与圆形的底板,还真的未能看得出风格一致性。我很赞同前面的用户所说的,黑白效果看起来更加好,加颜色就次了。在色调上太炫了,不同的应用选用不同的颜色,本人就感觉到有一丝的视觉疲劳,不能一下子就分辨出该应用是什么,功能是什么,需要仔细的识别圆圈中真正其识别作用的部分图标。文件夹和dtalk有点灰灰的与其他彩色的相比,反而感觉不怎么自然了。当然这只是我个人看法,希望成品出来后不会让我们这些老用户失望哈。
您难道不觉得这次的图标比2013已然强多了么?人家做了那么多工作,没有一句理解和表扬,一一个烂字作评,窃以为稍稍冷酷了点。
诚恳的建议是多看积极面,多换位思考。
当然有意见还是可以换一种温和的口吻提出来的。[/quote]
不好意思,我的语气是很不礼貌了。[/quote]

不同的人对于每的理解有很大的差别,窃以为不可能做到人人都满意
Reply View the author
myq1991
deepin
2014-04-04 01:22
#28
图标全部都设计成这种苹果系列图标圆角正方形的风格不大好吧,我记得上次看锤子手机发布会的时候,罗永浩说过如果UI界都一股脑的追风这种类型的图标是一种病态的,很奇怪的现象
Reply View the author
weiqiu
deepin
2014-04-10 05:12
#29
太方了,没必要全搞成方的。看得很呆板。 小屏幕上的底板硬是拿到桌面上来不太适合。
Reply View the author
weiqiu
deepin
2014-04-10 05:14
#30
图标全部都设计成这种苹果系列图标圆角正方形的风格不大好吧,我记得上次看锤子手机发布会的时候,罗永浩说过如果UI界都一股脑的追风这种类型的图标是一种病态的,很奇怪的现象

同感,桌面这么大的屏幕全是圆角正方形真的很呆板。

其实我挺喜欢deepin的理念,就是UI上的坏品味挥之不去。不用和mac比,至少做的比ubuntu漂亮点吧。
Reply View the author
188******76
deepin
2014-04-10 06:37
#31
[quote]图标全部都设计成这种苹果系列图标圆角正方形的风格不大好吧,我记得上次看锤子手机发布会的时候,罗永浩说过如果UI界都一股脑的追风这种类型的图标是一种病态的,很奇怪的现象

同感,桌面这么大的屏幕全是圆角正方形真的很呆板。

其实我挺喜欢deepin的理念,就是UI上的坏品味挥之不去。不用和mac比,至少做的比ubuntu漂亮点吧。[/quote]
其实我也觉得不太好,而且极其不明白为什么要死揪着方框框不放。不过在方框框图标里这套做得还不差,鼓励一下吧。
Reply View the author
山西姚一
deepin
2014-04-10 19:28
#32
因为我励志要将每枚图标都做的尽善尽美。是“立志”吧?
Reply View the author
Bluek404
deepin
2014-04-11 22:02
#33
顶部的壁纸我刚好有
Reply View the author
Bluek404
deepin
2014-04-11 22:05
#34
只能说不是很喜欢高光,感觉有点过时的样子
Reply View the author
charles5272
deepin
2014-04-23 03:30
#35
不要那个图标的底盘不是更好吗,图标后面加了个大大的框框怪难看的!要不就把后面的底盘透明化,这不是更好吗?
Reply View the author
130******98
deepin
2014-05-26 22:06
#36
妹纸你好
Reply View the author
1587285901
deepin
2014-06-11 01:36
#37
Dock是码头的意思,别乱翻译了,码头就是停船的地方,Apple取这个意思其实用意很明显
Reply View the author
2 / 2
To page