故事板的前世今生

一故事板的前世

故事板的出现,是用于广告及视频创作前期,用来快速表达作者是创作理念。漫画还有视频的很多分镜头其实也是大致一样的概念。

故事板的前世是这样的,下图是宫崎骏的魔女宅急便分镜故事板


魔女宅急便分镜头

要知道,你看到的电影镜头是这样来的,下面就是故事板和电影镜头最终版的对比图


《云图》故事板和电影镜头对比




故事板的今生


故事板的类型

故事板的类型,偷懒了引用了【PM必看:用户场景神器—故事板

文字故事板

我们要描述一个好的用户场景,需要对用户使用这个产品的过程有一个基本的了解,还需要对用户角色和使用情景有所设想。好的用户情景,可以贯穿整个产品设计的过程,模拟现实的用户操作和交互方式,用于产品的可用性评估。

使用简单的语言描述人物角色、情境及用户使用情景,尽量避免不要给出具体的用户行为和交互动作。

合理的文字故事板应该注意以下几个方面:

确定角色,多个角色做多个故事板;

确定确实必须完成的目标;

确定故事的出发点或事件;

明确角色信息及关注点;

确定故事板的数量,取决于人物角色和目标数量;

书写故事,从触发到结束;


用户Tina:性别、年龄、职业、收入、学历、使用习惯、使用网络、关键特征、目标以及故事描述,这些作为人物角色模型的故事板信息内容。

图片故事板

对于交互设计师而言,图形故事板是最快让他人获取自己的想法的最佳手段。通过图形故事板,用户就像在看电影一样,融入到情景当中。

通过反思各个场景的的事件,提醒团队该注意哪些方面,反思交互效果,能够让他人通过看得见的方式面面加以注释。

在图形故事板中,用户通过一连串的用户行为,连接成一个完整的用户场景。

(故事板就是一个用户场景)

(事件/行为是具体的人和系统的交互行为,它将人、物和环境结合起来,构成了整个故事的内容)

(把角色放在某个场景里,讲一个故事。故事中应该包括对问题的研究和自己的想法)

如果着重研究线下任务,则故事板中线下场景居多,如关注屏幕任务则会展现界面居多。当然如果完全关注屏幕任务就是我们的线框图和原型了。

故事板关注的是屏幕任务和线下任务结合的边缘地带。

故事板是传统交互设计方法的重要补充工具,平时我们的原型设计仅仅局限于屏幕环境的设计,忽略了屏幕之外的使用情境,通过故事板绘制的关键使用场景有利于我们理解屏幕之外的用户目标和动机。其实有经验的设计师会在产品设计初期假想一些应用情境,只不过他们没有画在纸上而已。

另外,故事板不仅仅是设计师头脑中假想情境的具象化,他还可以使一些模糊的用户需求更加具象更有说服力,在设计沟通的过程中能发挥巨大的作用。

故事板揭示了用户与产品的各个交互行为,他可以让pm像用户一样,融入到用户的使用情景当中;又可以以一个旁观者的状态,观看全局,反思和总结使用场景的问题及真伪。

以上故事板的类型,偷懒了引用了【PM必看:用户场景神器—故事板



怎么制作故事板


步骤一:写故事场景,描绘现实场景

我在一次工作中,需要列一个场景:邀约朋友来家里吃饭休闲一条龙。


步骤二:分解现实场景(适用于步骤较多,逻辑复杂的情况)

但是看似简单的一个任务,仔细想来并没那么简单,我邀请朋友吃饭,那就涉及到邀约、商量吃什么、告知朋友位置、帮朋友开门、采购以及后续的打扫和休息等一系列活动。

于是我讲这个任务做了进一步分解:邀约——置办——接待——善后打扫——休闲

现实场景分析

人物设定:Miss米(业主)、朋友们(外来访客)、小郭(门卫)

场景(邀约):

场景一:周五Miss米在公司上班,想周末干嘛好呢,后来想到邀请朋友们去家里吃饭,举行姐妹pa。

场景二:Miss告诉朋友,周六中午来自己家吃饭,来一个欢乐的姐妹pa。

场景三:朋友们各自决定是否要来参加。

场景四:姐妹们在群里热聊吃些什么好呢,商量菜单。

场景(置办):

场景一:确定了菜单后,列下购物清单

场景二:Miss米拿着购物单去到超市购物

场景三:MISS米购买了清单上所需的菜品

场景四:Miss米想到需要买些一次性餐具和饮料

场景(接待):

场景一:朋友A从家里出发,向Miss米咨询具体位置

场景二:朋友A开车根据导航到了Miss所在小区的门口

场景三:门卫小郭上前询问朋友A要到访业主家具体栋数

场景四:门卫小郭确认完毕后,帮朋友A打开门禁

场景五:朋友A到达楼下,按房间号,让Miss米帮忙打开楼下门禁

场景(善后打扫):

场景一:吃完饭后,朋友们提议等会去小区内的会所进行按摩服务。

场景二:Miss米(业主)打电话给按摩馆进行预约。

场景三:Miss米(业主)和朋友们(外来访客)到达按摩馆进行按摩。

场景四:消费完毕,进行支付。

场景(休闲):

场景一:吃完饭后,朋友们提议等会去小区内的会所进行按摩服务。

场景二:Miss米(业主)打电话给按摩馆进行预约。

场景三:Miss米(业主)和朋友们(外来访客)到达按摩馆进行按摩。

场景四:消费完毕,进行支付。


步骤三:描绘线上场景


因为我的目的在于通过软件帮助用户解决整个流程中的各种事项,所以分析各部分,我线上场景做了以下总结:

解决方案

场景(邀约):

步骤一:Miss米(业主)在业主APP上发布邀请函,包含日期、地理坐标、聚会主题、业主所属房号信息等。邀请函发出后,提供给Miss米(业主)一定的优惠购、购物券、积分券等。

步骤二:Miss米(业主)分享邀请函至微信群等

步骤三:朋友们(外来访客)在该邀请函下方报名,邀约确定后,Miss米(业主)和物业相关人员可以收到到访人员时间及人数相关信息。

步骤四:Miss米(业主)和朋友们(外来访客),可以在邀请函下填报菜单,软件提供“摇一摇菜单”“灶神菜单”“蔬菜大拼盘”等方式提供给菜谱推荐,辅助确定菜单。

场景(置办):

步骤一:菜单确定的同时,为Miss米(业主)提供购物清单

步骤二:根据购物清单,提供购物车功能以及网上超市推荐功能,Miss米(业主)可以用发布邀请函所得的优惠券等在由商家和物业提供的购物平台(网上超市、生鲜配等)进行购买。

场景(接待):

步骤一:朋友可以根据邀请函所提供的地理位置,进行导航到达小区

步骤二:到达小区门口后,将邀请函打开给小郭(门卫)查看,放行,进入小区。

步骤三:Miss米(业主)可实时查看朋友们的位置。

步骤四:朋友到达楼下,点开门,Miss米(业主)可以通过手机帮助朋友远程开门,打开楼下的门禁。

场景(善后打扫):

步骤一:Miss米(业主)通过软件进行预约家政服务。

步骤二:家政服务接单,并派阿姨上门打扫。

步骤三:打扫完毕,进行支付(可以使用营销策略获得的券等)。

场景(休闲):

步骤一:Miss米(业主)通过软件进行预约按摩保健服务。

步骤二:商家接单,提供按摩时间。

步骤三:消费完毕,进行支付(可以使用营销策略获得的券等)。


步骤四:根据每个步骤绘制故事板,并添加描述语言

在上一步中,已经对每个小场景进行了步骤描述,接着按照每个步骤进行绘制即可,如果上面的描述一幅图表达不出,那说明第三步中的分解不够详细,还可以进一步做分解。


我的故事板


01_邀约场景

01-邀约场景


02_置办场景


02_置办场景

03_接待场景


03_接待场景

04_善后打扫场景

04_善后打扫场景

05_休闲场景

05_休闲场景



BY Flugel_Yan   2015/12/2

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,884评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,347评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,435评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,509评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,611评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,837评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,987评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,730评论 0 267
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,194评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,525评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,664评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,334评论 4 330
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,944评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,764评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,997评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,389评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,554评论 2 349

推荐阅读更多精彩内容

  • 我之前没有接触过亲子阅读,偶然看到一个朋友的朋友圈,她的宝宝才一岁半却养成了阅读的习惯,我感觉这得向她学习,毕竟...
    妍雅阅读 221评论 0 0
  • 荒唐事 我应该一直明白 这是一件荒唐事 于你还是于我 我怀念着过去与未来 不顾你始终的一言不发 自私鬼扰乱我...
    不顾身阅读 384评论 3 3