第一步：制作产品原型

不懂开发的人可能觉得软件产品就只是程序员埋头吭哧吭哧搞出来的，但编码其实只是其中一个环节，并不是全部。你可以把产品原型理解为房子的设计图，简单的房子可能不需要设计，但稍微复杂一点的，都是离不开图纸的。

有些程序员想自己做个东西，也不需要和别人协作，觉得这个麻烦，就跳过这一步了。但我建议最好还是先做出原型来，它不仅可以帮助你把头脑中的想发快速呈现出来，更重要的是，在你设计原型的时候，你已经把产品在脑海中做了一遍了，这样对你在后面进行软件的模块设计的时候是有极大的好处的。

这里推荐几个做 App 产品原型的软件：墨刀、Axure。如果不是特别清楚原型是什么东西的话，可以到墨刀的讨论区去看看，有一些分享的作品。

第二步：产品页面设计

这年头颜值越来越重要了，对于大部分开发者来说，可能做不到设计惊艳，但是要做到简洁大方并不是一件很难的事情。

秘诀就是要统一，统一好颜色、字体的使用场景，这样出来的视觉效果一般不会很差。

这里有篇文章介绍了设计规范的内容，你可以去参考一下：APP界面设计规范编写指南。

还有一个就是图标的问题，阿里巴巴图标库有非常多图标，一般App都够用了。

一般来说，如果是我自己开发的应用，很少去动手设计页面，都是直接用一套成熟的设计规范，然后对着产品原型来动手编码了。比如 App 的就可以使用谷歌出品的 Material Design，后面提到的 Flutter 就已经内置了 Material Design 的 UI 组件了。

如果你要自己动手设计页面的话，在 mac 上面我推荐使用 sketch 。

接下来就可以考虑开始动手干了。首先我们要先定一套技术方案，一般来说，我们做一个普通的App，需要搞定的东西有除了手机App，还有相关的API服务接口。

如果你要两个平台都各做一个，那开发成本将会非常高。我建议你考虑直接采用跨平台的技术，比如Google 的 Flutter （Dart语言）或者 Facebook 的 Reactive Native （JavaScript语言）技术。

当然你要先调研一下你要做的产品在相关平台下实现有没有可行性，这方面可以咨询一下相关的技术专家。也可以按照经验原则，你在别的App看到的功能，一般都能实现。

无论你使用什么技术，一般来说在 App 端需要做的事情一般不外乎编写页面，编写交互逻辑和数据通信，一般采用HTTP协议。

还有一个值得分享的经验是要以官方文档作为主要参考和学习材料，资料够准确，你也会慢慢就能快速索引到相关知识点。遇到一些不懂的知识点要善于Google 或者百度，一门相对成熟的技术，网上都有很多资料的。

如果说App是可以看得见，摸得着的前端，那 API 就是看不到的后端了。这一块的技术就更复杂了，你的App用户是1000人，1W人，100W人，后面系统的设计复杂度是完全不一样的。当然，这里不去讨论负载均衡、分布式设计这些复杂的东西，当前我们能搭建一个简单的web服务就好了。

虽然我自己用 Java 比较多，但如果你是刚开始接触后端开发，你可以试一下 expressjs，上手很快，对于简单的接口开发是足够啦，语言是 JavaScript，刚好你可以结合一下使用 Reactive Native 来开发App，降低了不少学习和开发成本。

这个是用来方便你后面运营App用的，比如要录入一些资料，管理用户等。要完成这个，在懂得写接口的基础上，你还要学习怎么编写网页。

如果你前面的事情都能搞定，那 HTML 和 CSS 这些对你来说就是小菜一碟了。如果你还有精力的话，你可以顺便把 vuejs 也看一下，这里推荐一个后台模块：vue-element-admin。

如果实在学不动了，也可以用 boostrap + jquery 来搭建一套视觉还不错的后台系统。

到此，你的 App 就算是完成了，测试和上架那些就不提了。推广和运营又是另外一个话题了，有机会再聊。

本文由 Agile Studio 工作室原创，转载请附上下面链接：http://blog.nowait.xin/Learn-To-Build-An-App/

关于我们：

我们是一支由资深独立开发者和设计师组成的团队，成员均有扎实的技术实力和多年的产品设计开发经验，提供软件定制服务。