KPN奇宝团队除了提供数字营销的服务外，我们也有独立的研发部门，希望走在客户前面，提供让营销成效更好的各种工具或服务，我们历年来开发过的产品真是族繁不及备载，今天要分享的就是我们在产品开发的时候收集的一些UI设计小窍门，快来查看你的网站流程有没有和我们一样努力优化吧！

＊ 让用户能预期接下来的步骤  

告诉用户他要完成这件事总共需要几个步骤，这些步骤分别需要做什么事。目前已进展到哪个步骤，之后还有几个等等。让用户知道自己现在在哪里，也能够让用户创建对这个网站的信任。(能应用的地方像是新手教学、结帐流程等地方)

＊ 提供项目哦明或解释

有些名词你可能觉得很简单易懂，但用户并不一定知道，因此需要一些文本解释来协助他们操作。(你知道页签名称、网页代称、mata description是什么吗？如果没有解释，你是不是一头雾水不知道我在说什么？这些都是我们在写后台文案的时候，碰到需要解释的项目名称，记得写完一定请其他人先看看，确定说明够清楚能了解再放上去喔！如果文本怎么讲也讲不清楚，咖图说明也是个很好的选择！)

＊ 马上确认数据的正确性

你有没有遇过填了一长串的表格，点击送出后才告诉你第一行数据填错了，又得上卷半天回去重改，甚至要全部表格重写的经验？为了避免浪费用户时间或让他们不耐烦，最好是每填一项就能马上检查是否有错误，若有错误马上显示警示在旁边，用户就能在第一时间改正。

＊ 让用户能直接操作！

举个例子，在Gmail的收件匣里面，如果你想删除一封邮件、首先你得先把他打勾选起来，再找到垃圾桶的icon按下去，如果想标示为已读的话，还要先点「更多」，再选择标示为已读。但如果今天只要你的鼠标滑到邮件上时，就会显示删除或标示为已读的icon，让你可以一个click就完成，是不是更直觉更方便呢？

＊ 给与用户操作的回馈

用户完成任何任务都要告诉他，他做对了吗？成功了吗？错误的话错在哪里？否则用户就会不知道自己是否完成了这件事。回馈不仅是弹出窗口的告知，也包括，鼠标滑过后变色、点击后变色、上传图片后有示意缩略图....等等，每一个微小的步骤都很重要喔！

＊ 操作的接口要有一致性！

千万别让用户不知道如何使用你的接口，理想的方式是icon的样子、位置、叙述尽量要跟大家已经熟悉的产品相似。(例如删除的icon大家一般会用一个垃圾桶，不会用一个齿轮。)而在你的产品中，icon、操作方式、用色、甚至说明的语气，也都应该要有一致性，除了能营造你整体的产品个性，也能让用户不需要反复学习。

＊ 点击区，岂止于大！

别让用户为了点个按钮，输入个数据还要瞄准半天，把能够点击或操作的区域面积加大，操作会容易许多！(尤其是放到手机上的时候，务必确保按钮长宽至少要有45px喔！)

＊ 显示有用的信息  

在收件匣显示状态是未读还是已读，订单列表显示已出货还未出货，帐单列表显示已付还未付，提供一些可以让人一目了然的有用信息，不要仅仅是显示列表。

＊ 是的这一切都是为您！

就算你开发了非常强大的商品，也别只顾着说自己很厉害产品很棒，试着转换立场，告诉客户你是为了他们而开发，你希望他们更好，所以这个产品能够帮助他们解决什么问题，他们用了之后会变得多么好，这产品就是为他们而生。多多运用您、你，而不是一直强调我们如何如何。

 好的，以上是我们在开发中挣扎、讨论、坚定向前走的UI设计，参考了许多上的分享，大家有空也可以上去看看喔！