案例分析|一次消灭产品文档的实践探索

作者:Dougee全文共 2120 字 5 图,阅读需要 5 分钟———— / BEGIN / ————在刚入职眼前这一份工作的时候,CTO就对产品组提出了新的要求:以后不用再另外输出产品文档,直接在原型上标注就可以了,而且以后要输出动态原型。先介绍一下我本人的情况:产品经验2年,对于Axure的交互设计有一定实践经验,但从来没有想过把动态的原型与产品说明结合来表达需求。对于CTO的决定,我想了一下,大概是出于以下三点原因:太多文件数量...

案例分析|一次消灭产品文档的实践探索

作者:Dougee

全文共 2120 字 5 图,阅读需要 5 分钟

———— / BEGIN / ————

在刚入职眼前这一份工作的时候,CTO就对产品组提出了新的要求:

以后不用再另外输出产品文档,直接在原型上标注就可以了,而且以后要输出动态原型。

先介绍一下我本人的情况:产品经验2年,对于Axure的交互设计有一定实践经验,但从来没有想过把动态的原型与产品说明结合来表达需求。

对于CTO的决定,我想了一下,大概是出于以下三点原因:

  1. 太多文件数量不利于产品档案管理。原先产品资料至少会分成产品文档与产品原型两个文件,每次产品经理对产品资料进行更新后,则至少要对文件进行两次的上传。东西一多,就容易乱。

  2. 打开多个文件,切换窗口使用的效率低。比方说,原先在产品文档与原型分开的时候,开发人员往往需要打开原型文件的浏览器窗口与产品文档Word窗口进行切换查看。每一次查看功能点的时候老是要重新锁定需求说明的位置,又累又浪费时间。

  3. 静态原型的表达效率不高。虽然静态原型也可以直接增加产品文档注释,但其在产品资料的交互、逻辑表达能力上较弱,开发、设计、测试等同事在利用上容易造成理解偏差。

实际上,我要做的事情不是消灭产品文档,而是将产品文档与动态原型进行最大限度的结合。

而经过思考,有下面几个问题需要解决:

(以下内容皆是以Axure RP工具为载体进行说明)

第一个问题

那么多需求点,怎样在一个页面上富有条例地展示出所有的产品资料?

依据我以前的经验,Axure RP中的“内部框架”(Inner Frame)将会起到非常大的作用。

对Axure RP交互熟悉的产品朋友们,应该能熟练地使用“内部框架”功能来表达一整条产品逻辑线——只要先对所有子页面进行编辑后,确定链接打开的对象即可。

但是,如果本次的产品需求出现了多条不相关的逻辑线(例如,A逻辑线条的功能点的分布是从购物车页到订单确认页,而B逻辑线条的功能点分布是从个人中心页到个人信息修改页),又该如何处理呢?

有两种解决办法:

  1. 多放几个内部框架,以同时展现不同的逻辑线。

  2. 制作一个遥控台,在一个内部框架中对多条逻辑线进行切换(灵感来自类似遥控器对电视节目的切换、大学写论文时通过目录对内容的定位)。

我选择了第二种。

在多个项目的实践过程中,我发现逻辑线数量众多是很常见的情况;在第一种方式下,会需要放置非常多的内部框架,太多太乱。

而第二种解决办法下,只会存在控制台与一个内部框架,简洁明了。

案例分析|一次消灭产品文档的实践探索

另外,控制台还能发挥类似“目录” 的作用。

我将每一个逻辑线条的初始页面与控制台上的按钮建立联系,并且逻辑线条下的页面也会我被分别整理到文件夹中,这实际是在对产品进行重新梳理的过程。

对于开发、设计师来说,可以一目了然地看到本次项目的逻辑线条,理清产品结构思路,更容易富有条理地利用产品资料。

第二个问题

一个页面可能会有数十个功能点,怎样收纳这些功能点,又不会超出内部框架的范围呢?

首先,我个人会将每一个功能点基本分成5个角度记性描述,包括:

  1. 功能序号

  2. 优先级

  3. 展示:文案、功能样式描述

  4. 交互:功能相关的交互描述

  5. 逻辑:功能涉及到的内在逻辑描述

  6. 数据:功能涉及到的数据收集需求

当然,上述的六点不是必须的,在实际情况中可以选用。

例如:给公司内部人员使用的产品,一般都是不需要记录使用数据的。

在解决方案上,我使用了大量的Axure RP中“隐藏/展示”的交互效果,以及矩形工具、连线功能。

基本思路是:

优先并始终展示功能序号与优先级,通过点击功能序号与优先级,再将原本隐藏的展示、交互、逻辑、数据几个维度进行切换显示。

围绕上述4个可能带有大量文字说明的维度,我又添加了矩形工具,在几个矩形中填写说明文案,当使用者点击某个维度的时候,可切换矩形的显示情况。

当然,还需要连线工具将矩形与对应的维度进行连线,其中线段也要进行对应的切换显示处理。

案例分析|一次消灭产品文档的实践探索

通过这样的方式,就能很好地对页面上的功能点进行收纳,就算是在移动端页面上收纳数十个功能点也是绰绰有余的。

另外,为了提高标注的效率,可以将标注的整体进行粘贴复制,再修改上面的文案;如此可以保留其中的交互,而不需要重新对标注进行交互设计。

主要是因为Axure RP的母版工具不够灵活,没有对单个母版的个性化编辑功能,否则效率可以更高。

第三个问题

如何告诉产品经理的协同伙伴:原型上哪里可以进行交互操作?

我的做法是,在Sketch上绘制了一个特殊图标,这个图标将表明该处可以进行交互操作,例如点击、左右拖动之类的。

下方“菱形圆圈”的图标就是我自己设计的提示图案:

案例分析|一次消灭产品文档的实践探索


第四个问题


如何修正标注的字体?

由于在不同的浏览器下,默认展示的最小字体不同,所以有的时候会发现本来在原型上设置好的字体突然在浏览器中变大了许多,甚至会超出矩形的范围。

案例分析|一次消灭产品文档的实践探索

此时只要对浏览器进行设置,将最小显示字体进行修改即可。

我个人一般改成6号字,或“特小”。

案例分析|一次消灭产品文档的实践探索

通过本次的探索,我基本达到了领导的要求,之后会继续深入,争取给大家分享更多心得想法。

也欢迎大家一同指教,多多给我提意见。

———— / END / ————

作者:Dougee,努力中的东方小狼狗

本文由 @Dougee 原创发布于人人都是产品经理。未经许可,禁止转载

案例分析|一次消灭产品文档的实践探索

点击“阅读原文”下载APP

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/36100/

(0)
交互精选交互精选
上一篇 2018-03-27
下一篇 2018-03-27

相关推荐

  • 只会简单的Axure操作?6周5次实战,让你做出能拿去面试的原型

    昨天跟一位自学Axure、产品工作半年的朋友聊天,蛮感慨的。她遇到的问题,也是蛮多自学Axure的朋友遇到的问题。你是否也有同样的问题?除了原型图不标准不美观,还深受效率低、交互弱的困扰你也有这位同学的困扰,想快速提升axure能力,做出标准原型、高保真原型?推荐起点学院&腾讯课堂联合打造给产品经理的Axure课程已有2000多位同学学习,学习效果显著Axure零基础也能学,学完画出规范原型产品思维和交互贯穿全程,学完告别画图经理如果你...

    2018-05-07
  • UX小白 | 不谈它?算什么用户体验设计?

    这其实只是个引你进来的标题,我今天真正想说的事情其实是它——你在做一款产品的时候考虑过它的无障碍性(Accessibility)吗?无障碍性(Accessibility):在图形交互界面为基础的交互方式中,无障碍性也往往被称为可访问性。“无障碍性(accessibility)意味着产品设计应用时应考虑到,无论是因为年龄、事故或疾病而有认知、感官或者移动障碍的人,还是没有此类障碍的人,都应能够有效使用这个设计。”——《About Face...

    2018-01-31
  • sketch 44.1+汉化插件下载

    如果你喜欢UI设计如果你喜欢高效设计如果你喜欢简洁的设计最重要的,你得有个Macbook pro !Macbook pro!Macbook pro  !不要提什么macbook air,因为你是设计师,设计师,设计师。官网地址http://www.sketchcn.com/,可免费下载体验30天。  很值得购买的软件,只需要$99为什么选择 SketchSketch 是为图标设计和界面设计而生的。它是一个有着出色 UI 的一站式应用,所...

    2018-04-22
  • 为什么重视用户体验的公司最后死掉了?

    今日头条候选:易到完成股权变更,乐视仍未完全退出;“ofo小黄车”被诉商标侵权;今天,给大家推荐的头条是「黑马高管营」导师刘爽从管理决策角度分享如何做决策、决策的依据以及避免陷入的误区,值得每一位管理者仔细阅读。【黑马高调头条】第185期文 | 创业黑马学院什么是管理决策论?管理决策论就是在管理中做各种决策的相应依据。很多创业公司的折腾闹剧现象,就是管理层管理决策弱的结果,如果具备基本的make sense,有些“学费”不是一定要交的,...

    2018-01-30
  • 大势APP的用户体验究竟“火”在哪儿?

    周一:AE动效 | 如何入手创作才能更加真实?周二:马克笔如何通过"叠加技法"精准调色周三:更快更好 | 手绘板也能比着尺子画!?周四:观点 | 交互设计在未来会有多火?周五:大势APP的用户体验究竟“火”在哪儿?周六:如何看懂艾迪.斯理曼的Dior Homme周日:学珠宝设计我们推荐给你的必看书目本期主讲老师▼用户体验设计UX是交互设计中非常重要的一点,每个APP根据适用人群和功能设计的不一样,都会有不同的用户体验,下面来说一说在众多...

    2018-04-07
  • 怎样做好汽车交互设计?

    文章来源:汽车造型设计编辑整理:IO酱车内交互系统看似只是整车的一小部分,但由于承担了车辆和用户的“交流”任务,因此里面涉及到的内容很多,每一项拿出来都需要巨幅讨论,今天我们就和大家概括谈谈这里面的几点。目前重点汽车交互设计是决定智能汽车发展水平的重要标志,现阶段智能汽车在此方面关注的主要一点是用户体验。设计流程汽车交互设计的一般流程包括:1. 需求沟通;2. 资料调研;3. 专家评估;4. 用户研究;5. 需求及信息架构梳理;6. 概...

    2018-03-15
  • AI 交互设计怎么做?谷歌详解自家 AI 相机设计思路

    文 | 何忞来自雷锋网(leiphone-sz)的报道雷锋网按:日前谷歌在其官网发布博文,文中详细介绍了 AI 相机 Google Clips 的一些设计思路。雷锋网将其编译如下正如过去曾经发生过的移动革命以及再之前的网络革命一样,机器学习正在让我们反思、重构、重新审视我们生活中已经拥有的一切。在 Google 用户体验(UX)社区中,我们开始了一项名为“以人为本的机器学习(HCML)”工作项目,来指导和帮助我们重构世界。站在这样的视角...

    2018-02-03
  • 交叉学科-交互设计春季周末班课程计划

    开课时间:本周末4.14日开课,可预约免费试听。请单独联系教务老师。联系方式:教务老师微信二维码上课地址:北京海淀区北四  环保福寺桥南  恒兴大厦10层E室

    2018-04-11
  • 信息与交互设计专业委员会走访北京服装学院艺术设计学院

    点击信息与交互设计关注我们!欢迎大家踊跃投稿哦!投稿邮箱:iidc@iidc.org.cn第四站——北京服装学院2017年11月3日上午,信息与交互设计专业委员会卞亚君秘书长及秘书处谢老师、王老师一行三人到北京服装学院艺术设计学院进行了走访。新媒体系主任丁肇辰教授热情地接待了我们,在交谈中丁教授向我们介绍了学院的基本情况以及带学生做的一些研究项目及活动。如《都会寝室》项目,面向20-35岁人群,致力于通过卧室环境控制、健康食物推荐等,改...

    2018-01-31
  • Axure绘制专题页原型

    专题策划对于SEM至关重要,如果策划及文案都搞定了,接下来如何与设计进行沟通呢,这篇文章我们一起聊聊专题页原型绘制的话题。一、Axure界面介绍Axure的使用极其简单,只需要几个拖拽动作就可以基本搞定。接下来我们实际上手用学历教育的例子,带大家一起来看看。绘制这个原型可以分为两步,首先是手机的绘制,然后是文案内容的绘制。左侧面板(快捷键:Ctrl+Shift+[),主要是元件库,将需要用到的元件,直接拖拽就可以。右侧面板(快捷键:Ct...

    2018-03-04