美文网首页新学霸社群
第37周+《交互设计 - 聊聊步骤条》+林灿业+新学霸社群

第37周+《交互设计 - 聊聊步骤条》+林灿业+新学霸社群

作者: 林灿业 | 来源:发表于2019-09-22 17:58 被阅读0次

    1、步骤条简介

            引导用户按照流程完成任务的导航条,可表示任务进度或步骤。

    2、使用场景 

    两种使用场景:表示任务进度或者步骤,并起到导航的作用。

    2.1、进度条:表示某事务的进度,侧重于表现当前进度,如订单进度;

    2.2、步骤条:将某个任务分解成由若干步骤组成的流程,表示该任务所处的步骤,侧重于表明操作步骤,通常带有“上一步”、“下一步”操作按钮,如资质认证等复杂任务;

    3、理解与思考

            步骤条可表现当前任务的整体步骤,以及进度情况的组件,常用于比较复杂繁琐的任务,把任务分步进行,简化任务,也降低用户的畏难心理,反映任务进度,给足用户更多的心理预期。

            一个清晰完整的步骤条,应该可以使用不同的视觉元素,使得更清晰地表示过去、现在、将来,过去是指已经完成的动作,通常使用“对勾”表示;现在是指当前进行中的动作,通常高亮即可;未来是指即将要执行的动作,通常置灰即可,一个清晰完整的步骤条,如第2小节的图示。

            不清晰不完整的步骤条举例如下:

    不完整的步骤条

    4、小结

    4.1 任务导航:清晰地体现任务的所有步骤,并清晰描述每个步骤,需要描述的内容如:动作描述、状态描述、时间描述、人物描述等;

    4.2 视觉元素:需清晰地表示过去、现在、将来;

    4.3 信息结构化:任务分步骤完成时,合理设计每个步骤的内容及界限。

    相关文章

      网友评论

        本文标题:第37周+《交互设计 - 聊聊步骤条》+林灿业+新学霸社群

        本文链接:https://www.haomeiwen.com/subject/tqhyyctx.html