（翻译）剩余步骤（Steps Left）

问题概述

用户将要执行填写数据的过程，该过程有几个步骤，用户需要指导。

示例

 用途

• 用于当用户的目标可以分为一系列小的步骤，并且很容易就可以将这些步骤分屏显示；
• 用于当一个过程中包含的步骤太多，如果没有引导信息，用户就会觉得这个过程永无止境；
• 如果向网站中提交信息只需要一两步，则不需要使用本模式；
• 如果很容易估计信息填写过程的情况，则不需要使用本模式。

解决方案

在系统中增加一个导航块，用其描述将信息提交到系统中需要的步骤。导航块应当在网页中一直显示，随着用户的进度不断推进，导航块中的信息也相应的更新。将用户当前所处的步骤在导航块中高亮显示，这可以给用户一个明确的指示——他已经完成了多少步骤以及还有多少步骤没有完成。

去掉网页中分散用户精力的内容，例如额外的导航功能、广告等内容。

说明

在应用系统内填写信息过程中，如果很注重吸引用户注意力，则可以使用本模式[1]。以电子商务网站为例，由于结账过程是让用户付款的过程，所以它是电子商务网站中最重要的功能，在此过程中就会经常用到本模式。本模式给用户提供一个操作过程的概览，让用户清楚已经完成了多少步骤，同时也知道还有多少步骤没有完成。

本模式与向导模式（Wizard）类似,通常用于桌面程序中，用来一步一步地指导用户如何操作。

 

原文地址：http://ui-patterns.com/patterns/StepsLeft

 

[1]原文：The Steps Left pattern is used when it is critical to maintain the user’s focus throughout the process of filling in data to the system.