美文网首页首页投稿(暂停使用,暂停投稿)互联网科技
默认头像设计(1) —— 统一与丰富间的平衡

默认头像设计(1) —— 统一与丰富间的平衡

作者: Linfolio_交互小怪兽 | 来源:发表于2017-06-26 22:46 被阅读333次

头像设计,“统一”与“丰富”间的平衡。

头像又叫Avatar,有虚拟化身的意思,最早出现在1979年的一个电脑游戏里,用来代表玩家的身份。前几年流行的阿凡达的英文也是Avatar,也是有虚拟世界化身的含义。现在除了游戏,头像也是媒体或者虚拟平台上重要的一部分了。Avatar不是真实的头像,它更像是一个占位符,在人们上传头像之前暂时代替着。

头像设计,我理解,是一个在固定模式中寻求随机变化的过程。而延展开来,这种“随机中寻求变化”的方式,也是我有时会在设计中遇到的问题。

设计一个卡片式的页面的低保真,设定好每个卡片都有一个自己的banner。然而事实却是?以千为计量单位的卡片,不可能有一一对应的banner。

例如像是IBM的这种页面,因为卡片的条目很多,达到以“千”为单位的级别,而每一个卡片又不能保证一定有对应的图片,所以,这个时候就会需要用到默认的图片。

IBM相关网站

而默认的图片如果只有一种,就会显得太单调,图片一多呢,又会太杂乱。

所以在“统一”与“丰富”之中找到平衡,是我个人认为的一个难点,而默认头像设计,就带有这种丰富与平衡的属性,因此我也希望通过一些资料的查找来深入了解一下这个领域。

因此我问自己一个问题,什么样的默认头像才算是处于“平衡”的头像呢?

当前默认头像的类别总结

一位产品设计师Michelle在她的文章里提到了当前默认头像的几种类别,我总结有这么几种:

1. 普通人物头像。这是最常见的类别。例如说常用的社交网站Fackbook,就是使用的普通人物头像。而他们之前也在考虑普通人物头像的男女平等问题。这一类的头像很简单易懂,也普遍使用得很多,所以也为大众认可。

Facebook的默认人物头像

2. 生物头像。注意到简书使用的就是生物类型的头像。我刚刚注册的时候出现的是一个小鹿的头像,似乎是有一系列的动物头像可以默认随机出现。不仅仅是地球上的生物,还有一些外星来的生物也被人类使用。

生物类型的头像

3. 字母头像。google登录之后,使用与名字相关的字母作为头像。通过颜色与字母,达到变化的效果。

Google的名字首字母头像

4. 形状图像。通过形状进行抽象随机的变化。例如说Slack,使用了格子条纹,通过颜色与位置的调整达到变化。而github则是用过一些格子与颜色的排列,形成像素样式的头像。

Slack的默认头像 Github的默认头像

分析点1:当前各种类型头像的使用情况

而从这些头像的特征出发,可以发现他们有的“拟人”,有的"拟物",有的“具象”,有的“抽象”,例如说普通人像头像,就偏向于“拟人”与“具象”的维度,而形状图像则处于“拟人”与“拟物”之间,接近“抽象”的元素。

我重新历览了一下手机内的app头像,也对这些头像归了一下类,我发现对于抽象化形式的头像,目前还是使用得比较少,坐标轴右边的图标还是占大部分。而这一类型的头像,不得不说,对于我个人来看是比较特别的,随机变化中又突显了自己品牌的特征。

app的默认头像例子 默认头像维度对比图

分析点2:关于丰富与统一的含义挖掘

“丰富”再往深挖掘,它有着某些特性,我这边列举出来的,有图标的多样性,日后的可延展性,而“统一”,包括视觉上的统一,还有与整个品牌的统一。我想随着维度的变化,我之后会不断调整细化这个图,但大方向保持一致。

关于不同类型头像的特征对比

人物头像虽然认可度比较高,视觉上也统一,但是多样性和延展性就比较弱,也比较难体现某个品牌的特征。生物头像看着很活泼,视觉上是一整个系列,也可以延展出不同的生物类型,但对于品牌的体现,就不一定是都适用,毕竟不是所有的品牌都以动物为主题。相比之下,抽象一点的图标在“延展”与“品牌”方向就比较占优势,像github的图标,如果有5*5的格子,格子随机填满或者不填满,就会出现不同的图案(5*5的平方),加上颜色的变换,就可能会有上百种变换方式,而这种二进制式的感觉,也跟github的主题贴近,因为它相当于是一个代码存储的网站。slack的头像也使用颜色和格子很个性地展现了自己。

结合两个分析点,我开始感觉,要在“统一”与“丰富”之间寻求平衡,也许抽象,变换的元素会是一个新的角度呢?至于实际用到设计上的时候,怎么做,怎么实践呢?其实我也还没想好,最近在看一些随机生成图案的网站,希望有些启发。

那就暂且为标题加个“(1)”吧,继续找找答案。

Ps:顺便结合拟人和拟物给自己换了个怪兽头像。

参考资料

http://www.hongkiat.com/blog/free-pattern-generators/

https://scratch.mit.edu/projects/2693313/

https://uxdesign.cc/design-avatars-that-make-sense-and-be-more-inclusive-in-the-process-d4dd6a486ea6

https://slackmojis.com

相关文章

  • 默认头像设计(1) —— 统一与丰富间的平衡

    头像设计,“统一”与“丰富”间的平衡。 头像又叫Avatar,有虚拟化身的意思,最早出现在1979年的一个电脑游戏...

  • 作业设计要注意的

    作业设计的目标要做到三个统一:内容设计与形式设计相统一,作业设计的目标与教学目标,学习目标相统一,作业设计的目标与...

  • Django显示时间的一些问题

    1. 时区问题 首先是时区的问题,Django 默认使用的是 UTC 世界协调时,又叫世界统一时间。中国的时间与 ...

  • Unity3d Shader实现圆形头像

    Unity3d Shader实现圆形头像 设计需要头像显示圆形,但是默认图片类型都是矩形。因为没有美术兄弟帮助所以...

  • 二组14号5月8日作业

    平衡,天地万物的真理。自我平衡,就能心身和谐统一,自己与他人平衡,接受与给予的平衡,就能家庭和谐,社会和谐。夫妻之...

  • 利用原生态NSURLConnection上传用户头像

    看一下界面: 服务器默认是的头像:服务器默认头像.png 1、首先:我们利用导入 #import "AFNetwo...

  • 垃圾互联网产品界面设计案例

    超星学习通聊天窗口超星学习通用户未设置头像的情况下,系统会默认为用户选择统一头像,其它个体性页面还好,当遇到多用户...

  • Flutter -- MaterialApp

    MaterialApp 代表 Material 设计风格的应用。常用于定义APP 的统一默认风格,用作程序的入口 ...

  • 大自然的本质

    源于自然,回归本质 设计保留了琥珀本身自然原生形态 用丰富而充满激情的艺术想象 在华丽与朴素中找到平衡 演绎本色之...

  • 设计与平衡

    去掉的个人主意, 终将回来。 理性与感性从来不是对立面, 是螺旋在一起的DNA。 ...

网友评论

    本文标题:默认头像设计(1) —— 统一与丰富间的平衡

    本文链接:https://www.haomeiwen.com/subject/ivgeqxtx.html