读《破茧成蝶》——用户体验设计师的成长之路;(四)

最近,有一些同学或者其他业务部门的人,想要做产品经理。就问了我一些画原型的事儿。我发现他们重点关注的,都是动态的原型技巧和实现。在我观察,一些有经验的产品在需求评审时,也是花了很多时间去做了一个动态的原型。我很能理解他们的心情和出发点。但我还是苦口婆心的跟那些同学,准产品和准交互说,原型图的灵魂不是逼真的动态的效果%%##@@@……
本章内容中,作者总结了画原型的技巧和要点,我的感觉是…………………我之前画的都不是原型图(┬_┬)

原型——设计方案的表达

  • 包含对产品的功能和内容的说明
  • 既包括静态的页面样式(线框图),也包括动态的操作效果(动态操作or交互说明)
  • 清晰,规范的原型的好处:

1.多种角色之间良好的沟通平台(人人都喜欢看图)
2.专业性的体现(“以貌取人”不是错)

  • 作者推荐的原型软件:Axure(适用范围广);PPT(用于移动app的动效演示)
  • 高保真原型?适用用于展示和用户测试,一般的项目中不会花太多精力去做

标准的原型包含什么?

  • 更新日志:大部分原型都会修改很多次,方便相关人员看到修改点
  • 版本号
  • 信息结构图
  • 任务流程图:不同于需求文档中的业务流程,业务流程关注于业务限制和后台逻辑,但是任务流程图只是关注用户如何操作,界面如何反馈等。
  • 页面流程图
  • 线框图:代表静态的部分
  • 交互说明:代表动态的部分

原型设计要点

  • 动态效果代替交互说明不可取:
    1.动态效果制作比较费时间,尤其是原型是经常修改的情况下
    2.动态原型需要相关人员,逐一操作才能看到全部状态,不利于设计方案的表达效率

  • 交互说明包括:
    限制,范围值,极限值,操作,循环操作,一般状态,特殊状态,误操作,反馈,跳转

  • 其他技巧:
    1.明暗对比,不使用截图和颜色(我持有不同意见)
    2.合理布局(和视觉沟通)
    3.栅格规范(我没用过额…………)
    4.第一屏的高度(600px)
    5.正确表达界面层次和视觉元素
    6.了解视觉趋势

  • 交互说明技巧:
    1.使用真实的数据
    2.不遗漏特殊状态
    3.避免过长的说明
    4.必要时采用图,文,表结合的方式
    5.如果模块的交互说明内容很多,可以单独成一个页面
    6.原型如有变更,口头通知其他角色或者在项目讨论组里,指明相关人员知晓

聊聊设计规范

  • 设计规范是随着产品发展和成熟建立起来的
  • 包括:交互规范,色彩规范,logo规范,icon规范,控件规范等
  • 产品大了,模块多了,会出现多种样式,但基本相似的界面元素会导致,界面一致性的问题,设计效率不高,开发成本高,维护和修改成本大
  • 怎么做规范?
    1.时间:项目开始前?不可能,一般是项目快要结束或者结束后
    2.规范是指导后面的设计的,是可以复用的,不是设计的总结
    3.交互规范先于视觉规范
    4.先做“大”再做“小”

推荐阅读更多精彩内容