header_v1.7.40

谈「用户头像」

2年前发布

原创文章 / 多领域 / 观点
YujunZhu 原创,如需商业用途或转载请与YujunZhu联系,谢谢配合。

分享一些关于用户头像相关的见解与观点

今天在我们的各类APP中,用户头像已是习以为常,几乎在绝大部分互联网产品中都可以找到用户头像的身影。

用户使用照片作为头像信息可以快速准确的识别用户信息,且有效的加强记忆。在界面中巧妙合理的使用头像元素亦能达到提升界面阅读体验。


下文分享一些关于用户头像相关的见解与观点:


#1. 重新设计头像的外形

在头像的外形中,圆形最为普遍和常见,用户最容易理解。圆形头像十分巧妙的避开了与照片/图片的区别,并且在各种矩形设备、矩形界面中起到了强调作用。如下图:


0b05577f85a40000018c1bec2575.jpg

上图注:孤立中心点位置,强调“个人”、“这是我”的概念。保持界面清晰。


但是在复杂的界面元素/使用场景中,圆形未必能完全适用。设计不恰当还会带来负面影响。如下图:


d35a577f85dc0000018c1b7aca56.jpg

上图注:圆形头像具有很强焦点作用,出现在内容信息复杂的界面中,显得冗余。造成较强的视觉干扰,影响阅读体验。



#2. 引导用户维护头像照片

我猜测各位的iPhone应该和下图差不多。


401d577f862d0000012e7e9e5adb.jpg



国产ROM用了一种取巧的方式,见图。实际使用的体验还不错,iOS 10也用了这种方式。


a5a9577f863a0000012e7e4abfc1.jpg


这种方式并未解决根本问题,一般常见如下解决方法:

a. 交互引导设置用户头像

b. 通过绑定社交账户或使用社交账户登录

c. 对于强调真实社交/看脸社交产品可辅助使用云端人脸识别引导用户调整头像

d. 通过奖励任务引导用户维护头像

e. 设计一个让人看了会有“冲动”去更改的默认头像



#3. 确保头像的出现是最佳的方式、位置和大小

表示用户信息的方式有很多种,头像的出现会带来视觉重点的牵引和记忆强化。界面交互、视觉层次处理的不合理反而会带来理解困难及内容信息主次不分等问题。


644e577f864c0000018c1baa93f3.jpg

上图注:这是Uber看似很正常的一个候车页面。很棒的解决了叫的车在哪,什么到达我身边,是哪位司机师傅来接我的问题。但是在很多次使用中,司机师傅长什么样对我来说是相对较弱的信息,反而“车辆颜色”、“车牌号”是关键点信息,可减少与司机师傅电话中反复询问确认。



用户头像只是展现用户信息的其中一种方式,在设计过程中需要顾及到使用场景、信息主次、使用目的。



Yujun@AEC

本文同样发表在知乎:https://zhuanlan.zhihu.com/p/21535039


856b577f86ad0000012e7e107cb9.jpg


43
    没有新消息

    提示文案

    提示文案

    提示失败
    提示成功