视觉层面的思考:6个为新手用户设计的策略

之前的文章里探讨过界面的易操作性,提到的主要是视觉层面的思考,今天这篇想总结一下对于新手用户,可以通过哪些设计策略来帮助他们进行操作。

引导页

引导页的使用在PC端常见于安装软件的过程中,在安装时,可以在进度条的上方看见滚动播放的产品介绍,每一页都会针对某一个产品的特性进行宣传,让用户在使用产品前,对产品的功能有一个大致的了解。

如今移动端的设计,同样运用了这个方式,但作用不仅限于产品的介绍,同时还涉及了品牌文化的宣传、烘托氛围以及鼓励用户打开相关配置的作用。比如产品的介绍, 设计这种引导页时,因为导览页面的数量不能太多,挑选的特性应该是这个产品的核心特点。能使用图片说明的情况下,优先使用图片,因为图片能够涵盖的信息量是要比文字大很多的。

曾看过一位设计师总结这类引导页的设计方法,方法还算通用,称为3X3法,就是用三个页面解释三个问题:what、why以及how。

What — 你的产品是干什么的?

Why — 你的产品能带给用户什么?

How — 是怎么来达到这个目标的?

上图中的例子就来自于这位设计师文中列举的案例。

而烘托氛围的比如airbnb的这个例子,让用户体会到温馨的感觉,对于这个产品有了更多感性的认识。

最后一点鼓励用户打开相关配置的作用,这个在工具类产品中使用比较多,因为对于很多工具类产品,是否获得通知提醒或则定位的权限对于这个产品的体验有非常大的影响。比如之前看过一篇hopper设计师写的思考,hopper是一款实时分析机票价格、告诉用户何时购票最为划算的软件。所以通知对于观望功能极其重要,如果用户不允许Hopper发送通知,他们就无法在价格达到低价区间时收到购票建议信息,观望功能就会失去使用价值。因此设计师将引导页设计成了如下的样式,用户打开通知功能的几率大大增加。

如果想要查找更多关于引导页的设计,可以在dribble或则pinterest上搜索walkthrough。

覆盖层和提示窗口

覆盖层式的设计是专门针对于移动端而产生的,如下图

移动端的屏幕空间十分宝贵,所以采用覆盖层的方式可以节约空间,在用户第一次使用某个界面时,通过覆盖层展示关键的几个工具的使用说明,帮助用户快速的上手使用。

这种方式需要注意解释的功能数量不能过多,以免用户因为信息过载而导致事半功倍。同时给予用户随时跳出的权利,一般的做法是点击任意位置即可跳出。

而提示窗口的使用其实和覆盖层类似,当用户第一次打开了某个页面或则某个功能时,弹出提示窗口,告诉用户当前页面的使用方法。比如enlight,这是一款非常强大的照片处理软件,提供的功能很多,所以提供适当的帮助是十分重要的。如下图所示,enlight在用户第一次使用某个功能时会弹出提示窗口,通过gif图片的形式告知用户这个功能可以达成怎样的效果。

模板

模板就好比服装店里的塑胶模特们,店员们将精心搭配好的服装穿在模特身上,展示给购物者看,不知道如何搭配的购物者,可以通过这些搭配的模板来选购。当然对于早已有着自己的搭配风格的购物者而言,这些模板是可以忽略的,这就好比高级用户,他们早已知道如何使用你的产品,并且还能将产品的功能利用到很多不常见的地方。

模板的案例比如我们经常使用的word,新建一个文档时,word会提供很多模板。

还有像clear这类效率类软件,为了让用户更快的了解到产品可以做些什么,在刚使用的时候也提供了很多例子,如下图所示。

输入或操作区域提示

除了上面说的各种一次性的帮助方式以外,这一条的特点是具有持续性,伴随着各种输入和操作过程中。在PC端中,有一种形式十分常见,就是当鼠标移动到相应的控件上时,悬停后会出现相关的解释性文字,但在移动端由于交互方式的限制这种方式无法实现。所以采用的是静止的文字提示,提示用户操作当前区域需要注意的地方。比如下面的例子中的搜索框以及评价框中的提示性文字,当输入了文字以后,提示性文字就消失。

操作区域的提示,典型的例子比如ios中的系统设置,如下图,在每一个操作区域旁边都用提示性文字解释了这项操作将会导致什么样的结果,给不熟悉的用户可以预知操作的后果。

向导

向导(wizard)是微软发明的一个习惯用法,在PC端就十分的常见,通过一系列的对话框逐步引导用户了解产品。移植到移动端,向导的使用变得更加有针对性,比如社交产品中,为了用户与用户之间更好的了解,引导用户填写完整个人信息,如下图。

而像有的内容类产品中,为了针对于不同用户的个性化需求,在第一次使用产品时会引导用户不同类型的人物或则标签。让用户可以更快的融入到产品中,发现更多好玩有趣的东西,而不会因为初次进入因为没有内容源而失望离去。

帮助与反馈

帮助与反馈在PC端的软件中,往往都会提供一个帮助手册,里面详细的介绍了相关的问题和解决方法,当然也可以通过搜索的方式找到合适的解决办法。而移动端的产品通常没有PC端的那么复杂,一般不会提供详细的帮助手册,但会提供一个反馈的通道,用户可以通过反馈通道快速的反映相关的问题。比如知乎就做的比较深入,不仅提供文字反馈,而且可以通过摇一摇的方式,截屏发送反馈,方便开发团队更好的改进产品。如下图。

文章来源:产品经理

作者:@Thor(微信公众号:thor_datou)

(0)

相关推荐

  • MAC新手用户如何开关Macbook键盘灯

    键盘灯是很有用处的一个小设置,它可以提醒我们键盘上的一些按键是否在启用状态。不过对于MAC新手用户来说,如何开关Macbook键盘灯是一个很令人烦恼的事。现在就让小编来教你吧。 打开和关闭Mac键盘的 ...

  • 给安卓新手用户的一些建议和经验

    一,智能手机并不难,别在没去搞懂它之前就被它在心里吓倒; 二,如果你没用过智能机,别觉得智能机会很复杂,为什么叫智能机,智能机就是比普通手机更聪明,能为你办一些非智能机办不到或者办不好的事情,且更加人 ...

  • MindManager新手入门教程

    MindManager是一款创造.管理和交流思想的思维导图软件,其直观清晰的可视化界面和强大的功能可以快速捕捉.组织和共享思维.想法.资源和项目进程等等.MindManager新手入门教程专为新手用户 ...

  • 电商工作后台首页的商业价值重构与产品化设计

    电商网站一分为前台导购及后台管理两方面,通常由买家及卖家两种角色组成.大部分的工作是在后台完成,涉及到各类管理系统,保障日常工作顺利运行.后台产品设计因其逻辑复杂.业务繁多.专业性强具有较大挑战性,在 ...

  • Xcube智能一键生成H5

    Xcube是基于QQ空间营收类活动所搭建的H5活动页面智能生成系统,是针对框架相对固定,高频率的运营H5活动所设计.在这里分享一下我们在日常运营H5活动设计当中遇到的问题以及Xcube开发的过程. X ...

  • 抖音只能发短视频,怎么发超过15s的长视频呢?

    很多人抖音只能发15s,因为抖音规定只有粉丝涨到了1000,才可以发16s到60s的长视频,那么怎么玩抖音才能涨粉呢? 首先,碰运气瞎拍肯定是不行的,你在抖音上一定看到过很多这样的视频,很多人靠着它涨 ...

  • 通过收藏夹迭代思考:视觉设计师应拥有的体验思维

    面对纯工具型产品时,作为一名视觉设计师很容易陷入两种境地--脱离产品.用户本身做天马行空的视觉设计进入一种自我陶醉的状态,从而产出过于形式化不符合工具类产品特征的设计:或从产品中难以寻找到视觉价值以至 ...

  • 2018年职场:全价值链研究员的思考与实践

    产品.交互.视觉.用研.品牌,都是用户体验从业人员,不知道作为其中一员的你,有没有这样的感触:用户体验从业人员的综合要求越来越高,如果不进化随时可能被时代抛弃,我们来看一则新闻: 于是,有人喊出了&q ...

  • 优秀的UXD设计师必备的思考方式

    " 张三丰将太极剑慢吞吞软绵绵地演了一遍,问张无忌看清楚没有,又问他忘掉没有,张无忌想了想,说忘了一大半了:接着张三丰又表演了一遍,竟和前次完全不同,又问张无忌忘记了没有,他说还有三招没忘: ...