APP功能开发之会员头像设立

发布时间:2020-04-29 18:39 | 浏览人次:浏览次数
本文列出探讨了App头像设立的有关设计思路和案例,对社交产品的头像设计很有裨益。在设计时,寻求有关设计借鉴是获得灵感和解决办法的高效形式,认真发现生活中的好设计,实时积攒并归纳,才能在重点时刻有高质量的输出。

头像设立步骤

头像设立步骤普遍包括头像选择、上载、剪裁、预览4个流程,在会员界面呈现时,部分流程可合并或跳过,但起码要包括剪裁和预览。

1. 选择图片源

头像图片的来源包括本地图片、系统推荐头像、会员个人线上相册、即时拍摄等。同一产品在不一样端能够支持不一样的上载途径,例如 PC 端摄像头拍摄质量不佳,而且台式机不肯定配备,普遍能够不做支持。

2. 上载条件限制

上载本地图片作为头像时,图片的格式、尺寸、文件大小规则应尽可能放开限制,起码要支持 JPG、GIF、PNG、JPEG、BMP 等格式。伴随手机拍摄照片的尺寸和大小越来越大,所以 5~6M 是1个比较适合的上限。关于服务器图片储存,应留存一张高清大图和多套不一样尺寸的缩略图。

3. 剪裁处理

图片剪裁包括系统自动剪裁和会员手动剪裁。假如不支持手动剪裁,最佳把系统自动剪裁和截取做了。京东商店 web 端就没有截取图片中央区域,而是直接挤压或拉伸图片,引致图片变形成效很烂。手动剪裁时,普遍要辅助缩放、旋转、镜像等功能。缩放时需留意极限值,否则会引致背景空白(如QQ空间),要做相应的填充处理。剪裁框最佳参与辅助线(如九宫格、方圆)和遮罩,便利及时预览方形和圆形头像的成效。偶尔也会参与滤镜、贴纸等功能。

 

APP功能开发之会员头像设立

 

4. 成效预览

「所见即所得」是打造优良用户体验的秘诀之一,所以提供及时反馈和预览是不可缺少的。例如剪裁拥有的各种形状和尺寸的预览,滤镜成效及时渲染等。当然,及时性也和系统性能相关。

头像的常见展示形状包括方和圆,偶尔也有异形头像。关于头像形状的「方圆」论证能够借鉴微信和 QQ 设计师的官方回复。

同样作为腾讯的产品,为什么 QQ 的头像是圆的?而微信的头像是方的呢?

腾讯的回应如下:

相比方形,人的头像更贴近圆形。圆形 QQ 头像能更突出头像淡化背景,也更鼓励会员采取真实自拍作为 QQ 头像。

QQ 作为平台会接入游戏和第三方软件内容,圆形 QQ 头像在这些方形、异形图标环境中提高识别度,减少会员的认知门槛。

QQ 期望给会员传递乐在交流,呈现年轻个性的态度,圆形 QQ 头像更具灵动和活力,与之无缝衔接的头像挂件也为会员带来更个性化的匹配和丰富的自我展示。

因为照片本来是方的,方头像更符合会员习惯。

还有百度小程序关于头像的规范可供借鉴:头像应保障清楚,头像的主体元素在方形或圆形借鉴线内,不遮挡重点信息,确保前端呈现时能在圆形轮廓中呈现彻底。

APP功能开发之会员头像设立

 

设立头像的12种方法

1. 默认头像

为减短注册步骤,降低潜在会员流失,会员注册历程中普遍不会强制会员设立头像。所以,为防止会员不去设立头像以及页面中头像加载不出来,系统会提供默认头像便于在有关位置展示。能够选用灰色头像,也可以够选用基于公司吉祥物卡通形象设计的彩色头像(比如虾米、转转)。两者各有好处,灰色头像能够时常提示会员去设立头像,彩色头像则能够丰富画面、增多趣味性。然而唯一的遗憾是一旦设立了新头像,改不回默认头像了,毕竟有的默认头像还是挺好看的。有的社区允许游客会员进行点赞、评论等操作,此时便会用到游客默认头像。当然,同一系统内,默认头像也可以够不唯一,例如,依据会员性别、星座搭配头像,依据会员身份角色搭配头像(司机/乘客,招聘者/应聘者),或许制作头像库为会员随机分配头像。

2. 系统推荐头像

让会员自己拍摄或找到一张自己满意的图片做头像,对有些会员而言其实是一件成本比较高的事情。假如会员群体充足大,图片质量难以保障,甚至内容监督又会带来新的问题,所以推荐一些高品质头像供会员筛选,就成了1个很棒的辅助解决办法。QQ 很早就推出了相似功能,甚至成了顾客服务的一部分。平安金管家 APP 也有相似功能,提供了4个商务风格的卡通头像供会员选择。

APP功能开发之会员头像设立

最近比较火的匿名社交APP Soul 也同样支持采取系统推荐头像,而且是只能采取系统头像,如下图所示,会员能够依据自己所设立的性别,头像风格选择心仪的头像。Soul 不允许会员上载其他照片作为头像,也是期望会员能撇开颜值,找到真正的灵魂伴侣。这些头像自身也体现了会员个体的审美情趣、价值观等。最近 Soul 新发布了「超萌捏脸功能」,下文会着重完整探讨,然而捏脸而成的头像仍然能够算是系统推荐头像,只是把头像拆分为了头发、脸、眉毛、眼睛、鼻子、嘴巴、衣服配饰等元素,然后再由会员自己排列组合。

APP功能开发之会员头像设立

3. 随机选择头像

上文也提及了随机头像,即系统会在会员注册成功后为其随机搭配头像,以免单一默认头像的沉闷,记忆中以前 GitHub 就是选用这种做法。另一种随机头像是指会员积极选择随机头像,获取相应的惊喜,例如哔哩哔哩就选用了这种做法。然而实在难以推敲出这类型似「变脸」的玩法背后的设计逻辑。

APP功能开发之会员头像设立

4. 采取历史头像

在会员采取过一段产品以后,也许会积攒大批的历史头像(重要是会员自主上载的,采取过的系统头像不记录在内)。QQ 就把会员的这些头像搜集起来展示给会员,便于会员查看或从新选择,尽管会员从新采取的概率并不大,但不失为一种促进会员感情、提高会员粘性的做法,毕竟这里面满满全是青春的回忆,极容易给会员带来触动。

APP功能开发之会员头像设立

微信也有相似的做法,然而只能查看上一张头像。微信的设计哲学是不去有意取悦会员,所以这里更多的是防止会员反悔,便利会员在最近采取的两张头像中间变换比照。马蜂窝的做法与 QQ 相似,然而增多了卸载历史头像的功能(当前头像不可卸载)。聊天宝(原子弹短信息)有许多锤子的设计基因,锤子的设计师们追捧工匠精神,爱为会员创造小惊喜,所以聊天宝不能查看自己的历史头像,但却能查看好友的历史头像。不妨推测下背后的设计动机:现代人分分钟互相加个好友,但也许赶不及备注,而大家对图像的记忆更准确、持久,所以看见头像也许就会很快地回忆起好友姓名、相识的场景等信息。

APP功能开发之会员头像设立

5. 文本头像

文本头像在商务类软件中比较常见,比如 OA。由于办公社交的社交属性并非极强,更多在于实时通讯,所以图片头像并非尤其主要,并且文本头像中的字号更大,更容易识别。要留意文本颜色和背景颜色的比照度,此外同1个软件中,文本和背景能够多做几个配色方案随机展示,以丰富视觉成效。另外还要留意文本的取值显示规则,下图是钉钉的部分页面截屏,能够从中推测:

汉字类:单个或2个汉字展示全部汉字,3个及以上汉字仅展示后2个汉字;

英语类:1个单词时取前2个字母,2个及以上单词取前2个单词的首字母;

数字类:单个或2个数字展示全部数字,3个及以上数字仅展示后2个数字。

APP功能开发之会员头像设立

6. 角色头像/匿名头像

相信许多人都玩过 QQ 的匿名聊天功能,然后就被管理员禁止了,它更像是一种娱乐性玩法。其实还有相似的做法,在游戏中较为常见,在角色明确前显示的是会员头像,角色明确后就显示角色头像。例如斗地主,地主身份明确前显示会员自身头像,明确后则显示角色头像,而且还会依据角色性别显示相应头像。

APP功能开发之会员头像设立

7. 动态视频头像

动态视频头像能够让会员逾越时间层面从多角度展示自己。仍然以 QQ 为例,动态头像分两种,一种是 QQ 顾客才可采取的动态头像,由系统推荐,会员自主选择;另一种是让会员自己拍摄录制。具体步骤如下图,会员先录制视频,然后选择一帧作为静态头像,便于能在不支持展示动态头像的地方展示。这也是现在的一大趋向,然而假如好友列表的头像都在动也还挺吓人的。

APP功能开发之会员头像设立

8. 轮播头像

针对陌生人社交场景,如探探,头像更显得主要,左滑还是右滑就在瞬间中间,点进去首页也根本不会下滑屏幕细看具体的兴趣、材料,所以就要尽可能在首屏展示更多更大更清楚的照片,轮播图就是一种非常好的方式。探探最多可设立 6 张图片或 6 段视频作为轮播头像。其实,轮播头像相似 QQ 照片墙的概念,然而自我展示意味更浓。

APP功能开发之会员头像设立

选用相似轮播头像做法的还有音遇 APP,虽说主张以歌会友,但谁都喜爱唱歌好听的小哥哥小姐姐还有高颜值。如下图,个人首页背景图即头像轮播。还有一些社交应用能够将个人系列头像设为私密,然后定向开放展示给需求的人。

APP功能开发之会员头像设立

9. 捏脸头像

ZEPETO(中文名:崽崽)的火热刮起了一阵虚拟形象社交的热潮,尽管是三维形象的玩法,但和之前风靡一时的脸萌并没有实质的区别,要想实现从工具到社交的转变,获得关系链才是王道。多闪和 Soul 动作也很快,已经发布了捏脸功能,尽管现在是二维的,但相信巨头们早已开始布局三维虚拟形象社交了。现在 ZEPETO 可编辑脸型,甚至能够进行简单的化妆。服装配饰则包括衣服、头饰、首饰等,且支持按上架时间、价格等排序。室内装饰则包含了地板、家具、摆件、乐器等等。手势重要是一些肢体动作库,动作成效十分连贯。能够说 ZEPETO 集成了会员对场景搭建+服饰匹配+颜值定义+酷炫动作的完美幻想,时候也扩容了大家对虚拟形象社交乃至电商新形态的想象空间。

APP功能开发之会员头像设立

现在市面上,特别是游戏领域,不管画风是 Q萌,还是 3D,时尚亦或仙侠,人物建模及捏脸系统已经比较改进,且拥有广泛软件。这里推荐一款叫做 IMVU 的 APP,它的人物画风、服饰质感比 ZEPETO 更为写实,更偏成人化,视角转换也更为流畅,支持俯视/仰视。然而,脸萌早已凉凉,美图的图片社交之路好像彻底和 ins 对不上标,所以 3D 虚拟形象社交的将来之路也未可知。

APP功能开发之会员头像设立

10. 头像挂件

头像挂件、等级徽章、认证标志也属于头像的一部分,然而需求结合付费顾客、会员成长体系、认证规则进行讨论才刻意义。

11. 采取第三方头像

采取第三方社交账号迅速登录已经变成登录注册页面的标配,毕竟1个授权就解决了账号注册、头像及昵称设立等问题。近两天,吃瓜群众们再一次见证了「头腾大战」。多闪采取了会员的微信头像和昵称,但是并没有拥有相应授权,因为之前的授权是给抖音的,当然目前也静止授权了。不管是不是抖音碰瓷,但微信/QQ 账户上的头像、昵称的权益归属的确是个问题。个人上载的头像还好说,假如用的是系统推荐头像,这些图片的版权是不是归属腾讯呢?会员采取第三方登录后,最佳还是指导会员尽快绑定手机并设立改进其他材料。

APP功能开发之会员头像设立

12. 群组头像

这里以 QQ、微信和钉钉为例进行探讨。微信群聊头像由群成员头像组合生成,在方框内置套群成员的方形头像,依据群成员的数目多少(1-9)进行相应排布,多于 9 人时显示前 9 人头像。此外,微信暂不支持设立图片为群头像。钉钉群与微信相似,然而外观上是圆形外框嵌套群成员的方形头像,显示数目也有所限制(最多显示前四个),但能够选择其他图片作为群组头像。QQ 群比较复杂些,可分成讨论组和群,尽管目前通称「群聊」,依据建立方法划分如下:选人建立(对应的是讨论组)和按分类建立(对应的是群)。讨论组也是不能设立头像的,是在圆形内置套群成员的圆形头像,最多可显示前 5 个成员的头像。而群头像由管理员设立,且能够查看历史头像、采取系统推荐头像等。此外还有 TIM,定位是抗衡钉钉的办公应用,比 QQ 更轻量化,视觉风格也大不同, TIM 中讨论组头像的展示就选用了相似钉钉的做法──圆形外边框+方形头像。

APP功能开发之会员头像设立

 

在这个看脸的时代,不论是真实社交,还是网络社交,甚至虚拟形象社交,全是「颜值即正义」。在进行网络社交时(兴趣社交除外),可以说「无头像,不社交」,毕竟跟陌生人搭讪的挑选成本太高,看头像照片是最直接迅速的方法。北京App开发企业思捷科技列出探讨了App头像设立的有关设计思路和案例,对社交产品的头像设计很有裨益。

上述内容就是小编今天为您带来的关于《APP功能开发之会员头像设立》的全部内容,希望能对您有所帮助,我们是一家成立于北京的IT外包公司,如果您有app软件或者微信小程序需要定制开发,不妨联系我们。
免责声明:本站部分文章转载自网络,不代表本站的观点和立场,不以盈利为目的。如有侵犯公司或个人权益,本站会第一时间删除文章。我们是一家北京app开发公司,欢迎咨询免费获取思维导图!

本文地址:https://appbj.cn/article/4626/

网友热评

暂无更多评论
思捷智联

思捷智联是一家2009年成立于北京的IT外包公司,我们致力于为企业提供app软件开发和微信小程序开发服务。公司成立10年来,我们为民政部、方正电子、神州数码、联想控股、壹基金、首钢集团、北京大学、北京师范大学、今麦郎、丰汇租赁、万通控股等上百家企业提供了IT外包服务。我们努力实现每一位客户的托付,为客户创造实在的效益,让您与梦想走得更近。

微信咨询

扫描微信二维码
同市场经理沟通需求

我们积累了丰富的移动互联网开发和运营经验,在开发中为客户提供更多帮助!
咨询热线:18612209195