3D Looker创意产品设计 - UXPA中国2016行业文集

2017-07-20 | 文集

 

3D Looker创意产品设计

陈建江  张颢嚴

中兴通讯股份有限公司,上海

 

摘要:通过分析市场热点,选择与手机结合的3D显示装置为案例,用UCD的方法,围绕可用性测试与迭代设计,将一个原型产品,优化改进达到商用状态。

关键词:3D显示装置,原型设计,可用性测试,迭代设计

 

1. 市场调研 - 3D显示设备现状

随着技术不断发展,3D显示设备成本正在大幅降低,并催生了以此为基础的虚拟现实领域技术和服务的快速发展。当前市场上有哪些3D显示设备,各有什么特点?如要制作这个装置,采取哪种技术方案,如何定位该产品,确定目标用户以获得竞争优势?在产品设计启动之前,这是必须要明确的问题。本案例是运用如图1所示的UCD流程[1],开展产品研究分析,进行设计测试等活动的一次尝试,并取得了较好的效果。

 

图1 UCD流程

 

通过检索发现,与3D显示,立体电影,虚拟现实等关联的现有产品如图2所示,包括索尼头戴式显示器HMZ-T3W, Oculus的虚拟现实头盔,3D照片观看器(配以左右格式的立体照片),以及红蓝立体眼镜(配以红蓝立体图片),3D反射式眼镜(配以左右格式立体图片),偏光镜眼镜(配以偏光图像),快门式眼镜(配以快速切换的左右眼图像),裸眼3D手机。

 

图2  3D显示产品

 

对现有产品进行分析和体验,研究其产品特点,分析各类产品优缺点,成本等,绘制出3D产品分析图,寻找新产品介入的机会。红蓝立体眼镜因有滤色镜,图片显示的亮度和色彩还原受到影响,反射眼镜对观看位置有要求。快门式眼镜适合立体电视,偏光式眼镜适合立体影院,这二种眼镜的整个显示系统相对复杂。裸眼3D手机成本较高,就显示效果还不如3D照片观看器,但裸眼3D手机因不需要3D眼镜使用上比较方便。Oculus头盔,索尼HMZ-T3W是专用设备,价格不菲。3D照片观看器能显示大视角的图片,有较大的视觉冲击力,其不足之处是人眼镜片照片距离是固定的。从价格与3D还原效果二个维度对现有产品进行分析归类,如图3所示。

 

图3  3D产品分析

 

根据3D产品分析图,第四象限的3D照片观看器具有3D还原效果好,成本低的特点。手机具备图片显示及视频播放能力,如手机能与3D照片观看器结合实现播放3D视频,显示3D图片,这样就能进一步降低用户体验3D视觉的门槛,以便更多的用户能接触到3D视觉的魅力。综合分析,双路透镜式左右格式的立体显示装置比较适合于手机,而索尼头戴式显示器HMZ-T3W,Oculus虚拟现实头盔的3D还原方案正是双路透镜式。一个在手机上观看3D图片和视频的创意产生了(注1)

 

2. 需求分析 - 3D显示产品分析定位

智能手机几乎人人都有,但在智能手机上看过3D图片,视频的人并不多。按确定目标用户,确定目标用户需求,确定目标用户的核心任务,找出所需要的技术并进行创新,设计产品等步骤[2],设计一个入门级的,简单的3D显示产品,使用户能在手机上非常容易体验3D效果,感受3D视觉的魅力。

目标用户:对3D照片及视频概念有所了解,易接受新事物的,有兴趣在手机上体验3D图片和视频的年轻用户。玩家发烧友对设备有较高要求,不是该产品的目标用户。

用户需求:在手机上观看3D图片及视频,装置需简单,使用方便。

核心任务:将3D显示装置安装在手机上,打开手机图库应用,观看并切换3D图片。

技术方案:双路透镜式配合左右格式的立体图片或视频。

分析现有产品特点,寻找差异化定位,得出关键词:易用,新颖,结构简单,便于携带,与手机配合形成最简的3D显示装置。

 

2.1 易用

为达到产品使用方便目的,需充分考虑产品的易用性友好性,产品使用不应给用户带来挫折感。易用可分解为几个方面,安装方便:装到手机上,以及卸下,一个动作快速实现,手机有来电时需能方便地卸下装置接听电话。操作方便:不改变现有手机人机交互模式,能进行触摸屏操作,以便快速切换需要显示的内容。观看方便:安装后手机与产品一体化,用户能手持手机和装置观看。

 

2.2 便于携带

在整体结构上有所创新,立足于折叠式结构,使用时安装容易,收纳时能折叠,减少体积,也便于生产时堆放,及运输,以实现便于携带目的。折叠1-2个动作能实现,降低折叠难度。如满足折叠需求,就是派生出装置的搭建组装方便的需求。

 

2.3 新颖,结构简单

遵循大道至简原则,精简到极致,去除一切不必要的内容,以最“简”结构形式,减少制作工序,控制成本。要求产品以一个全新面貌,呈现在用户面前。定位于入门级3D显示装置,在头戴式与手持式二个方向中选手持式,有利于简化设计。

 

2.4 兼容主流手机尺寸

主流手机显示屏尺寸定义为4.5-6.0吋,该装置需适配这个尺寸范围,以便更多的用户使用。

 

2.5 绿色环保

这是产品的潜在需求,产品必须考虑对用户的关爱,不能对人造成伤害,即材料不能有锋利的边和角,或者使用柔性材料加以防护,避免人接触是可能造成的划伤,考虑环保,在塑料片,泡沫材料片,卡纸等多种材料之间选择,综合考虑选用卡纸,卡纸不用保护材料也不易划伤皮肤。

确定了技术方案,下一步就进行模型制作,可用性测试与迭代设计。

 

3. 模型制作 - 迭代设计与可用性测试

3.1 模型1

首先做一个原始模型(命名为模型1)如图4,实现基本功能,体验手机上显示3D图片和视频的效果。用包装盒制作成箱体,利用儿童望远镜的物镜作为镜片,形成第一个原始产品模型,用于体验3D显示效果。卡纸箱体可遮蔽外界光线对显示屏的干扰,使用时手机放在桌面上,卡纸模型再叠加在手机上,人眼靠近镜片观看手机显示屏上的左右格式3D图片。初次观察体验,手机屏呈现的3D图片效果非常好。在原始模型上看到效果后,初步评估产品可以实现,并具备较好的实用性。

该产品主要功能就是用户可以通过它观看手机中的3D图片,3D视频。“观看手机中预置的3D图片”以此作为产品可用性测试任务,观察分析用户使用过程中遇到的问题,迭代设计,不断优化改进。

 

图4 模型1

 

测试任务:观看手机内预置的3D图片。

测试过程:用户打开图库,找到3D图片,将手机放在桌子上,将模型1放在手机上面,人眼靠近模型1的镜片,手指滑动屏幕切换图片。

测试结论:3D显示效果达到要求,使用方便性远没有达到要求。

问题改进:模型1的问题在于,手机放在桌上,模型1放在手机上方观看的,如拿起手机,手机与模型之间无法固定,其结构方式没有达到使用方便的要求。为此需要解决装置和手机一体化问题,即将模型与手机要固定在一起,可以拿在手里观看,改善使用体验 。滑屏切换图片手指被模型挡住,操作并不方便。将模型1可用性测试问题进行归类形成表1

 

表1 模型1问题汇总

 

3.2 模型2

制作模型2如图5,模型2采取二层敞开式结构,以期待手指能方便地触控手机屏幕,底层用橡皮筋将模型与手机固定在一起,解决一体化问题。

 

 

图5 模型2

 

测试任务:观看手机内预置的3D图片。

测试过程:用户将模型2绑在手机上,打开图库,找到3D图片,手持手机(模型2已固定在手机上了),人眼靠近模型2的镜片,手指滑动屏幕切换图片。

测试结论:模型2与手机的一体化结构基本实现。但手指触控手机屏时有支架遮挡,不方便。该模型未解决折叠收纳问题。

问题改进:模型2整体有十多个零件,零件过多不利于装配,也无法折叠,需要重新考虑结构,为手指操作屏幕留出更多的空间

 

表2 模型2问题汇总

 

3.3 模型3

制作模型3如图6,为实现手指能触控屏幕,达到使用方便的目的,第三个卡纸模型,考虑在屏幕上方留出较大空间,不遮挡手指。将模型支架由手机二端,调整到手机中间,扩展手机屏幕上方的空间。

 

图6 模型3

 

测试任务:观看手机内预置的3D图片。

测试过程:用户将手机嵌套在模型3上,打开图库,找到3D图片。手持手机失败,模型3与手机没有合适的固定方式,只有将模型放在桌面,人眼靠近模型的镜片,手指滑动屏幕切换图片。

测试结论:模型3解决了手指触控手机屏时有支架遮挡的问题,该模型稳定性不佳,结构容易变形,还没解决一体化问题。

问题改进:保持手指触控手机屏幕的操作方便性优势,在现有基础上解决模型与手机固定的一体化问题,稳定性问题,以及折叠收纳问题。

 

表3 模型3问题汇总

 

3.4 模型4

制作模型4如图7,第四个模型先解决稳定性问题。首先增加支架的宽度,并将支架整体形成“口”字形,可以用一片卡纸制作,减少零件数量。但“口”字形结构不稳固,需要在中间加档片,以形成支撑整体结构强度,改善整体稳定性。中间的档片还具有隔离左右眼视线,作为分割左右屏的分割线,特别是档片与环形支架配合,可将卡纸模型固定在手机上。为实现支架与档片配合将装置固定在手机上,需要将支架二个端面实现铰接。在支架的一端设计了一个舌头状的插头,另一端开了一个对应宽度的插口,插头与插口配合,实现了二端的铰接功能。卡纸模型由“口”字型支架,档片,以及镜片,共3个零件组成。

 

图7 模型4

 

测试任务:观看手机内预置的3D图片。

测试过程:用户将手机嵌套在模型4上,打开图库,找到3D图片。手持手机和模型,人眼靠近模型的镜片,手指滑动屏幕切换图片。

测试结论:模型4使用了中间档片这一加固措施,解决了模型的稳定性问题,以及利用档片与支架之间的卡纸弹性,将模型卡在手机上,解决了一体化问题。至此,卡纸模型在结构上初步实现“简”设计意图

问题改进:第四个卡纸模型注重了实现功能,还没关注美观性需求,以及折叠收纳问题。

 

表4 模型4问题汇总

 

 

3.5 模型5

制作模型5如图8,优化外观设计,在保持支架一定强度的同时,将支架形状做收缩美化处理。支撑架上留出了观看时鼻梁嵌入位置,减少观看时鼻子与支撑架的干涉,提高产品可用性,体现对用户的关爱。为平衡支架二边的应力,相对于鼻梁嵌入位置的另一端开了一条槽口。支架转角处采取圆弧的形式,美化支架外观,支架的圆弧还具有防止卡纸皱折,防止划伤皮肤等功能,经过改进,产品整体外观美观简洁。

   

图8 模型5

 

测试任务:观看手机内预置的3D图片。

测试过程:用户将手机嵌套在模型5上,打开图库,找到3D图片。手持手机和模型,人眼靠近模型的镜片,手指滑动屏幕切换图片。

测试结论:模型5解决了手指滑动手机屏幕方便性问题,手机与模型一体化问题,外观美化等问题。

问题改进:需要解决折叠收纳问题,以及兼容主流手机尺寸问题。

 

表5 模型5问题汇总

 

 

3.6 模型6

制作模型6,解决兼容主流手机尺寸问题,组装设计优化。为满足兼容主流手机尺寸需求,调整支架一端的插口宽度,该插口的宽度需要大于插头的宽度,使得装置的宽度有一定的调节范围。

测试任务:用4.5寸, 5.0寸,5.5寸,6.0寸手机进行尺寸兼容性测试。

测试过程:将4种尺寸的手机依次装入模型6

测试结论:加大插口宽度,与插头配合能够解决不同尺寸的手机宽度兼容性,但中间的档片无法兼顾这个尺寸范围。插口的宽度放大后,出现了插头与插口配合太松的问题。

问题改进:为适配4.5-6.0寸的手机,为此增加一个档片,即使用适配5.0吋以上手机的宽档片,和5.0吋以下的窄档片来满足该尺寸兼容性问题。遗留插头与插口配合太松的问题

 

表6 模型6问题汇总

 

3.7 模型7

制作模型7,解决插头插口配合太松的问题。经过多次尝试,采取开二条并行的插口方案,插头在穿过第一个插口后再穿回第二个插口,增强了插头与插口的摩擦力,插头插口之间调整宽度与松垮问题完美解决,插头的整体外观也做到了进一步改善,如图9。

 

图9 插头插口

 

测试任务:检查尺寸兼容性

测试过程:用4种尺寸的手机,装入模型,测试尺寸兼容性

测试结论:换不同档片调整支架端插头插口位置,可以覆盖4.5-6.0英寸的手机宽度。中间档片与支架配合太松,模型整体不稳固

问题改进:解决中间档片与支架配合,组装时容易插入,组装后需紧配合。

 

表7 模型7问题汇总

 

3.8 模型8

制作模型8,解决档片太松问题。考虑中间的档片在组装时能比较容易地插入对应的槽口,与档片插头对应的支撑架插口采取开槽形式,这就存在档片与支撑架配合太松,造成整体结构不稳固问题,该结构不理想。

要求档片与支撑架安装时,容易插入,安装后呈现紧密配合,安装后有链接强度不能松脱,为此采取了梯形插口,档片的插头插入插口时,梯形插口长边有较大的宽度,组装归位后插头与插口互相牵制,插头被限位在梯形插口的短边,这样插头插口实现了紧密配合。档片改进过程如图10。

 

图10 档片插口

 

测试任务:检查档片与支架的配合问题

测试过程:将档片插入支架的二边,并将支架的插头插入插口,装入手机,检查档片与支架的配合程度,检查模型整体稳固性

测试结论:模型与手机配合紧密程度合适,符合使用要求。

问题改进:需解决折叠方便性问题

 

表8 模型8问题汇总

 

3.9 模型9

制作模型9,解决折叠问题。支架,档片的材料是片状的卡纸,支架成型时本身就有四道折痕,按折痕就能折叠。卡纸厚度所决定的模型强度,但厚度与折叠方便性是矛盾的,问题的焦点集中在卡纸厚度的选择上。用了5种厚度的牛皮卡纸进行试验,包括250克,300克,350克,400克,450克种类的卡纸。不同厚度的卡纸装配试验后,400克牛皮卡纸最理想。卡纸有白卡纸,牛皮卡纸,彩色卡纸多个种类,考虑环保因素,选用牛皮卡纸,牛皮卡纸可以减少纸张漂白或加色的过程中产生的污染。

 

表9 模型9问题汇总

 

经过多次迭代设计,完成了原始模型演变到成品的过程,实现了产品需求定义的内容,并较好地保留触屏操作手机的功能。

 

图11 迭代演变过程

 

整个模型的组装过程为安装档片,链接支架二端共二个步骤。使用时,将卡纸装置套在手机上靠近眼睛就能观看使用,装卸容易,还可以触屏操作,满足使用方便的需求,具备折叠功能,方便携带。

 

图12 组装过程

 

4.  发布

产品发布,需解决包装,命名,打样,生产等工作。包装设计,以简洁为原则,一张卡纸,一次刀模压制完成加工,不用打胶,减少生产工序。材料选用250克牛皮卡纸。

命名,通过征集,网络检索排除重名,考虑产品特征等因素,在多个备选名称中选出3D Looker,命名寓意一目了然。

印刷,产品说明文字采用单色印刷,单色印刷可在普通的印刷机上可一次完成,减少印刷次数控制成本。图案等采取线条而不是块状的表达方式,避免大面积印刷图案,减少油墨消耗,利于环保的目的。

加工,整个加工过程分为:落料,印刷,零件刀模冲压,支架装镜片,折叠包装盒,将零件装入包装盒内等步骤。卡纸可使用刀模加工,卡纸刀模价格低廉。在支架装配镜片时,初期使用双面胶将镜片粘结在支架上,但因应力原因,部分镜片会脱落,最终采取热熔胶粘结方式解决该问题。

至此已解决了从创意,设计到生产的所有问题,图13为成品图,图14为外包装图,图15为与手机配合图。3D Looker成品包括5个零件(包装x 1, 镜片x 1, 支架x 1, 档片x 2),史上最“简”的3D观看装置诞生了!

 

图13 成品图

 

图14 外包装图

 

图15 与手机配合图

 

5.  结语

3D Looker看似简单但内涵不简单,人机交互方面考虑比较周全,在手机上安装后还能进行触摸屏操作,玩VR游戏可直接触屏操作无需蓝牙手柄,浏览3D图片可直接用手滑动屏幕上的图片,如有来电手机立即可从3D Looker抽出接听。能折叠,携带和收藏就非常方便,适配多种手机尺寸,成本低廉,选用材料及加工立足于环保理念。

回顾整个过程,从创意萌发,到市场调研,产品定位,需求分析,模型设计,迭代改进,打样等环节,围绕需求做设计,将“简”做到极致,去除一切多余的东西,装置主体零件从初期的十多个精减到三个,一个零件有多种作用,中间的挡板具有支撑支架,隔离左右眼视线,作为安装在屏幕中间的基准线,与支架一起配合将装置固定在手机上等多种功能,为3D Looker化繁为简发挥重要作用。在迭代优化过程中,紧紧抓住产品的核心功能“观看手机内预置的3D图片”为可用性测试任务,以“易用”为目标,发现问题解决问题,实现了观看3D图片可以用手指触摸屏幕切换的功能。

“易用,新颖,结构简单,便于携带”包含了二个层面四个维度的内容。“结构简单”“新颖”是做好产品的设计基础,即产品需简洁,并有创新,有改进。“结构简单”“新颖”定义了产品的外观和结构设计要求,是用户对产品感知体验的内容。“易用”“ 便于携带”是产品设计的内涵,即产品不仅要简洁创新还需好用,并考虑环保,方便使用,让用户在使用过程中产生愉悦感,“易用”“ 便于携带” 定义了产品使用过程中的设计要求,是用户使用产品认知体验的内容[3]。3D Looker 产品得到台湾金点设计评委的肯定,荣获2015年度金点设计奖。3D Looker在功能,易用性,成本,便携性,可生产性等各个方面达到甚至超过了初期的目标,并开始批量生产(注2)。

当前3D资源日益丰富,业界下载量比较大的应用有暴风魔镜,3D播播,也有提供3D内容的87870网站。如果你没看过《阿凡达》,那就用智能手机(3D播播App)和3D Looker试一下,或者下载一个VR Space应用体验一下3D游戏,当然你也可以用3D相机应用拍一张立体照片,用3D Looker体验自己的第一个3D摄影作品。如果你了解谷歌的Cardboard,相信你会认同3D Looker,这不是模仿,而是超越。

 

 

图16 金点设计奖

 

 

参考文献

 

[1]  用户体验设计详细流程

http://jingyan.baidu.com/article/6079ad0e4b41d428fe86db54.html

[2]  Christian Kraft(丹麦)著  王军锋 谢林 郭偎  译  《惊奇UCD 高效重塑用户体验》人民邮电出版社  2013年9月第1版 。 200页 17.2 创建成功用户体验设计的步骤。

[3]  唐 ▪ 诺曼.  《情感化设计》 付秋芳,程进三,  译. 北京 电子工业出版社 2005

 

注1:该创意形成于2013年8月,第一个模型制作于2013年10月,第二个模型制作于2014年2月,2014年6月,谷歌发布Cardboard。

注2:该产品至今做了5个订单,累计生产7000台,作为广告赠品散发给用户。

 

 

 

3   喜欢

操作成功!
请登录您的邮箱获取新密码,请尽快修改您的新密码!