10张图搞懂UI＆UX重点笔记！

UI （User Interface，亦称用戶界面）与 UX （User Experience，亦称用户体验）有什么不同？由 UI 与 UX 产业专家们所成立的组织Conversion Lab ，整理了网路上常见的 UI 与 UX 差异图，一图胜千言，让我们用这些图，来看一下 UI 与 UX 不同之处吧！已经了解差异的读者也可以数数看，自己曾经看过的图有几张。

1. 以番茄酱瓶来比喻UI ， UX 是考虑到番茄酱快用完时，很难倒出的使用情境，因此倒过来的番茄酱瓶设计。

2. 从定义来解释 UI 与 UX 之间的差异，两者定义有很大的不同。 UI 考虑的是“产品如何呈现”，UX考虑的是“产品如何被使用”。

3. 从专业分工的角度来说明差别，可以看出负责的部分哪些相同、哪些不同。而两者最大的重叠处在互动设计（Interaction Design）。

4. 从UI 设计师与UX设计师来看差别。这张图比较复杂，但基本上还是看得出差异。 UI设计师主要依据客户要求做设计，UX设计师会研究使用者需要来做设计。相同之处很明显，都是留着大胡子的胖子。

5. 从工作内容来解释差异，UI工作项目可能集中在互动设计、平面设计、图像主题表现、视觉设计，UX 的工作内容范围却可能包含田野调查（了解使用者需求），甚至与研发团队合作。虽然 UX 的范围很广，但很少人可以精通全部，几乎没有。

6. 用两者基本的工作项目来区分，UX 设计师负责易用性测试（Usabilty Testing）、使用者故事（User Story）、使用者研究（User Research）、用户体验（Personas）；UI 设计师负责呈现（Lay Out）、视觉设计（Visua Design）、品牌化（Branding）。但 UI 有没有专职的品牌设计，就看每家公司对职位的安排了。

7. 从产品的角度看 UI 与 UX，UI 是产品的一部份，UX 是使用产品的体验。

8. UI 设计着重“功能”，易用性设计（Usability design）着重“行为”，UX设计着重“情感”。

9. UI 是用来取用内容（Content）的工具。以谷片比喻内容，汤匙比喻UI，使用 UI 吃完内容的体验是 UX。

10. Conversion Lab 也画了一张图来说明 UI 与 UX 的差异。

UI 在使用者的眼前，UX 在使用者的大脑里。 UX 设计师不仅关注介面设计，更关心所有会影响使用体验的一切，例如资讯架构、互动设计、内容（Content）、使用者的认知、经验、需求、价值观。

当UI 设计师设计完介面之后，对UX 设计师来说，工作还没完成，UX 设计师最终的工作是在使用者的大脑里完成的，所以UX 设计师永远看不到自己的工作成果，只能透过使用者访谈或定性定量UX 研究方法，去检视使用者脑袋里的体验是否正确。

有人会说设计 UI 不就是在设计 UX 吗？如果 User 的体验只被 UI 影响，那或许可以说设计 UI 就等于设计 UX，但使用者手上拿的不是 UI，而是产品，UI 是产品设计的一部份。体验也不完全只受产品影响，还会受到使用产品时当下的使用情境以及使用者对品牌的印象等等其他与体验相关的事影响。以上就是 Conversion Lab 整理的 UI＆UX 的差别图。

Conversion Lab

Conversion Lab 是由一群对用户体验设计抱有热忱的产业专家创立，希望藉由优化用户体验，进而提升转换率，为事业与网站带来巨大成效。

Hans Shih

主要工作为用户体验研究与设计、网站易用性与数据分析。期盼自己能成为一位优秀的 Designer & Researcher，就像互动设计提倡者 Alan Cooper 强调的一样，设计师必须成为 UX Researcher，才能有效地将从使用者身上得到的见解，落实在设计里面。

10张图搞懂UI＆UX重点笔记！

推荐阅读更多精彩内容