UX · UI

UX和UI到底有什么区别？

UI关注的是“看起来怎么样”，UX关注的是“用起来怎么样”。同样是一个预约按钮，颜色 · 形状 · 文字属于UI的工作，而这个按钮是否放在顾客会去找的位置，则属于UX的工作。

两者并不是彼此分开的工作。通常先用UX确定顾客的浏览路径和页面顺序，再在此基础上用UI加上颜色和文字。顺序一旦颠倒，就很容易做出好看却不好用的网站。

看设计稿时把这两方面分开来看，反馈意见会好提得多。“不喜欢这个颜色”是UI层面的意见，“价格很难找”则是UX层面的意见。

UX还包括页面之外的体验。预约后收到的确认短信、咨询得到回复的速度，对顾客来说都属于“在这家店消费的体验”。

好的UX用什么标准来判断？

好的UX，就是顾客“不用动脑”也能完成想做的事。可用性研究机构尼尔森诺曼集团（Nielsen Norman Group）把这一点归纳为10条原则（可用性启发式原则），很多设计师都把它当作检查清单来用。

套用到店铺网站上，下面几点尤其重要。这些不是什么高深理论，和在店里接待顾客时的常识几乎一样。

不需要把所有原则都背下来。看设计稿时，只要反复问一个问题——“第一次来的顾客，能马上知道在这个页面该做什么吗？”——大部分问题都能被筛出来。

• 告诉顾客现在在哪一步：如果正在预约，就像“共2步中的第1步”这样显示进度。
• 用顾客的语言：与其写“服务介绍”，不如写“项目菜单 · 价格”这类顾客会搜的词。
• 方便撤回：选错了日期，不用从头重新选。
• 相同的东西保持一致：按钮的形状和位置不要每个页面都不一样。
• 提前防止出错：比如干脆让顾客无法选择公休日。
• 只展示真正需要的内容：与其把所有信息都塞进首屏，不如先展示最重要的内容。

店铺网站的UX怎么检查？

最可靠的方法，是观察别人实际使用网站的过程。即使没有设计专业知识，按下面的顺序花30分钟，也能发现不少需要改的地方。

检查时关键是不要讲解、也不要帮忙。因为顾客使用网站时，身边并没有人提点。

也可以用数据来确认。在访问统计中查看进入预约页面的人里实际完成预约的比例，就能推测顾客是在哪一步流失的。

1. 01找两三位不太了解您店铺的熟人。年龄段不同更好。
2. 02把手机递给对方，一次只给一个任务，比如“预约本周六下午”“找找看能不能停车”。
3. 03在旁边默默观察，记下对方犹豫的地方、点错的地方、按了返回的地方。
4. 04结束后简单问一句：“哪里让您觉得困惑？”
5. 05如果好几个人都卡在同一个地方，就先改那里。
6. 06改完后，再请新的人做同样的任务来确认。

不同行业的网站UX要注意的地方不一样吗？

是的，顾客进入网站后“最先想做的事”因行业而异。让这件事用最短的路径完成，就是UX设计的核心。

所以即使用同一套设计框架，菜单顺序和首屏按钮也要根据行业调整。照搬其他行业的网站，可能并不适合您的顾客。

即使是同一行业，也会因顾客群体而不同。如果店里年长顾客多，把字放大、把电话按钮放在前面可能更合适；如果20多岁的顾客多，把KakaoTalk · Instagram入口放在前面可能更合适。

• 咖啡馆：顾客最先找位置 · 营业时间 · 菜单照片。地图和“路线导航”放在上方比较好。
• 美发店：顾客会比较各项目的价格和设计师，然后预约。从价目表直接进入预约的流程很重要。
• 手作工坊：顾客会确认课程时间和剩余名额后报名。选择日期的页面必须简单易用。
• 网店：顾客会比较商品、加入购物车。搜索 · 分类 · 支付的步骤要短。

UX会影响搜索曝光吗？

会有间接影响。Google搜索中心表示，会尽量奖励页面体验（加载快、在手机上浏览方便、连接安全等）好的页面。

不过Google也说明，即使页面体验稍有不足，也会优先展示与搜索词最相关的内容。也就是说，在同样优质的内容很多时，页面体验才可能拉开差距，所以先把顾客要找的信息写充实才是第一位的。

比搜索排名更直接的效果是咨询 · 预约数量。同样的访客数，UX好的网站会有更多顾客最终联系您。

和网站制作公司合作时，UX · UI上常犯哪些错误？

最常见的错误是先看设计稿就做决定。跳过页面骨架（线框图），注意力就会被颜色和照片吸引，很容易忽略菜单顺序、按钮位置这类重要问题。

另外，很多人只在电脑屏幕上确认设计稿。店铺的顾客大多是用手机进入网站的，所以设计稿也一定要在手机上打开看看。

关于UI风格的反馈意见，最好附上例子。与其说“要高级一点”，不如像“像这个网站一样留白宽、字体细的感觉”这样一并给出参考网站，修改次数会减少。

上线后，UX也要持续打磨。顾客经常打电话问的问题，说明这些信息在网站上很难找到，把相关内容移到更显眼的位置就可以了。

• 在设计稿之前，会先给我看页面骨架（线框图）吗？
• 会单独制作手机页面的设计稿吗？
• 能说明顾客要点几下才能完成预约 · 咨询吗？
• 上线前会用真机手机实际试用检查吗？
• 上线后有没有根据顾客反应进行修改的方式（修改次数 · 维护管理）？