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

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


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

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

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

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

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

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

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

(IBM相关网站)

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

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

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

当前默认头像的类别总结

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

1. 普通人物头像

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

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

(Facebook的默认人物头像)

2. 生物头像

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

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

(生物类型的头像)

3. 字母头像

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

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

(Google的名字首字母头像)

4. 形状图像

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

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

(Slack的默认头像)

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

(Github的默认头像)

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

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

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

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

(app的默认头像例子)

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

(默认头像维度对比图)

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

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

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

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

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

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

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

Ps:自己的怪兽头像,其实也是拟人和拟物结合着画了一下。

参考资料

 

本文由 @交互小怪兽 原创发布于人人都是产品经理。未经许可,禁止转载。

题图来自 Pixabay,基于 CC0 协议

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/20262/

(0)
CatherineCatherine
上一篇 2017-08-04 07:23
下一篇 2017-08-04 08:15

相关推荐

  • Android和iOS平台交互方式的不同点

    本篇文章属于很初级的内容,之所以写下来,一是为了整理一下自己的思路,二是为了方便初学者们快速了解 Android和IOS在交互上的很多区别。可能有些地方不是完全正确,望多交流。

    2017-06-03
  • 交互设计的闭环体验

    交互闭环体验的定义交互设计的闭环体验体现在产品的每个功能的细节上,产品可以看作是一整套交互的集合。一般只涉及一种使用场景的交互,只体现为一种功能,且只完成一件事。比如:修改设置、上传文件、设定闹钟、更改密码、打开家用电器、登录、设置状态消息、收藏等。交互设计的闭环体验主要由4方面构成:触发控件:交互闭环的起始点设计规则:交互闭环所遵循的交互方式信息反馈:用户与产品的互动过程关闭(循环)模式:交互闭环过程的结束(循环)模式交互闭环体验的定...

    2018-02-14
  • 产品需求分析——《破茧成蝶》读书笔记

    这是一本很实在的书,没有很虚的理论,而是结合了国内互联网实际的案例,清晰明了地道出现实情况跟理想状态的不同,并且给出了很好的解决建议。适合刚入行的交互设计师以及产品经理阅读。 进入研究生阶段,大大小小…

    2015-03-05
  • 6周锻造1名优秀的产品设计师

    金牌讲师: 杨老师(某大型央企交互设计主管,前网易、腾讯交互设计师) 从业7年多的交互设计老司机; 出身北邮设计艺术学硕士专业,经历网易、腾讯及某大型央企设计部门锤炼; 开课至今,已经培养了近100多名优秀…

    交互专题 2017-08-07
  • 聊一聊常见的登录交互方式

    现在市场上面的APP种类繁多,而登录注册的方式也有很多,下文就简单来分析一下各种登录的交互方式,谈谈自己对这些方式的见解。

    2017-05-26
  • 顾振宇:Ubiquitous Fun-交互设计的享乐主义未来——上海交通大学创新设计论坛-体验和交互设计分论坛

    演讲题目 Ubiquitous Fun-交互设计的享乐主义未来 在可预见的未来,随着用户数据的积累和人工智能的发展,产品“可用性”问题会逐渐淡出我们的讨论主题,同时,人们对物质的需求总是非常有限的,因此“实用性”价值空间…

    2017-01-03
  • 一对一提问!设计师应该如何切入产品设计工作?

    呆呆:经常会收到一些小伙伴提的问题,大部分也都不怎么去回复,除了个别比较值得讨论的我会仔细解答一下。所以就想把那些好问题拿出来,不是对一个人解答,而是与大家一起做一个讨论。

    2017-08-29
  • 从Web到移动应用的设计思维转换

    标签:移动应用、移动互联网、UI、产品设计、Web应用、视觉设计 【编者按】本文作者@刘津legene 随着移动互联网的快速发展,很多Web产品经理、设计师转而投身至移动应用领域。看起来非常相关的工作,却可能给他们带…

    2014-11-26
  • iOS10 交互设计启示

    导读:本文用交互设计的思维对iOS10的新特性进行分析。撇开平时我们考虑的界面排布,页面元素等问题不谈,将视角转移到屏幕外的东西:如时间维度的,空间维度的,手势操作等等,以提升我们的用户体验。本文作者是蘑…

    2017-08-04
  • 交互模型的构建方法

    交互建模用来对应用当中的交互模式进行定义,它同时还诠释了这些交互模式是以怎样的方式被整合成为具有高度一致性的、容易被用户理解的交互模型的。我们曾经在第二章里对iOS交互环境的概念模型和空间模型进行了解析…

    2014-12-01