Spek 商城使用体验报告
昨天， Steven成功入职Spek公司，负责公司的商城系统开发，上班第一天老大让我们分析一下自家的商城系统并且和几家竞争对手的商城系统做一下对比。给出一份体验报告。
接到这个任务之后，我动起了脑筋。思考哪些地方可以改进，思考体验之后，发现如下可以进行改进。
一、 页面布局：
I、Banner层的宽度大小：
Spek:654*430
图1 . Spek banner
Xiyu:743*403
图2.西域Banner
1688:760*300
图3.1688Banner
由于日常我们眼睛对于图片的喜好受电视和电影的影响，图片的长宽比例控制在16:9或者附近的时候会更具有欣赏性，所以我们的图片显得比较“胖”，缺乏美感！
优化建议：调整banner层的宽度，使之尽可能接近16：9的比例，更符合大众用户的审美习惯。
II、二级菜单页面的排版
图4.Spek二级菜单排版
Banner层左边的一级菜单，鼠标点击上去滑出的二级菜单显得非常凌乱，而且各个菜单切换的时候有一种明显的闪动感。而西域、米思米以及1688都没有这样的问题。另一方面，子菜单的下拉高度太长：以左边的“防护安全”菜单为例（如图5），当我把鼠标放上去的时候，下拉页面甚至超过了一个显示器的宽度，这就需要我往下滑动鼠标才能看到所有的商品分类。
图5.Spek二级菜单截图
而反观西域和1688的页面布局，都没有超出左边一级菜单的宽度。所以在二级菜单的处理上，显然西域和1688处理的更好。虽然西域的做了下拉条的处理，牺牲了部分交互体验。
图6.西域二级菜单截图
图7.1688二级菜单截图
优化建议：优化二级菜单的布局，可以参考京东或者1688的布局排版，使之看起来整齐。同时尽量使二级菜单的宽度不要超出一级菜单太多
二、颜色处理
(a).二级菜单页面的背景色并未与主界面的背景色有明显的区别，看上去缺少“层次感”。
(b).二级菜单的边框的边框线颜色太浅，容易和右边的界面连在一起看着比较混乱。西域采用的纯绿色边框，米思米采用的纯蓝色边框。
(c).二级菜单里面的分割线直接采用了黑色，显得比较”硬”，看着割裂感很强，视觉感差。
(d).左边的一级菜单，鼠标点击上去的时候没有变色，没有提示到用户正在浏览哪个大类。图7中1688的就很好的处理了这一点。
图 8 Spek二级菜单截图说明
**优化建议：
(a).修改二级菜单页面的背景色，使之和主界面的背景色有区别，建议用色#F7F7F7
(b).修改二级菜单的边框颜色，使之和主页面的边框色有区别。
(c).修改二级菜单的分割线的颜色，不要采用黑色。
(d).一级菜单在鼠标放上去的时候整体加一个背景色，可以参考JD或者西域。**
三、购买的流程：
当在思贝克商城购买的时候，在未注册的情况下，在商品详情页点击加入购物车，弹出的界面里面没有注册选项，用户需要在退出后再次点击注册，这样就中断了用户的购买行为。在购买成功之后，也没有相应的提示信息可以返回到之前的浏览界面。反观西域商城是类似于现在绝大多数商城（JD、淘宝）先让用户把商品加入购物车再登录或注册（如图9）。
在加入购物车之后，JD采用的是弹出界面的形式，西域采用的是页面跳转到登录界面的方式，这一点体验京东要更好一些。
图9 用户的加入购物车时候的弹窗截图
图10 京东结算时候页面截图
西域在购买便捷性上做的很好的一点在于，首页浏览的时候，鼠标放上去就可以看到一个购物车图标（如图11），点击这个图标就可以直接把商品加入购物车，很方便实现购买，不用跳转到详情页面。
图11 西域首页购物车图标效果截图
优化建议：在用户点击购买的时候不做限制，让用户加入购物车，在付款结算的时候再让用户登录/注册，登录建议做成弹框的形式。
四、用户的浏览习惯和购买决策：
在首页展示商品的时候，很明显可以看到两个客单价比较高的商品，经济学规律表明：客单价高的商品用户购买起来会更加谨慎，相应的决策成本也更高，而我们把两个客单价如此高的商品放在这里可能会给用户一种商城的商品并不便宜的感觉，可能导致用户购买的欲望下降等。而反观西域，则设置的比较合理，通过几个轮播页面显示，把客单价高的商品分散到几个客单价比较低的分页面去。让客户更容易接受，也不会一下子产生“商品并不便宜”的感觉。
图12 Spek首页的商品展示
图13 西域首页轮播页面展示商品截图
图14 西域轮播页面展示商品截图
优化建议：把商品客单价较高的商品分开摆放，最好加一个轮播的效果，把客单价高的商品放置在不同的页面中。
五、细节处理
当浏览到页面底部的时候，商城没有加入返回到上面的功能，用户只能手动拖动上面去，而西域和1688都有这样的功能。
图15 Spek浏览到底部时候截图
总结：综合各个方面来看，Spek的商城系统在交互体验、UI设计和一些细节的处理上都达不到成熟商城的标准，1688作为淘宝旗下的商城，技术和设计相对比较成熟；西域在排版和交互上的处理也是可圈可点的，至少没有犯一些低级的错误。
Spek 商城使用体验报告相关推荐
- 白噪音和粉红噪音煲机_白噪音app体验报告
本文包含了4款白噪音产品的产品体验报告,分别为[潮汐][网易云音乐-sati空间模块][小睡眠][蜗牛睡眠]. 全文字数: 1370 阅读时间: 5 分钟 白噪音是指一段声音中的频率分量的功率在整个可 ...
- 产品体验报告：Keep
产品体验报告思维导图 一个深度体验报告 由于自身是健身爱好者,也一直是keep这款软件的忠实粉丝,刚好最近做产品,想想写一份详细的深度体验报告来致敬我的健身最爱! 产品概述 1.1体验环境 设备型号: ...
- 火辣健身产品体验报告
火辣健身产品体验报告 当前位置: Home » Consto » 火辣健身产品体验报告 一.体验环境 设备型号:nubia Z17 操作系统:nubia UIv6.0 网络环境:无线WiFi 体验版本 ...
- iTools产品体验报告
iTools产品体验报告 本文转载自人人都是产品经理,本文链接:http://www.woshipm.com/it/133705.html 概览 ○体验产品:iTools ios ○产品版本:V3.6 ...
- 分享一个产品体验报告
一. 体验环境 测试机型:iPhone8 操作系统:IOS12.4.1 测试网络:WIFI 测试版本:7.13.0 二. 市场情况 2.1 市场规模 根据艾瑞咨询的统计,2019年中国职业教育市场规模 ...
- 小米手机nfc能连电脑吗_基于ios平台小米手环5 NFC版体验报告
2020年6月11日,小米手环5如期问世.作为2代和3代小米手环的用户,对新款小米手环还是十分期待的.从安卓转到ios,全功能NFC的缺失着实给生活带来些许不便.随着ios逐步开放城市公交卡的功能,我 ...
- 【游戏分析】《War and Magic》体验报告
<War and Magic>体验报告 一.游戏概述 二.游戏系统 三.消费点分析 四.优缺点及改进 五.浅谈英雄系统 六.总结 一.游戏概述 测试环境:IOS13.4 iphone7 测 ...
- 京东app产品体验报告
京东商城APP产品体验报告 目录: 1.0体验环境 2.0产品介绍 3.0用户分析 3.1用户特征 3.2用户数量 4.0产品设计 4.1功能结构 4.2界面设计 5.0总结 1.0体验环境 .操作手 ...
- 红旗linuxcentos_用红旗Linux 11的体验报告，附使用红旗Linux 11截图
以下是用红旗Linux 11(英文名是RedFlag Linux Desktop 11)的体验报告,另附上使用红旗Linux 11的桌面截图. 前言 首先,不带偏见的说下,红旗Linux 11因为是首 ...
最新文章
- pyqt5程序发生错误不中断_关于Windows页面错误的一些基础概念
- OpenCV 3最新模块介绍
- python框架django的数据库的正向生成和反向生成
- 工作之后，顶会还重要嘛？
- c语言链表编程作业,C语言编程入门——链表
- Tensor的合并与分割
- [渝粤教育] 中国地质大学 管理信息系统 复习题 (2)
- 必看谈谈数据库的锁机制！！
- FastDFS实现原理及流程
- 数字电路基础（四） 数据分配器、数据选择器和数值比较器
- 心电信号越界怎么回事_人体心电信号的特点
- matlab矩形频谱图,如何用matlab画出周期矩形脉冲信号及频谱图？
- 假设检验之单个总体均值检验（含Python代码）
- Latex/CTex/WinEdt常见错误“! Improper alphabetic constant.”
- win10系统做域服务器,win10启用ad域服务器配置
- 中专高一第一学期计算机应用期中基础考题,职业中专第一学期计算机应用基础WIN7和Word2010版期末考试题...
- IP-guard功能详解—即时通讯监控
- 手把手教你搭APM之Skywalking搭建指南(支持Java/C#/Node.js)
- php实现播放直播_php和腾讯直播的实现代码
- 1月共有49个区块链项目进行ICO，卖牛肉的都来玩区块链了！