用Power Point画界面设计图——在Web原型设计工具上“另辟蹊径”

    毕业设计选了一个开发类的题，老师要我先做原型设计。

    四处搜罗工具，无奈专业工具用起来繁琐，简单的工具又功能不行。不想在界面设计上花费太多时间，最后发现Power Point很不错。由于平时用得也比较熟悉，做起来很是得心应手。

一、确定大体结构

    前期已经明确，这是一个后台管理系统，老师也很中意vue-element-admin的界面风格，于是就决定套用其中的导航菜单也页面布局。

    首先：按照自己的需求修改vue-element-admin中的router部分的代码，完成基本的导航栏部分。

    然后：运行，截图，将截图放置在PPT新建的页面上。如下图所示：

    很多原型设计软件，零基础去画，光这个导航菜单就要花费大半天的时间。如此，利用代码生成导航栏，免除了重新画的烦恼、对程序员的审美要求也不高。

    同理，后面很多图表也可以采用这种编码再截图的方式。毕竟，比起画图和设计，写代码还是更熟悉一些。

 

二、逐个完成页面

    有了菜单导航栏，剩下的部分就是往页面里面加东西了。

    比如，在这个“概览页面”，按照老师的需求