UI界面与UX用户体验设计的区别与联系？
UI即User Interface（用户界面）的简称。泛指用户的操作界面，包含移动APP，网页，智能穿戴设备等。UI设计主要指界面的样式，美观程度。而使用上，对软件的人机交互、操作逻辑、界面美观的整体设计则是同样重要的另一个门道。
UI可以让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由，充分体现软件的定位和特点。
交互设计（英文Interaction Design, 缩写IXD)，是定义、设计人造系统的行为的设计领域，它定义了两个或多个互动的个体之间交流的内容和结构，使之互相配合，共同达成某种目的。交互设计努力去创造和建立的是人与产品及服务之间有意义的关系，以“在充满社会复杂性的物质世界中嵌入信息技术”为中心。交互系统设计的目标可以从“可用性”和”用户体验“两个层面上进行分析，关注以人为本的用户需求 。
从专业分工来看，UX和UI的工作内容有不同之处，但也有重合的部分。
UI关注产品功能，UX关注用户情感。
UI则是布局设计，视觉设计，品牌形象。UX职责包括用户画像，用户故事，用户调研，可用性测试。连接两者的是线框图。
UI涉及人机交互、工业设计、视觉和声音设计等。而UX则包含信息架构、内容策略在内的更多部分，他需要从整体动态流程上考虑产品是否能解决用户的问题。UI属于UX的一部分。
UI设计重心则是色彩、排版等视觉方面。UX设计以用户为中心，关注任务流和使用场景。相似之处是两人都留着大胡子。
UI设计师关注按钮的颜色，考虑的是视觉的部分，是产品看起来如何。而UX设计师则关注按钮放置的位置是否合适，zui终出发点是用户的感受，想要弄清楚人类想要使用的是什么，解决用户痛点。
UI，指的是用户界面，也就是人与机器互动的界面。同时又有GUI和WUI之分，不过一般的话统称是UI设计师。
UX ，英文为 User Experience ,指的是用户体验。一般而言，国内 UX 设计师，也称为交互设计师或 UE 设计师（而国外的 UX 设计师指的是用户体验设计师，交互设计师指的是动效设计师）。
其实互联网领域中，UI 和 UX 设计师的界限相当模糊，在很多创业公司，这两个设计角色是合二为一的。这个就是为什么很多中小型的公司为什么要求UI设计会交互，或者交互又要懂UI的原因。
很多人可能在没有完全接触到交互设计师这个领域的时候，对于这三个缩写是懵的状态，而事实上，UE和UX都是User Experience的缩写，也就是用户体验，两者没有区别只是叫法不同。而UI是User Interface，用户界面，具体的区别会在后面讲到。
User Experience（UE，UX）
UE & UX 用户体验
UE & UX两者都是User Experience（用户体验）的缩写，下文中统一用UE来表达，是指用户访问一个网站或者使用一个产品时的全部体验。他们的印象和感觉，是否成功，是否享受，是否还想再来/使用，他们能够忍受的问题，疑惑和BUG的程度。在交互设计的过程中，用户体验是其中的一个步骤，在广义范围来讲，就是设计师在考量优化的外观和可用性以满足用户的需求，增加用户体验。
实现方式主要是将用户在使用产品之前、使用过程中、以及使用之后的全部感受考虑进设计内，在设计过程中所需要做的调研，因此，UE是为了让用户有一个更好的体验，设计师需要通过调研，发现用户的问题并设计方案解决问题。
UE设计流程
UE设计阶段，首先是灵感创意。交互设计师需要通过广泛地研究用户，理解和观察用户，分析竞品——充分掌握用户的痛点和难点，以尝试解决问题。有了一定的了解之后，需要开始进行用户调研。在这个过程中，主要会通过用户访谈、人工统计、人物角色设定等方法累计数据和经验，为将来的推理打下基础。
观察用户及用户所处环境
具体调研方法可以有以下几种方法：
观察方法，通过观察了解用户处于什么阶段，面临了什么问题，用户在使用产品的过程中会如何操作以及操作过程中每个步骤的想法，观察某个或者某些步骤对于用户使用产品的好坏。此时可能会运用Mapping进行思维发散，了解用户的所做所想，了解用户的感受。
Mapping
在观察方法中，设计师要充分研究用户客群的知识背景、年龄、职位、生活习惯、兴趣。在这个过程中可以通过观察记录用户的一天，一周，来得到可用信息。
用户画像
问卷调查方法，通过设置一些基础问题，来了解用户的基本信息，其中可以包括用户行为问题，用户体验问题，用户期待等方面。当然如果条件可能，也可以直接采访用户，通过采访已经或者将要直接参与该产品的人，进行客群分析，这样得到的信息会更加的准确。了解产品客群之后，以及相关问题之后，需要设想问题的解决方案。
总之，在整个过程中，交互设计师需要了解目标用户的情绪、痛点以及行为以定位用户形象。除此之外，还需要研究用户行为反应，了解用户群体和用户流。在有了前期了解的基础上，视觉上的每个步骤也都需要集思广益，从多方面，多角度了解产品和用户的契合度。从而得到产品相框以及产品原型。之后，通过体验人员的测试反馈，做整体的提升和调整，并且每次测试更新后都要继续将更新后的产品交到测试员手中，继续测试。测试反馈阶段至少要重复三次之后，才可以将产品放出，并且在实用过程中持续保持用户反馈的整个流程，以随时顺应新的用户需求，提高用户体验。
User Interface（UI）
User Interface
User Interface（UI，用户界面），是系统和用户之间进行交互和信息交换的媒介，它实现信息的内部形式与人类可以接受形式之间的转换。用户界面是介于用户与硬件而设计彼此之间交互沟通相关软件，目的在使得用户能够方便有效率地去操作硬件以达成双向交互。
接下来介绍一下UI的主要设计原则。
UI的第一个原则，是让用户所需的一切都易于访问。在使用软件或者是网页的过程中，无论发生发现了什么问题，可以通过问号图标“？”按钮了解解决方案——为保证用户不在出现问题后关闭网页，而是停留，在界面上给予快速解决常见问题的方式，最终完成软件中所有流程的操作。
同时，要保持一致性。用文字，图标，视觉中的信息，来传达信息和展现内容。常用Icon和文字保持一致，给用户减少困扰，同时，要保持软件和页面的美观性。
第三，界面需要清晰清楚。让用户知道自己在当前页面在做什么，下一步该做什么，上一步做过了什么。比如购物网站，当前停留在购物页面时，点击了加入购物车后，界面一般会提示用户购物车种有多少物品，以方便用户知道自己加入了多少物品，现在正在购买，以及可以直接点击到购物车，进行下一步操作——支付结算。
界面悬浮提示
第四，提供反馈。一般的界面都会有加载或者更新的环节，给到用户反馈，让用户了解现在所处的阶段。在这个环节会出现类似于“圆圈”提示用户下载和更新需要时间，更新所需内存，以及预计什么时间结束。某宝支付成功就是提供用户反馈行为，让用户知道自己现在所处的情况。
支付页面的倒计时提醒
第五，图标使用识别。每个网页或者软件总会有新用户加入，那么对于第一次使用产品的用户，或者在软件更新了新功能之后，设计师应该在一些新的功能上设置悬停提示，告诉用户某软件或者功能，如何操作。
图中的“加号”用来表示添加进歌单
第六，互动方式设定。为避免过多复杂的操作形式，设计师在设计手势操作的时候，应该尽量选择基础动作，便于让用户记住操作方法且愿意使用。有些设计师在设计过程中会特意增加手势操作的复杂度，以彰显软件特色。然而过于复杂的操作，容易让用户感觉繁琐，放弃使用软件，反而这一“特色”变为了累赘。
第七，遵循设计标准。这一点很好理解，每个领域都有固定的一些设计标准，比如放大镜图标就是搜索功能，在这种时候，设计师尽量不要创新，而是运用常规常用的Icon，让用户感觉舒适，不要让用户感觉迷茫。
搜索功能用“放大镜”图标显示
第八，元素层次。通过一系列的颜色对比，或者不同灰度的元素来区分。举个例子，如下图中，紫色为主要背景颜色，设计师用绿色提示用户正在访问的模块。这样不同颜色，有对比度的方式能够保障结构流畅。最简单的例子就是大家可以打开微信，下方的微信导航栏，会变色以告知用户，自己在哪个界面。
最后一点，也是非常重要的一点，保持简单。现在经常提到的就是用减法，减去繁琐的步骤，让用户更加顺畅高效的完成操作。让用户自由和控制，用户随时执行自己想要的控制操作，做选择，随时跳转回上一个页面，甚至预知下一页面所需内容。当然，一些特殊情况，因此，除了官方网络申请表格，例如签证申请单等所需内容非常多且正式的情况外，尽量做减法，让用户少填信息。相信大家看到下面两个图之后，一般来讲都是更倾向于选择下方的表格填写信息，方便快捷。
繁琐的官方表格减法的联系方式页面
综上所述，UE和UI的关系可以这么来形容：UE是一个设计理念，以人为中心的理念，在了解完UE之后，得知用户需求方向。利用UE将UI的信息可视化，以满足用户的需求，帮助用户解决问题。因此，在有些公司内，UE和UI会是同一个岗位，这样会减少一些沟通和人员成本。但对于部分大公司，UE和UI会分成两个岗位，UE设计师更多的会偏向于与程序员的前后搭配上，而UI设计师的工作更多在于视觉上的设计。
东茜13568983179： 绛旓細鍦ㄤ笌搴旂敤绋嬪簭浜や簰鏃舵槸鍚﹁浜轰滑鎰熻鍒颁粬浠湁鏁堝湴瀹屾垚浜嗕粬浠兂瑕佸疄鐜扮殑浠诲姟锛岃繕鏄鎰熻杩囩▼寰堣壈闅俱鐢ㄦ埛浣撻獙鍙栧喅浜庣敤鎴峰湪涓UI璁捐鑰呮墍鍒涘缓鐨鐢ㄦ埛鐣岄潰鍏冪礌杩涜浜や簰鏃剁殑闅炬槗绋嬪害銆傛兂瑕佷簡瑙ｆ洿澶氬叧浜ui涓巙x鐨鐩稿叧淇℃伅鎺ㄨ崘閫夋嫨Pixso鍗忓悓...
东茜13568983179： 绛旓細浜や簰绯荤粺璁捐鐨鐩爣鍙互浠庘滃彲鐢ㄦр濆拰鈥鐢ㄦ埛浣撻獙鈥滀袱涓眰闈笂杩涜鍒嗘瀽锛屽叧娉ㄤ互浜轰负鏈殑鐢ㄦ埛闇姹 銆備粠涓撲笟鍒嗗伐鏉ョ湅锛UX鍜孶I鐨勫伐浣滃唴瀹规湁涓嶅悓涔嬪锛屼絾涔熸湁閲嶅悎鐨勯儴鍒嗐俇I鍏虫敞浜у搧鍔熻兘锛孶X鍏虫敞鐢ㄦ埛鎯呮劅銆俇I鍒欐槸甯冨眬璁捐锛...
东茜13568983179： 绛旓細UI璁捐閲嶅績鍒欐槸鑹插僵銆佹帓鐗堢瓑瑙嗚鏂归潰銆UX璁捐浠鐢ㄦ埛涓轰腑蹇冿紝鍏虫敞浠诲姟娴佸拰浣跨敤鍦烘櫙銆俇I鏄綘浣跨敤鐨勯儴鍒嗭紝鑰孶X鏄湪浣犱娇鐢ㄦ椂鐨勬劅鍙椼俇I璁捐甯堝叧娉ㄦ寜閽殑棰滆壊锛岃冭檻鐨勬槸瑙嗚鐨勯儴鍒嗭紝鏄骇鍝佺湅璧锋潵濡備綍銆傝孶X璁捐甯堝垯鍏虫敞鎸夐挳鏀剧疆鐨...
东茜13568983179： 绛旓細浣滅敤鏉ヨ锛UI鏄皢idea鍙樻垚鍙鍖椤甸潰鐨浜у搧锛UX鏄骇鍝佸拰鐢ㄦ埛鐩稿叧鑱斻傚涔犲唴瀹规潵璁诧細UI涓昏瀛︿範鐣岄潰璁捐锛孶X涓昏瀛︿範鐢ㄦ埛浣撻獙璁捐銆俇I瀛︿範鏄浘鏍囥佹寜閽佺増寮忓拰閰嶈壊绛夌晫闈㈣璁″唴瀹癸紝UX渚ч噸浜庡涔犵敤鎴峰績鐞嗐佷氦浜掍綋楠岀瓑鍋忓ソ璋冪爺鍜...
东茜13568983179： 绛旓細鐢ㄦ埛鐣岄潰璁捐锛圲ID锛変笉浠呬粎鏄仛鈥滄紓浜殑鐣岄潰鈥濓紝鎵浠ヤ笉鍙伩鍏嶇殑浼氭秹鍙婂埌浜や簰璁捐銆傛墍浠ュ箍涔夋潵璇达紝鐣岄潰璁捐鍖呭惈浜や簰璁捐銆備絾鏄幇鍦ㄥ緢灏戞彁杩欎釜姒傚康浜嗐俇ED锛 User Experience Design 鐢ㄦ埛浣撻獙璁捐 鐢ㄦ埛浣撻獙鏄釜浜轰富瑙傛劅鍙楋紝浣嗘槸鍏辨...
东茜13568983179： 绛旓細UX璁捐甯堢爺绌跺拰璇勪及涓涓郴缁熺殑鐢ㄦ埛浣撻獙,鍏虫敞璇ョ郴缁熺殑鏄撶敤鎬с佷环鍊间綋鐜般佸疄鐢ㄦс侀珮鏁堟х瓑銆 涓句釜渚嬪瓙:鎴戜滑鍘婚摱琛岀殑ATM鎻愭鏈轰笂鍙栭挶,鐪嬪埌鐨鐣岄潰鍜姣忎竴姝ユ搷浣滄暟鎹UI璁捐銆備絾鏄浣曞瓨閽?濡備綍鏇存敼瀵嗙爜?濡備綍杞处姹囨? 鈥斺旇繖浜涙祦绋嬬殑璁捐灞...
东茜13568983179： 绛旓細璁捐浣犲湪澶栭潰鐪嬪埌鎵鏈変笢瑗块兘鏄ui璁捐甯堢殑宸ヤ綔銆傝繖浜涢噷闈㈠寘鎷鑸寜閽拰鍏朵粬杈撳叆鎺у埗銆傚彟涓鏂归潰锛ux璁捐鍒欏叧娉ㄤ笌鎻愪緵缁欑敤浜鐢ㄦ埛浣撻獙銆備粬浠В鍐鐣岄潰鎵甯︽潵鐨勬劅鎬т綋楠屻備换浣曟椂鍒荤敤鎴峰湪鍜岀晫闈氦浜掓椂鐨勪綋楠屽氨鏄痷x璁捐甯堢殑宸ヤ綔銆備粬浠槸...
东茜13568983179： 绛旓細杩欏寘鎷椤甸潰甯冨眬锛岃繃娓★紝鐣岄潰鍔ㄧ敾鍜屾瘡涓涓井灏忕殑浜や簰缁嗚妭銆備换浣曠被鍨嬬殑瑙嗚鍏冪礌锛屼氦浜掔粏鑺傛垨鍔ㄧ敾閮藉繀椤荤粡杩囩簿蹇璁捐銆傗UX鈥濅唬琛ㄢ鐢ㄦ埛浣撻獙鈥濄傜敤鎴峰搴旂敤绋嬪簭鐨勪綋楠屽彇鍐充簬浠栦滑濡備綍涓庣▼搴忚繘琛屼氦浜掋備綋楠屾槸鍚︽槸娴佺晠鑰岀洿瑙傦紝杩樻槸澶嶆潅...
东茜13568983179： 绛旓細UI鏄皢idea鍙樻垚鍙鍖椤甸潰鐨浜у搧锛UX鏄骇鍝佸拰鐢ㄦ埛鐩稿叧鑱斻傚涔犲唴瀹 UI涓昏瀛︿範鐣岄潰璁捐锛孶X涓昏瀛︿範鐢ㄦ埛浣撻獙璁捐銆 UI瀛︿範鏄浘鏍囥佹寜閽佺増寮忓拰閰嶈壊绛夌晫闈㈣璁″唴瀹癸紝UX渚ч噸浜庡涔犵敤鎴峰績鐞嗐佷氦浜掍綋楠岀瓑鍋忓ソ璋冪爺鍜岄棶棰樺彂鐜扮殑鑳藉姏銆...
东茜13568983179： 绛旓細杩欎釜璁捐濂戒笉濂斤紝浜や簰閫昏緫鍚堢悊涓嶅悎鐞嗭紝缁撴瀯娓呮櫚涓嶆竻鏅帮紝椤甸潰鍔熻兘灞傛琛ㄨ揪鍚堢悊銆UX瀹氫箟浜嗘洿澶氱殑浜у搧鐩爣娴佺▼锛孶X瑙ｅ喅浜嗘洿澶氱殑浜у搧娣卞害锛UI鏄骇鍝佺殑瀹藉害锛屼袱鑰呴兘寰堥噸瑕併備簰鑱旂綉琛屼笟鍙戝睍浜嗚繖涔堝骞达紝鐢ㄦ埛浣撻獙宸茬粡铻嶅叆鍒版垜浠殑鐢熸椿涓...
