前言

UI 跟 UX 是两个完全不一样的东西，以工程师的角度简单来说，
UI 是美术视觉看得到的，
UX 是了解使用者的理解後改善体验，
详细的定义请搜寻网路上的各种介绍，
一般小公司不太会有 UX 设计师，但不管大小公司机会都有 UI 设计师，
这两种身份职责不同，对我们工程师来说，实作的范围也不同，
UI 是每一次做功能的时候，UI 设计师都会给我们设计稿，让我们照着设计刻，
UX 设计师说话的时候可能就很恐怖了，可能是改页面间的动线、页面里放的资讯等，可能会需要大大改动 app 的架构。

Android 官方

官方的 design guidelines：Design for Android。
这里面非常的详细，从基本的颜色、界面，到手势、动画、甚至声音都有规范，
里面也有大量 do 跟 don't 的范例。

业界常用 UI 设计工具

最常用的工具：

• Sketch
• Figma
• Zeplin
• Adobe XD
• 还有很多。
  不需要自己会做，可以载别人的设计档来练习照着刻。

培养与练习

可以搜寻"ui 设计 网站"，有各路 UI 设计师整理了界面、元件、颜色、交互相关资讯：

很多网站都有提供上面介绍的设计工具的档案，
但可能会发现有很多的设计美得夸张，非常难以实现，
不用太过担心，这是理论上，但实际在公司运作的时候，
不管是开发时程、不同平台使用习惯及其官方的 design guidelines 等考量，
一般是不容易看到这麽浮夸的画面，这点可以下载几个知名 app 就能知道了，
另外，临摹一个既有 app 也是很好的做法，但需要有针对性，比方说：

• 电商：塞，尽量塞很多东西。
• 音乐、娱乐：缤纷、互动、有趣。
• 时刻表、比价等大量文字资讯的 app：思考如何设计的简单乾净又不失方便。

拿到设计稿後要注意的东西

• 框线
• 阴影
• 圆角
• 字型
• 还有前面每一项的大小、粗细、颜色、与四周的间距等。

这还只是基本的，
看不到的地方还有：

• 内容太多、太少会不会跑版。
• 从系统改变字体大小、字型、界面大小。
• 不同解析度的装置。
• light / dark 模式。
• 无障碍（视障）。
• 新旧页面是否一致，如果改动新页面的元件，旧页面会不会很丑。
• 等待、空、重试、错误、还有各种商业逻辑的状态。
• 还有非常多的细节。

结语

很多时候，做出了一个功能并不是让我们最开心的地方，而是画面很美也很好用，
在公司里，会有专业的设计师出设计稿给我们，
我们只要照着实作就可以，但平常还是要培养一些美感、流行以及设计规范，
公司的设计师经常是拿 iPhone，他们不见得会去追 Android 新的设计规范，
这时候我们就要出面沟通了。