美文网首页
像周杰伦一样做'音乐'之绘制系统原型技巧分享

像周杰伦一样做'音乐'之绘制系统原型技巧分享

作者: 中正技艺 | 来源:发表于2018-04-06 00:15 被阅读10次
    "半夜睡不着觉把心情哼成歌,只好到屋顶找另一个梦境"
                                                    --Jay Chou《屋顶》
    
    图:桌面 /medium

    在平时设计原型时,你是怎么做的呢?

    • 是:边思考边绘制?
    • 是:画到一半是又返工对母版、动态面板进行重构?

    上面的情况,是否也出现在你平常的工作中呢?如果是的话,那么效率还真得可以提升。其实,在我们绘制原型之前还需要有个设计的过程,是对原型整体框架,包括尺寸、母版、动态面板进行规划。尤其在以团队形式合作绘制原型时,还需要有一定的规范进行提前约束,这样可以在之后的过程中减少很多不必要的投入。(过来人深有体会,下面对上述的问题进行分享我的些建议)

    首先:拟好草图,确定业务流程

    就像上面提到绘制原型之前要有个设计过程,一个很明确的绘制原型逻辑是:思考在前,绘制一定在后。原型是我们思维想法的表现,我一般是将接下来要做的事情在脑中过一遍,使用自动铅笔在稿纸上绘制下。倘若你的手绘能力还ok的话,那么都可以不用使用电脑软件进行绘制咯。这种情况一般是针对比较简单的系统并可以敏捷地与开发人员对接。之所以使用电脑原型软件来绘制是因为:

    • 方便在项目各阶段中对原型进行维护管理
    • 更好地表现原型中交互
    • 可以多人协同绘制复杂的系统原型
    图:手绘图 /花瓣

    然后:确定好原型整体框架

    犹如我们在建设一座宝塔一样,宝塔的根基、大小与原型的框架大小、各部分区域的大小、弹框大小都需要提前确定好,只有确定下来后,才能够在我们接下来的工作中减少这方面的思考,拿来套用即可。比如我现在要设计一个B/S管理系统,我会将宽度定为1000,高度定为:618,然后将整体布局居中。这样在浏览器预览起来是这个样子:

    原型框架预览图

    然后,再确定好顶栏、左侧菜单区、内容区、操作栏等整体尺寸,如果这个系统有多个界面需要共用的话,那么将之设置为母版。在剖解各区域的尺寸时,可以使用栅格线来辅助制定:

    栅格线辅助截图

    再然后:确定好各组件的样式

    确定好各组件是有多必要?有人说无所谓,要快不讲究,扔给UI工程师去处理就好。我想说的是有时候你的输出质量真会影响你个人某些职业素质形象。尤其是像产品经理这种需要具备精益求精的工匠精神更需要花点时间来让输出物更加完美,这样我们的客户或者开发同事、测试同事、UI设计同事在看我们的产出物时能够更好地了解你要表达的系统思维想法。

    像我们常见的组件有:搜索框组件、时间选择控件、表单格式、弹框样式背景、树形结构。在Axure8中,专门设有矢量图标,能够用上的尽量使用。组成好后把它们设定为母版,这样方便我们在需要的场景下套用。

    控件图

    最后:轮子造好,尽情享用

    “我们从没有创造历史,历史只是惊人的重复着”

    在我们的平时工作中,仔细想想,很多工作任务都在不断地重复着。例如,今天你组织评审完需求说明书后要发份会议纪要邮件给各评审人员,然后下星期你又需要做这样的一件事...在这过程中,我们是否可以提前将会议纪要的模板制定好,然后再需要时,将之调用出来修改里面的内容就行,不用额外再花时间去构想怎么起草。所谓万事开头难。。。

    在我们上面确定好原型框架、各组件样式再结合我们当前的项目业务需求草拟好思路后,修修改改,可以提高我们绘制原型的效率。

    各种绘制原型方法,欢迎交流,wechatID:zheng8437

    相关文章

      网友评论

          本文标题:像周杰伦一样做'音乐'之绘制系统原型技巧分享

          本文链接:https://www.haomeiwen.com/subject/byljhftx.html