4个专业手法，教你打造高成交网站！设计出符合商业行为作品
时间: 2021-04-26 09:47 来源: 深圳诺仁 作者: admin 阅读: 次
UI UX设计有什么差异?4个专业手法，教你打造高成交网站！
UI UX设计有什么差异?想知道设计师是如何从无到有，设计出符合商业行为的作品吗？我从事电商行销7年中，不断思索、研究要如何提高网站的转换率，对于色系的要求、目标客户的想法，做了很多的研究，随着时间的累积，最后打造出了年营业额1.6亿的跨国电商品牌（我们的故事），诺仁技术在设计或更新网站时，我都会跟工程师、设计组、业务部开会讨论，结合多方的意见并持续修正后，才能打造出高成交的电商网站，下面将分享我们的思考流程与方法：
UI UX设计有什么差异?
在电商销售中，我们不只要顾好页面的设计感、商品的呈现美感，更重要的是还要设计出能够让你的目标客户感到心动的网站，并提升品牌形象达成购买，因此在设计界中常常会有两种设计任务，分别为UI、UX设计领域，由这两者专业的思维与研究做结合，才能真做出会让人心动的网站，要成为好的设计者并不用天生生下来就是，可以透过后天不断的练习、进修，从多年累积的错误中学习与成长，最终你也能打造出让客户觉得你很懂他的有趣网站！
1.UI设计
UI设计全名为User Interface，又称为使用者介面设计，主要是在外观的美化、网站的美感、照片的选择、按钮的呈现手法、色系的搭配…等外观为主的设计，要如何深化这方面的能力，首先你必须先了解以下几个设计的基本原理，才能打开的你设计思维，创造更有创意的内容：
1.颜色
颜色能呈现出语言，就像香蕉黑了，你会知道他快坏了，钢铁变咖啡色，你知道他生锈了，用对颜色可以让客户感受到你想表达的意思；另外颜色心理学，也能表达出情绪，对于黄色，会让人感到重点、兴奋，在适合的地方加入对的颜色，可有效促成客户按下按钮的冲动。
2.平衡
图片、版面、颜色的对称与文字段落的对齐等，都能使人感到安全、放心，做网站很重要的是要营造出让人安心的感觉，不要有太多不平衡的配色、配置，让人感到安心，才敢继续购物流程。
3.对比
人类的眼睛喜欢看对比的东西，不管是颜色的对比、图片的对比或是文字的对比，都能使人更聚焦在你想强调的主题上，能让你的资讯更加强烈，促成人们产生行动。
4.文字排版
工整、整洁的排版，能让客户不会那么痛苦的观看你的文字，来吸收你的资讯，对于文字的密度、标题的内容、字型，都必须依照主题做好适当的调整，并且避免过度长且连续的文字，才能让人们更轻松的把你的内容看完，产生购买意愿。
5.一致性
一致性的设计重点在直觉，这在设计中非常重要，如果你的产品很多，则建议每项产品的页面都保持一致的排版，能让客户更快速地了解你的产品，连结按钮的颜样式统一，也能让观赏的人更轻松的了解哪些功能该如何操作，人类的身体本能是在不断在寻找平衡，你的网页如果提供一致的风格，能让人感觉放心且安全，更愿意品尝、观赏你的网站。Design principle: Consistency
这里有些UI设计网站该做与不该做的介绍，会对你的网站设计创意更有帮助！
2.UX设计
UX设计,全名为User Experience，又称为使用者体验设计，除了有美观的设计外，我们还需要设计出符合使用者习惯的功能，UX的精神重在找出目标客户的问题，并提供解决方式，你可以透过大量的使用者体验记录、问卷调查、换位思考、或是以JTBD表格辅助，找出你目标客户(Persona)的共通点，假设我今天的目标是家庭主妇，那么我就要想家庭主妇可能视力会没那么好，所以网站的字体要比较大、网页要单纯不要有太复杂的功能、按钮要够大、缩小到手机介面时要让文字符合阅读大小…等的问题进行修正，你可列出类似下面的问题清单，把自己想成消费者提问会碰到哪些问题
接着你可以将你的解决方案用User Jurney Map(使用者地图)呈现，构想客户在哪一个步骤会碰到什么问题？哪一步骤跳出哪个连结，能够增加他的顺畅度…等
另外，你也可以使用Double Diamond model (双钻石模式），探索目标客户的痛点
双钻石模式起始点是从最左边的Trigger引发点开始的，你的目标客户会碰到一个问题，接着你会开放式了的去解这项问题Underetand，再来缩小定义这些问题Define，作为可达成的目标和计画Vision & Plan，接着开放式探索Explore解决这项问题的方法，并通过学习Learn、建立Build、测量Measure逐渐除错，最终建立Create这项问题的解决方法，完成问题解决Solution，你可以从双钻石模式的思维中获得更有创意的解决方法，让你的目标客户感到你的用心，重视使用者体验细节的设计网站，会让你更容易达成电商购买！
3.其他细分3种设计师
在一些比较大型的公司中，会分别对UI UX设计部门，再细分成两种职业的设计师，分别如下：
1.视觉设计师
任务：对于各种画面的美感呈现，与文字编排细节做更细致的编修，视觉设计师聚焦在画面的完整度，常常会再放大检视每项作品的大小部件是否有问题，这项工作其实UI设计师也可以完成，不过我想大公司将其拆开来检视，最主要应该是为了给UI设计师不同的灵感激发，也算是外部考核的一个动作。
常用的工具有：Photoshop、Sketch。
2.互动设计师,又称做动态设计师
任务：大公司常常需要设计大量的APP，里面的选单跳出画面呈现、图案出现方式、点影片跳出小视窗..等动画，就是他们的工作，网站或APP中有了动态设计，会让页面呈现得更活泼、且时尚，我也很喜欢在设计的网页中加入互动选单或是图片Fade in的功能，让网站不会这么死板，这项工作也可以由UI设计师完成，不过如果需要有复杂的动画呈现，就需要专门人员用CSS语言进行编写。
常用的工具有：AfterEffects、Composer、Core、Origami、Flash。
3.UX研究员,又称为使用者研究员
任务：研读大量的市场资讯、消费者回馈问题、实际访谈..等客户的使用感想，为使用方式作出完整的解决方案，不管是网站还是产品设计，最重要的就是提供客户价值，帮客户解决某个领域关键的痛点，所以由专门的人员描绘出精准的客户Persona样貌，能够让后续的设计更精更准！
以上三项就是UI UX设计系分的人员任务，与专业负责事项，各位可以斟酌对各项任务列出专案追踪每个阶段的成效，并通过不断的测试，看看网站的转换率是否有提升，或是跳出率有下降，你可以在网站安装GA工具，对网站进行深部的研究与调整，相关连结：GA是什么？
4.训练你的美感
恭喜你了解了UI UX这两项专业设计师都在用的设计原理，今后能让你更专业的设整理出好的网站，不过只有单单了解原理还不够，想成为好的设计者，你需要的是长时间对设计知识与美感的累积，你可以透过大量观摩各种网站的制作方式、视觉呈现图像学习，并且长时间训练你的眼睛去看各种设计，想像如何去改善看到不好的设计，就能慢慢训练你的美感，现在网路很发达，你可以找一些设计相关的网站：比如Dribbble，在上面看到些很棒的作品，可以先搜集起来、慢慢累积，未来有相关案件时就能够使用，透过这样不断的练习与搜集，你才能知道哪个设计做得好，哪个不够好需要再提升。
下面推荐些我也很爱看的时尚设计网站，鼓励大家多多上去看那些作品：
onepagelove.com 大量的一页式网站作品。
awwwards.com 许多获奖的网站作品，能给我很多灵感。
dribbble.com 很多设计师分享的作品。
pttrns.com 手机介面设计的相关作品。
uimovement.com 有大量的UI设计作品，很酷的网站，能用老外的创意呈现美感。
一直以来诺仁技术在设计网站都是用上面的方式进行，碰到灵感匮乏时，我们会去国外的网站搜集资料吸收灵感，并和网站工程师、设计部、业务部三方的资料讨论，来达成真正能满足目标客户喜好的网站，想找诺仁技术设计精致的网站，也可以查看我们的服务。
