你见过程序员设计的 UI 吗

前言

大家好，我是一名全栈程序员 👨‍💻

全栈也可以理解成“全干”🤷‍♂️

因为公司实在是...太抠搜了 🤏

于是让我一个人开发完整的 app

美其名曰 “为了锻炼你”

实则是出于实现 MVP (最简可行产品) 拿去市场试试水 🤦‍♂️

于是就有了以下设计 UI 的这段经历

（各位大神不喜勿喷，我是很清楚地知道自己不会设计的）

都说万事开头难

一开始呢，我以为对于我这种 UI 设计零基础的人来说，灵感都是突然乍现的

于是便有了以下初稿 👇

但其实脑中没点积累而且缺乏大量的练习，是不可能做到凭空产生好的设计想法

然而就是这玩意儿，当初根据这个 UI 竟然糊弄过了投资人 😂

估计投资人是一点也不懂技术的

(由于当时不懂事，旧版本的设计图基本被我删完了，从没考虑以后还可能用到，肠子都悔青了 🤢）

踏出第一步之后也很难

虽然领导和投资人对界面都没什么意见

但是作为阅 app 无数的人来说 😎

我深知这样的 UI 绝对是很差劲的

我也不是说想做到多好，毕竟做到我们认为的“一般”其实也不容易

而现在就是要达到“一般”的程度

为此我拜读了一些关于程序员全干开发的书籍

了解独立开发软件的完整流程

现在有了大概的方向，验证了基础功能可行之后，接下来就是从先完成到”完美“的过渡

（图片源自《奔跑吧程序员，从零打造产品、技术和团队》)

先是设计低保真的设计图

（设计是设计了，但是后来设计是直接覆盖之前的 psd 文件，而且也没导出 jpg，这里就展示不了了）

然后基于低保真设计图设计稍微高一点保真的 UI

（以下内容可能引起专业人士不适)

设计的过程并没什么设计规范，估计专业人士看到一些间距、大小会强迫症犯了

设计全靠模仿网上搜到的案例的那种感觉，有时调调间距和大小感觉会很令我惊喜

似乎是有稍微那么一点点一丢丢像样子了

而且途中顺手设计了一下 app 的 logo

（眼睛: 意味着传感器；右边 wifi 信号: 物联网；蓝色: 科技的颜色；眼睛中心的芯片引脚: 硬件，芯片；投影: 模仿 13 年流行的app设计；）

正当我 🐮B 哄哄地把这一套设计展示给领导看时 👇

我以为他会很满意，因为他一开始可是什么要求都没有的呀

谁知道他突然灵光一闪，和我说这不符合他的预期

what?? 😐😑😣😫😖😭😱💀

他说想要科技风，好像钢铁侠，那些好莱坞大片...

我陷入了沉思，领导说得都对，我还能说什么 🙄

于是当时这个设计稿软件界面搭建到一半就停了 👇

接着开始第三次折腾 😥

生活就是难上加难

做设计的朋友们应该经历过重新设计的这种炒蛋的事

往往只能默默地擦擦眼泪继续前行

仔细想一下领导给的需求

乍一听钢铁侠和好莱坞大片的风格，好像毫无头绪，因为这个概念太抽象了

结合我们是做科技类的产品，那他应该是想要科技风 

结合他想让我做的 app 突出的是数字化，那他应该是想要那些大片里展示数据的形式

符合这两点的大概是那种大数据大屏展示的风格吧

于是我找了几张大数据的图片和领导确认，验证了我的推断 😬

风格确认了，接下来就是开搞

好像还不赖

改了颜色之后实际的效果图 👇

这一个页面当时设计得自我感觉还挺良好

直到我设计后面其他页面时发现了大问题——组件复用时会特别不合适

可能是我菜吧，怎么设计都觉得很吃藕

而且设计中只有“线”和“面”，缺少“点”

画面中的主色调太亮了，不适合分配给这个颜色太多的面积

痛定思痛，还是把之前的稿子废了 😢

接下来设计要考虑的就是利用好点线面的分配

不同饱和度的颜色的占比

于是有了目前的版本 👇

加上个别实际的效果图吧

（用模拟器跑的，实际拍平板的话屏幕反光很严重）

再多的图就不放了，因为虚拟机连不了蓝牙，总的来说基本 99.99% 还原了设计稿

目前领导还是挺满意的，看来近期是不用加班了 😏

此项目最终是不会上线 app 市场的，因为这是偏工业行业的，所以大家不用去搜了 😁

另外也感谢领导给我这个机会，让我真的体会到了全流程的项目开发

（需求分析->可行性分析->接口文档编写->服务器架构设计和代码编写->运维-> android 端架构设计和代码编写 -> ui 设计->测试 等等等等)

每日的日常就是处理好每个部分的问题，然后自己联调，在各个类型的软件反复横跳 🏃‍♂️

差不多一年的时间就做了这些事，虽然很多都没精通，但是最近有了开发自己产品的想法，有了这些经验再继续看书学习应该可以实现自己的想法 💡

不过到时候就会组建团队，把 UI 外包给专业的设计师了，就是不知道站酷的大神们怎么个收费法 😸

写这篇文章的时候省略了一些细节，比如我并不是完全的设计小白，大学的时候做过平面设计也拿过学校的一些设计相关的奖项，但是我是真没设计过 UI，整个体验起来还是很不一样的；还有就是看书的途中我也找了 UI 设计的课程大概看了一部分，因为做到现在的程度已经满足我的需求了，时间只能花在刀刃上，所以没再深入学习 UI相关知识，据我了解设计 icon 好像挺麻烦的 😂

最后，感谢你看到结尾，也感谢你的手下留情。今天国庆节，祝祖国生日快乐！