默认头像设计(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

相关推荐

  • 2017年度交互设计趋势

    今天分享一下2017年交互设计的趋势,希望能够对你有所启发。

    2017-05-09
  • 从揽胜星脉身上,能看到哪些车内交互设计趋势?| 车展干货

    在日内瓦车展上,有那么几个品牌的展台格外引人关注,捷豹路虎就是其中之一。不少人是冲着前几天刚刚发布的路虎揽胜星脉来的,作为一辆真正全新的车型,同时又是揽胜家族的第四款产品,它受到关注几乎是必然。大家…

    2017-08-02
  • 你的QQ暴露了你的心——QQ大数据及其应用介绍PPT

    PPT概述: QQ大数据规模: QQ月活跃用户数超过 8.4亿 QQ最高同时在线超过 2.0亿 QQ空间月活跃用户数超过 6.5亿 QQ好友关系链对超过 900亿 活跃数据: 一天QQ总发消息超过 100亿 一天发空间说说、个签超过 1亿 数据…

    2016-01-27
  • 不是首发!互联网女皇报告中文完整版发布

    腾讯科技讯 6月1日,有“互联网女皇”之称的玛丽·米克尔今天在美国Code大会上发布了2017年的互联网趋势报告,腾讯科技第一时间推出完整中文版。关注腾讯科技微信号(ID:qqtech),回复“女皇2017”,可获得中英文PDF版…

    2017-06-01
  • 回顾与展望!从9个方面聊聊用户体验设计的发展

    这是一篇国外的用户体验设计回顾总结文,里边提到的9个观点都特别有前瞻性,剥离开细枝末节的视觉风格和交互原则,这些很有可能成为未来优秀设计师必备的硬能力。在甲方的阴沟里待久了,来仰头展望下真正「以人为本」的设计思考。

    2017-05-28
  • UED新刊 | 马岩松:梦露十年

    UED105期《MAD国际实践专辑》现已开始预售更有30本马岩松亲笔签名版,只限预售!具体购买详见文末互动福利PART 1新刊导读尽管频频有人发问,中国建筑为何迟迟未能冲出亚洲、走向世界,然而这是个太过深广的课题,涉及文化、经济、 政治、意识形态等等诸多方面,并不是三言两语甚至是一期杂志就能说清楚的。在这样的大背景下,马岩松和他的MAD 建筑事务所在国际上的实践探索,便分外独树一帜、另人瞩目。2004年,马岩松在纽约创办MAD建筑事务所...

    2018-02-07
  • 专业的网页风格指南应该如何制作?

    文案规范
    视觉指南

    配色方案,包括每种色彩的具体参数,以及其他可接受的色调
    字体和排版方案,包括每个部分的字体类型、尺寸、字重以及具体用法
    LOGO,包括它的样式、变体、尺寸以及位置的说明
    拼写、关键词的选择、文案的风格(包括按钮、社交媒体等)
    图片使用规范,包括色彩、裁剪规则和视觉表现方面的标准
    SEO信息,比如可选的标签和关键词
    栅格标准(主要用作网页排版和印刷)
    空间与留白方面的说明(设计的松紧度等)
    关键点的说明(团队成员可能会提出的问题或者有待澄清的点)

    在内容表述上不要限制太多,这毕竟是风格指南,重点是视觉上的引导,设计是核心;
    将相关、相联的条目整合到一起做快速指引:一个页面介绍色彩,在另外一个页面做排版的规范等等;
    用图片案例来展示界面应有的外观,而不要单纯用枯燥的文字来做介绍;
    提供可用的具体说明。比如配色方案中提供色彩的RGB或者CMYK的具体值,确保色彩的运用能够一致;
    将一部分的设计案例分解说明,确保每个元素的功能和使用规则都足够明晰;

    2017-05-22
  • 反应(Reaction):生活中并不是所有的事情都那么“赞”

    我在Facebook跟我所关心的朋友们分享各种各样的事情——从完成60天瑜伽练习的庆祝状态到悼念失亲之殇。从我的故事中也连接了一群相似的人,有相似的故事要分享。有时候我们只是想借助一个简单的方式去告诉分享者我们真的很喜欢他们的故事,或是当看到他们的生活发生挫折,简单地表达一下同情。

    2017-05-26
  • 史上最完整交互设计基本原则|推荐收藏

    下面的原则对于有效的用户界面的设计和实现都是最基本的,不管是针对传统的图形用户界面还是针对任意的可联网的智能电子设备都是有用的。有效的用户界面是视觉明显的并且宽容的,会带给用户一种控制感。用户能很快…

    2017-08-01
  • 2016天猫双11背后的品牌故事:全民剁手“All in one”

    2016 双11,“All in 1” 主标识,意为“精彩不止一点”。让我们随着阿里小编一起了解2016天猫双11背后的品牌故事。All in 1!将全平台、全品牌、全球融合到一点,迸发出更精彩的世界!

    2017-05-17