恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
归纳总结(三)
0.0°
2016-04-14 原创文章 规范/资料 举报 888 8 4 0

好像这段时间忙过后,我就有大量的时间对以前所学的东西做一些具体的细节化的规划了,将各种不同的模块进行更深一步的区分,以便今后的查阅。相信做过手持端或者是pc端的设计师对空状态这三个词都不陌生吧,今天就来总结一下空状态设计(Empty States)。

空状态,或零数据状态,比如网站购物车为空时、页码没有下一页、某页面出错或不存在等等这些都可以称为“空状态”,但这个很多时候被设计师忽略,我们基本都是在主要流程界面的设计工作完成之后才会回过头来考虑完善一下,因为从表现上来看,空状态给人的感觉就是临时性的,有些微不足道。不要被空状态的名字所迷惑,实际上,这个状态在引导性、愉悦性和保留用户等方面的潜质对于产品体验在细节当中的成败有着不可忽视的作用。空状态通常会在初次使用、完成或清空内容、软件出错等情境下出现。从产品体验的角度来,空状态大体可以由以下三类情况触发:

                 产品初体验

                 成功完成目标任务

                 出错、失败

你的app在这三类情况下的表现可以将用户与产品的关系推向两个方向:

                用户参与度和忠诚度得以提升并保持稳定

                用户暂时或永久性的放弃这款产品

人人都喜欢第一个方向,但多数产品却是在走着第二条路,这其中的决定性要素之一,就是你在空状态这个貌似不起眼的地方花费心思的多少。

1、空状态的设计

谈到这里不妨先将注意力集中在产品初次体验流程当中的空状态上,因为这个环节相对特殊,某种程度上属于用户引导机制的一部分。在这个场景下,空状态界面应该实现以下几点目标:

1.用户教育与产品说明

Image title

初体验流程中,空状态的首要目标就是教育引导用户,帮助他们快速了解首要功能和操作方式,避免一上手就产生迷茫无助的负面情绪。通过初次体验流程当中的空状态界面告知用户会发生什么,帮助他们建立预期。好的空状态设计可以体现出以下几个方面的信息:

                  是什么:对界面中的功能或信息进行描述。

                  在哪里:告诉用户他现在位于体验流程的起点或其他特定的位置。

                  何时:暗示用户内容的循环机制,让他们知道怎样的行为会产生内容。

Image title

通常可以通过两种方式传达这些信息,要么是言简意赅的文案,要么是通过示例内容告知用户这里产生了数据之后会是怎样的形式,为其建立更直观的预期。不管哪种方式,都要提供必要的引导信息,让用户知道要达成这样的内容状态需要以怎样的操作为始。

2.差异化与正面情绪

Image title

教育引导只是推动产品与用户进行沟通的方式之一,用户做出要不要花费时间去探索一下产品的决定只是一瞬间的事,初次体验流程当中的任何一点细节都会影响到用户那缺乏耐心而且并非那么理性的决策。良好的第一印象是由多方面因素构成的,可用性只是其中的一部分。在产品的个性化、情感化等方面,尝试考虑:

                能否在空状态下呈现一些形式新颖、超出预期但仍与产品概念相关的内容?

                能否通过恰当的形式博用户一笑?

                能否通过恰当的形式传达出品牌定位、格调、特质?

Image title


app时代,遍地是免费的产品或是低价的优质产品,用户往往会在若干同类产品中快速探索和比较。怎样确保自己的app能脱颖而出呢?虽然听上去是小事一桩,但如果真能做到在初体验空状态下展示一些不同的东西,那么其实是在告诉用户,你的app带来的整个产品体验是与众不同的。

不妨花些时间看看竞品或其他同类产品在这方面是怎么做的,试着在这些方面做的比他们更出色些:

                     品牌:通过恰当的方式强化品牌元素的呈现。

                     差异:通过有意义的方式展示设计创意,体现专业和幽默色彩,创造正面情绪环境。

                     人性:展现你家产品或业务的人性化、个性化。

Image title


在愉悦性这个方面,你的目标就是以恰当的方式引发用户的正面情绪,使用户在最短的时间内感受到产品的差异化。

3.操作引导

Image title

我们已经了解了第一印象的重要性,特别是在用户那短暂且非理性的评估时间当中。但能否达到真正的成功,还是要看你能不能通过空状态引发用户填充空白的欲望,引导他们进入实际的操作流程。

Image title

可以将空状态界面设想成某种landing page,在保持最小化设计原则的同时,构造场景氛围,通过必要的文字说明功能特色,然后使用一目了然的视觉元素引导用户进入使用流程。

Image title

具有强引导性的空状态界面可以包含以下三方面的组成要素:

              激发:使用具有激发性的语言或图形元素,例如“让我们开始吧!”等等。所谓的激发性要符合产品的目标用户特质,而不是随意喊出一套怂恿之词。

              说服:言简意赅的阐述价值主张,让用户知道与产品进行互动之后将得到怎样的收益。

              引导:一目了然的提供功能入口,使用显而易见的CTA(Call To Action)元素,或是通过某种视觉元素将用户的注意力引导到CTA元素。如果没有特别的需                 求,那么只在这里提供一个最核心的功能入口,不要让用户花费时间去思考和选择。CTA元素要具有良好的交互性,包括外观和点击区域等等都要考虑到。

我们日常的多数设计工作都集中在那些充满了各种数据内容与功能,需要仔细权衡布局的界面上,这也是界面设计最具挑战性、最令人兴奋的地方。但是想想看,对于很多类型的产品来说,在界面与用户之间实际上还隔着一层空状态 – 能否让这个状态更好的起到承接作用,让用户真正进入体验流程?这件事是值得我们投入更多时间精力去关注的。

更新:2016-04-14

收藏

8人已收藏

Drimary_梦

设计源于细节,而我愿倾尽所有只为这一细节

  • 135

    作品

  • 102

    粉丝

  • 5

    关注

  • Figma零基础学习
  • 基础交互知识6种常见的隐藏菜单
  • 10个极简主义UI设计案例
  • PS中小技巧

    猜你喜欢

      2016-04-14 原创文章 规范/资料 举报 888 8 4 0

      归纳总结(三)

      0.0°

      你确定要举报归纳总结(三)

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2016年04月14日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      4
      8
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录