在从事多年编程,参加数十个项目之后,在这里写下小小的开发项目的流程心得。
都说最好的理论就是实践,这篇文章不单单是长篇大论,在写的同时我会创建 Hexo-note 这个项目来实践文中所说的每一点。给大家做个参考。
以下这点每个软件项目基本的开发过程:
需求分析 -> 详细需求 -> 原型设计 -> 测试原型 -> UI 设计 -> 开发
需求分析:
第一步先有个项目抽象的想法,然后对这些想法进行讨论研究,并对其进行可行性分析
首先介绍以下 Hexo.js 它是一款基于 Node.js 的静态博客框架,使用 Markdown 写作,可以方便的生成静态网页托管在github上。
Hexo-note 是基与 hexojs 开发的一款桌面软件,可以创建、编译、删除、发表文章。github 地址
详细需求:
有了初步的想法之后现在需要把这些想想法具体化,把他们拆分成一个个小功能,罗列出每一张清单
- 获取 hexo 当地地址
- 获取文章(区分草稿和已发布)
- 新增文章
- 编辑文章
- 删除文章
- 可以启动 Hexo 服务器
- 软件偏好设置 – yml
- 一键编译、发布博客
- 操作日志记录
- 自动保存文章
- 多语言
- 显示文章分类
- 显示 Tag 分类
- 强化 mk 编译器,
- 工具栏:黑体、斜体、下滑、H1 - H6、图片、本地图片、read more
- 可自定义工具栏
- 预览
- 黏贴 imagen: 在 post_asset_folder
- 打开文章的图片文件夹
- 搜索文章
- 标题
- 按分类
- 按 Tag
- 热键
- 保存 cmd + s / ctrl + s,
- 黑体 cmd + b / ctrl + b,
- italic cmd + i / ctrl + i,
- h1-h6 cmd + [1-6] / ctrl + [1-6]
原型设计:
根据以上的需求对app 进行功能规划,页面布局和每个页面之间的切换逻辑。
原型设计可以用软件比如 墨刀 或者可以用手画,这里的主要目的是把我们的想法和需求视觉化
为了不放太多图,在这里上次一张主要的图片:
测试原型:
这一步就是简简单单的按照原型设计想象以下产品完成时候的运作,看看是否符合产品需求。在参加多了项目之后发现很多产品经理会忽略这一步,个人认为这一步很重要,越早找到问题处理的成本就越低。
如果你是做外包,建议和客人一起确认一下!一起确认!一起确认!(重要的事情要说3次),很多时候我们在写需求的时候我们以为的和客户以为的大多都不是同一个软件 (这是在我在几个项目付出惨痛的代价才懂的)
UI 设计:
在这里我们需要设计师根据产品的原型进行精心的设计,尽可能的与最终产品一样。
( ¬ ¬ ) :别找了缺经费没图
在的大多数的小项目里为了节省经费美工是不存在的,很多时候都是靠产品经理做 UI设计 (咳咳。。有些做的还不如原型图好看)。
开发:
下面进入到最有趣的过程了,撸起袖子开干之前我们需要定义的几点
平台:
在这里我们需要知道项目将在那些平台上运行(手机、平板、网页、桌面。。。)
Hexo note 只考虑桌面
架构:
设计软件整体的架构(比如:前段如何和服务器的对接)
TODO
确认每个平台使用技术:
每个平台都有每个平台的技术和框架,在这里需要每个平台的成员对其达成一致。建议在这时候技术人员按照项目的需求去找可能会使用到的资源
Hexo note 使用:
- 框架: angular6 + electron
- UI / 设计: ng-zorro ant design
- Icon / 图标: font awesome
- Editor / 写作框: code mirror