相关分类
photoshop教程
Illustrator教程
CorelDraw教程
painter教程
Indesign教程
UI设计教程
sketch教程
设计理论
飞特网 顶部通栏广告

环形元素在UI设计中的运用

令彬发布于:2016-1-25 09:36 |原作者: Sim_H|
令彬
天津市 东丽区 建筑/环艺设计师
发私信 + 关注
简介: 环形元素在界面设计中被广泛运用,从常见的环形图标到环形的头像,又或是环形的轮廓形状。环形是一种特殊的形状,它能够在众多几何形状中被我们快速地注意到。也正因为如此,在使用环形元素设计界面时会有一些注意事 ...

版权申明:本文原创作者Sim_H,感谢Sim_H的原创经验分享!

环形元素在界面设计中被广泛运用,从常见的环形图标到环形的头像,又或是环形的轮廓形状。环形是一种特殊的形状,它能够在众多几何形状中被我们快速地注意到。也正因为如此,在使用环形元素设计界面时会有一些注意事项。

一、环形头像


放眼望去,环形头像已然占领了我们的手机。不妨看看下面举的这些例子,如下图所示。

从左到右依次是搜狗地图、QQ、Instagram。当然,还有很多其它的例子,就不一一列举啦。此刻,肯定有同学已经按耐不住要跳出来反驳了,微信和Facebook就不是环形头像,不信你看下面两张图。

方与圆之间,孰对孰错,请继续看下文分解。

FEVTE编注:更多平面设计理论学习请访问飞特网平面设计理论知识栏目,地址:https://www.fevte.com/plan/shejililun/

1.用户使用头像的目的

不管是环形头像,还是方形头像,其归根结底都是头像。用户使用头像的目的,主要是作为个人身份的象征。区别于其他用户的特征有很多,例如用户名、用户ID、用户头像。在这些备选项中,头像最便于快速识别和记忆,尤其是帅哥美女。

除此之外,还有一部分通过头像来彰显自己的个性,例如美女通常会使用自己的性感自拍作为头像来表现自己的魅力,又或是使用卡通人物或形象作为头像来表现自己的艺术气息,再或是使用萌宠作为头像来表现自己的爱心或是呆萌。

2.用户使用什么照片作为头像

随着智能手机的越来越普及,人们拍摄照片的门槛也变得越来越低,越来越多的用户使用自拍的照片作为头像。照片的内容五花八门,例如人物、风景、花草、宠物。即使是正常的人物照片,背景中也会掺杂着很多其它的元素,例如下图所示。


第一张照片中人物背景虽然虚化了,但背景仍然很凌乱,一些微弱的对比色很容易就抢夺了用户的视线。第二张照片中人物是配角,豪车才是真正的主角,这类型的自拍照不再少数。第三张照片人物拍摄的光线阴影错乱,故意露出一线背景内容,其用意如何昭然若揭。此外,用户手机的好坏、拍照水平也不一致,拍摄出的照片质量也参差不齐。

使用这些照片作为头像时,人物不但不被突出,反而被弱化了。虽然智能手机屏幕越来越大,但是当头像集体在界面中展示的的时候,每个头像依然较小。

3.方形头像和环形头像的区别

方形头像和环形头像的区别可以用两张对比图来说明,如下图所示。


左图是方形头像,右图是环形头像。通过对比,可以发现以下几点:

a、环形头像能够更好地帮助用户聚焦到人脸。虽然左图能够完整地呈现人物特征,但是干扰信息较多,例如背景中的灯光、门柱、屏风。对比之下,右图更为清晰地展示了人物的脸部特征,例如锥子脸、美瞳、假睫毛。在前面的分析中也提到,手机拍摄的照片质量参差不齐。在这种现实情况下,环形头像更有利于忽略照片的背景,提高头像的识别效率。

b、严格意义上讲左图并不能称之为头像,而更应该称之为照片。原因很简单,头像嘛,自然应该以展示"头"为主,而左图中头像只占画面四分之一不到的区域。从这个角度来说,显然右图更为合适。在选择照片作为头像时,如果是环形,用户更愿意选择脸部的照片作为头像;如果是方形,用户则相对更随意,通常是全身或是半身照。不信,你可以打开自己的微信,看看自己的好友头像,或者往前滑滑看看前面的配图。

c、日常生活中,我们看到的大多数相框都是方形的,环形的相框较少,这是因为大多数照片都是方形的。因此,使用环形的轮廓来表现头像,能够快速地和照片区分开来,更加突出。

当然,使用环形的轮廓作为头像,还有一些其它的原因,例如技术上的进步。

早期由于CSS等技术的不成熟,环形、圆角图形的处理非常麻烦,现在变得容易很多。

12下一页
23

好评
17

差评

刚表态过的朋友 (40 人)

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

令彬
天津市 东丽区 建筑/环艺设计师
+关注 发私信

最新评论

您需要登录后才可以评论和提交作业 登录 | 立即注册
本周热点文章
2020 新飞特 从心开始
关于飞特| 广告服务| 付款方式| 版权申明| 网站地图| 联系我们| 加入我们| 举报| 帮助中心| 移动版| 手机版| 飞特网

委托设计