Listify

Listify是一款界面非常简洁的todo类应用，你可以将日常要做的事情通过软件记录下来，然后根据时间段安排你的工作内容。这款软件可以通过手势操作，并且还附带一个 3 天开发 Listify 的故事。

软件介绍：

Listify 通过卡片显示不同的任务分类，点击卡片名称可以收缩、扩展，添加时选择不同的分类就用不同的颜色，左滑编辑、存档，下滑新建，这些都是非常常见与传统的手势。

但是，为什么没有右滑完成？虽然屏幕右侧的原点代表了是否完成，但是滑动表示完成不也是顺理成章么？右滑手势居然不存在…

开发者在为不同设备适配界面

软件开发历程：

原型设计

想要设计一款App那么肯定不能直接打开开发环境动手写，至少需要知道这个App有什么功能，最终我决定实现一个可以创建多个分类列表的todo list，然后标记完成了哪个任务就把那个事项清除掉，就这么简单，两句话就把功能需求讲完了。

那么接下来，为这个App取一个名字吧，取名字的过程我们想了很久，因为很多GTD应用的名字都大同小异，xxlist，xxtodo，xxdo。想了一些时间最后将这款App命名为Listify，是List + ify 英文后缀，意思是将一切待办列表化。

有了名字，那么在开发环境上就可以建立项目了，不过在此之前，得先有一个大概的设计吧，于是我打开Sketch，画出了App的第一张原型设计：

整个界面背景为淡灰色，每一个List用一个卡片实现，不同的卡片拥有一个不同的主题颜色加以区分，底部打上了很宽但是很浅的阴影来和背景区分并且产生立体的效果。卡片里就是待办事项，完成的事情会变成淡灰色并且划掉，右边的CheckBox会被选中。很简洁的设计。

交互设计

这样的界面是很简洁，也很好看，不过交互就成了问题，我以前开发的App都会给用户明确的交互，按钮是我常用的控件，但是设计成这样很难再去添加一个按钮了，在Android的设计规范中中是有右下角的一套 Floating Action Button （FAB）可以用，但是加上去又会破坏整体性

那么只好用手势了，在移动应用中上拉一个列表执行添加或者刷新操作是很常见的，所以上来添加新的todo的交互就定下来了，刚好iOS自带组件有一个UIRefreshControl组件可以轻松实现 （是的，懂开发的设计师就是不一样，从来不在设计上给自己挖坑）。

那么既然交互和原型设计都做好了，直接打开开发环境来实现这个App吧！

开发

“定实现一个可以创建多个分类列表的todo list，然后标记完成了哪个任务就把那个事项清除掉”，这是我在原型设计上写到的，当时给我的感觉是，好简单啊，我只需要实现一个两张数据表的数据库然后去读数据然后就能把那个主界面绘制出来啦，估计从9点写到晚上一两点就能实现一个能用的东西了，毕竟我也独立开发过比较大型的应用，写个这个对我来说不是很困难，明天就能交差了。

于是我花了2个小时才实现了主界面的大概样子。。从空的卡片，到加入主题标签，到加入待办任务，并且，这样实现的界面还不是动态的。

并且，我远远低估了这个项目的规模，这个App听起来很简单，列表，待办，就这两个东西。

学过数据库的同学都知道，一条数据，拥有增删改查（CRUD）四个操作。

想要有一个新的todo列表，就得去创建他，想要创建，那就得再写一个界面，还要搭配删除和更改的操作，待办事项也是一样的，也得再去实现一个页面。并且这些东西都有了，那总得有个设置界面吧，于是又多了一个界面吧。这么多待办事项，删掉了总得归档吧，那归档又得再多一个界面，就是这样，需要实现的界面一个一个多了起来。这真的是跪着写了。

不断增加的功能

好的，既然要实现这么多界面，那我还是好好写吧，写一个可以上架的应用好了，那么原本这么点功能就拿不出手了啊，别人家的App都有通知功能，我没有那不是很不好意思。一个列表的任务总得可以排序吧，于是数据库里又得多一个字段。

在添加功能的同时，设计也在不断地变更，下图左边是一开始的添加Todo设计，主色为黑色，选择不同列表的地方使用各自列表的主题颜色，但是后来发现，因为列表的主题色很多，所以很乱，就改成了右边这个选中一个列表的时候整个界面跟着主题色变得方案。

在todo列表添加界面也做了相同的设计，并且为todo列表管理单独做出了一个界面用来排序，编辑和删除。

后来觉得要是在主界面不想看的卡片可以折叠就再好不过了：

就这样，原本的界面功能在增多，又有更多的新界面需要设计出来。还有就是交互上的方案的增加，在主界面中根本没有地方放下一个设置界面的入口，思来想去最后选择了用两个手指来捏合（Pinch）屏幕来进入设置。并且，摇晃手机可以清除掉已经完成的任务。不过这样的交互必须有人提前告诉你才行啊，要不谁会知道呢？

于是，在实现了这些功能之后，时间已经过去了两天半，远远超过了我五个小时拿出一个可以用的原型的预期。

图标

App快做完了，我也准备把他拿来日常使用了，那么没有一个图标可不行啊，于是又花了一点时间想图标，最后选择了倒数第二个

用户引导

前两段段最后提到了一些很难想到的交互，于是第一次启动的用户引导界面就成了重要的一环，虽然这个环节开发写的代码很少，但是要画好多图倒是真的。

汉化 & 测试

为了防止有的用户因为没有中文给差评，所以多语言也是必要的。

在最终发布之前还需要在不同的机器上去测试确保界面适配没有问题。