检票APP设计心得总结

最近接手一个比较紧急的项目,把在做这个项目时的一些体会总结分享出来,既希望能把所学到的沉淀下来,也希望能对大家有所启发。项目采用面向场景的设计方法,面向场景是针对该产品使用场所等模拟,模拟用户在多种情况下产品使用的模拟。

前言

前段时间项目组接到公司一个紧急项目,做一个景区检票的APP,项目周期很短,设计、开发、测试到上线仅仅只有两个星期的时间。最后经过项目组成员的辛勤付出,项目如期上线。这个APP虽然功能简单,但要在这么紧迫的时间内把它做出来,并且把用户体验做到最好还是有很多地方需要去思考的。下面我会一一列举我在做这个项目的一些心得体会。

一、考虑产品媒介

该APP是Pad端的,相比于手机端,屏幕要更大,可展示的内容会更多。最初,产品给的原型是这样的(如下图,哈哈哈,有没有被惊到……),产品仅仅把该APP的几个主要功能摆放在页面上,没有考虑到对大屏幕的有效利用,有些功能其实可以展开出来的,而不是让用户跳到下级页面去看,比如“检票记录”。

二、了解使用场景优化交互体验

1.使用场景

景区检票员在检票的时候心情是焦虑、烦躁的,特别是排队人数很多的时候。这就要求该APP能够做到非常容易学习,容易使用,以最少的操作步骤、最快的速度准确地完成任务。

2.更少的操作次数

对初稿原型进行优化,在第二版中将检票记录列了出来,而不需要进入二级页面才出现,如下图:

但是现在用户要完成一个检票动作需要这几步动作(检票分为扫码枪扫码检票和输入编码检票):

扫码检票的情况下:用户扫码  →  点击“检票按钮”  →  弹出检票结果  →  关闭弹窗

输入编码检票的情况下:用户点击输入框后弹出键盘  →  点击“检票按钮”  →  弹出检票结果  →  关闭弹窗

此等操作太过于繁琐,估计检票员会提着菜刀来砍人。于是再优化,给出了下一版,优化点有:

  • 将数字键盘直接置于画面中不动,只需点击键盘即可输入;
  • 另外将检票状态置于页面右上角,不需要弹窗;
  • 检票记录只显示当天的检票记录,想查看以前的可以点击“历史记录”;
  • 另外最重要的一点是,将“检票按钮”去掉,扫码枪扫码后直接出检票结果,输入编码到达数字位数后直接出检票结果。

现在用户要完成一个检票动作只需要两步动作(检票分为扫码枪扫码检票和输入编码检票):

扫码检票的情况下:用户扫码  →  查看检票结果

输入编码检票的情况下:用户输入编码  →  查看检票结果

视觉稿如下:

3.状态的完备性

状态的是否完备最能体现设计是否严密,也是最容易被人忽略的环节。状态可分为:空白状态、初始状态、加载中、一般状态、极限状态、成功状态、错误状态、完成状态。当然不同的应用也存在着一些比较特殊的状态,比如该产品中,我们要考虑到扫码枪的电量问题,所以需给出剩余的电量状态。

4.状态变化的易见性

当内容状态变化的时候需要让用户清晰明确地感知到,消除用户焦虑感,让用户对设备的有可控感。在该APP中,当检票的时候,如果前后两次的检票结果一样,那变化的可能就只剩下“入园时间”了,这样很难让用户感知到。于是在检票结果变化的时候,加入了动效,如图:

为了营造更好的体验,让用户更快地知道检票结果,我们对检票的几个状态分别录了声音:“检票成功”、“门票已使用”、“门票已过期”及“门票不存在”;另外当扫码枪电量低于20%时也会有相应的声音提示。

三、总结

本文主要总结的是采用面向场景的设计方法,面向场景是针对该产品使用场所等模拟,模拟用户在多种情况下产品使用的模拟。好的设计是建立在对用户深刻了解之上的,因此用户使用场景分析就很重要,了解产品的现有交互以及用户使用产品习惯等能够做出一个另用户满意、使用舒服的产品。

最后附上一张视觉稿的汇总,感谢大家阅读!

站酷

作者:Bxxw

(0)

相关推荐

  • 移动端APP设计的十大趋势

    从移动端兴起,主流设计风格定型,再到Uber.Vine等现象级APP的崛起,移动端的APP设计直到现在才渐入佳境.促成这一切的影响因素很多,比如社会发展趋势的变化.共享经济的大热.新技术的积累,等等等 ...

  • APP设计思维与网页设计思维

    APP设计思维与网页设计思维. 原作者:KAYLA KNIGHT翻译martinRGB   来源:http://tympanus.net/codrops/2013/11/22/applying-app ...

  • 教你iOS APP设计一稿支持iPhone5/iPhone6/Plus

    移动app开发中多种设备尺寸适配问题,过去只属于Android阵营的头疼事儿,只是很多设计师选择性地忽视android适配问题,只出一套iOS平台设计稿.随着苹果发布两种新尺寸的大屏iPhone 6, ...

  • 优雅的电商IOS APP设计 PSD SKetch免费下载!

    小编:今天给大家带来的是由pixelbuddha分享的一款优雅的电商IOS APP设计.确实是一款很高品质的APP 750X1334分辨率,配色和版式都是非常舒服,而且拥有12个完美的源文件分层 都是 ...

  • APP设计当中不容忽视的20个小细节

    小编:在设计中,我们总会忽略了一些细节上的问题,其实要把细节处理好也是非常难的.那么在APP设计中的你是否也粗心大意过,或许你还不知道原来有那么多地方需要重视,今天分享的这一篇关于大家在APP设计当中 ...

  • Livescore概念IOS APP设计(PSD免费下载)

    小编:今天给大家带来的是由edoardococcia分享的Livescore概念IOS APP设计模板,这是一款看足球比赛结果的软件,作者概念了几个页面,还有几个动效.大家可以下载这款软件对比下研究学 ...

  • IOS9风格APP设计菜单栏PSD免费下载!

    小编:今天给大家带来的是由redesigncase分享的IOS9风格APP设计菜单栏.该资源有9中不同的菜单栏,侧边.全屏.半透明.等等不同的设计.这对设计菜单栏会带来很多灵感,希望能够帮到您! 下载 ...

  • Scorer-体育足球类APP设计(PSD免费下载!)

    小编:今天给大家带来的是由Subrata Das一个足球比分实时更新的APP设计.该PSD共有6页,750×1334分辨率.蓝色风格主色调,排版合理.想做体育类APP,找灵感 学习的APP设计是个不错 ...

  • 如何学习一款优秀的APP设计?

    今天小编带来的是@兔子猪耳朵的关于教你如何去快速构建属于自己的移动app产品和向一款自己喜欢的app学习的过程和方法.希望对你有一定的帮助. 适合移动APP产品经理和创业者来学习.也是目前最常用的ap ...