用户体验视域下的手机购物网站界面优化设计分析

韦立蓉

摘要：依托用户体验对手机网络网站界面展开设计，率先把传统设备布局优化的SLP方法运用至网站界面优化设计中，大大扩展网站界面设计思路与方法。该文则从用户体验视域分析手机购物网站界面优化设计。

关键词：用户体验；手机购物网站；界面优化设计

中图分类号：TP393 文献标识码：A 文章编号：1009-3044（2017）27-0279-02

随着4G网络、智能手机的发展和普及应用。移动电子商务得到迅猛发展。手机购物网站因具有便利性、互动型等优势，逐渐成为网络购物常用的方式，且手机购物者主要集中在18-34歲范围之内。但不管是手机购物网站或APP应用程序，购物体验均是影响购物网站发展及用户购买行为的关键因素，而与用户交互的网站界面设计情况对购物体验发挥着重要的作用。网站人机交互界面设计旨在提升用户体验，用户体验主要表现在视觉、触觉、交互性等多个方面[1]。有学者以在校大学生为研究对象，把网页服务质量划分为各种维度，对网站购物用户满意度展开实证研究[2]]。有学者根据用户评分法，把用户体验运用至手机交互设计中，获得满意的设计效果[3]。上述研究虽对用户体验展开定量分析，但对手机界面设计主要表现在定性描述方面并未将用户体验用于界面优化设计中。SLP（systematic layout planning）分析法属于系统设施布置方法，在实现系统功能的条件下，通过对各作业单位物流量展开分析，依托作业单元物流与非物理之间的关系展开规划设计，并借助一套表达力较强的符号及简明表格，往常清晰地布置设计[4]- [6]。本文以用户体验为中心展开手机界面设计，尝试利用手机购物实验，结合手指动线路径展开统计分析，并运用SLP方法对手机购物网站界面实施优化设计，并进一步验证这种设计的有效性。

1 实验对象及实验设计

1.1 实验对象

本次实验采用电子购物网站的中间客户微微研究依据，挑选20名青年人为研究对象，这些人均有超过1年的手机购物经验，入选者的年龄在21-26岁范围之内，包含11例男性，9例女性。本次实验所用购物手机为的屏幕为3.5英寸，设置Andriod操作系统，并运用时常运用触屏版淘宝网为实验网站，以每个实验者需求存在较小差异的产品8g优盘为研究对象，并借助另一部像素功能较好的手机记录每位测试者的操作流程。

1.2 实验设计

开始整个实验之前，每位测试者均填写年龄、使用手机的购物经验等内容，并提醒每位接受测试者本次实验目的为购买自己满意的8g优盘，利用事先准备好的智能手机将淘宝网页面点开，整个流程至点击支付结束为止。进行实验前，要求被测试者开展一次预操作。待整个实验结束后，针对每一种行为、被试者情绪、表情等做好记录，事后询问出现这种情况的原因，并由被测者填写对这个网站不满意之处，并提出相应的改进建议。

2 实验结果及其研究

下文选定整个实验中具有复杂性、代表性的淘宝网购物界面为依据，其界面截屏如图1所示。因网络界面元素包含图标、导航工具、文本等内容，为明确区分界面元素，图中使用标号对各界面元素进行标记。虚线框内表示可以进行操作的内容，标号自1至9，区域6代表手指滑动区域。实线框代表信息展示界面元素，标号自1-4。

2.1 被测试人员的生理、心理

依据实验调查结果，购物车界面的被测试人员生理、心理及建议结果见表1，频率指数代表这种状态或提出这种建议的人数，研究结果证实，该网站界面功能和美学体验度有待进一步提升。

2.2 被测者操作动线路径距离统计结果

实验结果表明，3、6、9三个元素之间手指移动比较频繁，次数均为24次，而实验者自6点击3，通常是为点击9这个删除元素。因此，由于3的存在，导致操作变得比较复杂，手指在其间进行移动比较多余。其中，1-6、3-6、4-8、6-7、7-8等元素之间手指移动次数较多，导致用户使用购物网站购物时，手指移动距离较长，操作效率比较低，网页元素布局有待逐步进行优化处理。

3 基于用户体验的购物网站界面优化设计

3.1 优化设计步骤

针对以上实验手机购物网站页面设计存在的问题，笔者运用SLP法对网站界面实施改进出，并通过多项指标评估优化方案。SLP方法作为工艺规划布局常用方法之一，利用各作业单元间的物流强度，帮助进一步明确作业单位布局位置[8]-[10]。本次利用SLP方法对购物网站界面优化设计时，先把网页内个操作元素看成作业单元。首先，以试验中个操作按钮之间的移动此时为物流量，并遵循物流量强度等级和比例划分不同作业单位之间的关系强度等级[11]- [12]。其次，依据这些作业单元之间的关系强度。运用Tompkins块状图技术，制作最少两种无面积作业单位拼块图[13]- [15]。最后，依据拼块图，结合不同界面元素、手机屏幕大小，遵循变化与统一、比例与适度等布局元素，获得相应的网页改进方案，如图2所示。其中，图中的五角星表示转收藏按钮，右上角的小房子是返回主页按钮。

3.2 改进方案效果评估

优化设计后，各元素之间网页操作距离如表3，以优化网页设计前的操作路径距离为标准，优化设计后比改善前的操作路径减少257.73cm，手指移动距离减少51.7%。

由此可知，这种设计能有效降低用户手指酸麻可能性，大大提升使用者的体验度。这些数据充分表名，改善方案不仅由于取消部分路径促使操作路径长度变短，也能改善网页布局，进而缩减用户操作所用时间。

4 结束语

本文利用SLP方法对淘宝网购物网页进行优化设计，优化设计后用户操作距离明显缩短，操作时间随之较少，更适应用户的体验需求，进而验证这种优化设计的有效性和实用性。

参考文献：

[1] 孙军华，南桂美，黄怡婳等.手机终端网络购物的动作标准和动作时间研究——以京东APP为例[J].上海理工大学学报，2016，38（4）：387-393.

[2] 张杨阳.以移动终端电子阅读用户为用户群体的设计——社交移动应用程序书格子[D].北京大学，2013.

[3] 赵国栋. 基于Android系统的手机网上商城设计与实现[D].北京交通大学，2012.endprint