儿童键盘输入交互方式探讨:为熊孩子设计的输入法

想必针对婴幼儿用户所设计的产品出发点与普通的产品设计出发点一定有所不同,那么在设计幼儿产品时,应该考虑哪些交互细节点呢?文章以一款儿童输入法为例,为我们解读了在儿童产品设计过程中该注意的一些交互细节点。


想必针对婴幼儿用户所设计的产品出发点与普通的产品设计出发点一定有所不同,那么在设计幼儿产品时,应该考虑哪些交互细节点呢?文章以一款儿童输入法为例,为我们解读了在儿童产品设计过程中该注意的一些交互细节点。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

为孩子们进行的设计,与我们的设计会有什么不同呢?

把范围缩小一点,孩子使用的输入法呢?是拼音?还是王码五笔呢?

从一个儿童输入法系统说起

在一个韩国的一个展览上,出现了这样的一个输入系统,孩子可以触屏去输入韩文。输入区域由类似于偏旁部首的元素构成,只需要点击键盘,就可以在界面中生成文字。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(韩国一展览上的输入屏幕)

看起来,这个设计似乎没有什么太大的问题?

但有一位设计师,因为孩子出生了,所以想要探讨一下孩子使用键盘输入的交互方式,顺便尝试一下教育。于是他设计了一款app。这个系统的设计过程中,设计师一直在做不同的用户测试,尝试脱离自我,真正用小孩子的视角去看问题。

例如说下图是小孩看文字的视角,上下两组文字的含义是一模一样的,但是由于字体不同,有些偏旁部首粘连的情况不一样,对于小孩子,他们会把相连的块状结构看成是一个东西,下图中的颜色就代表了他们的视觉归类。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(孩子眼中的韩文字分区)

先来点基本的知识吧

要更加深入去理解上面那张图的话,先用我简陋的理解跟大家科普一下最基本的韩语知识。

先讲一下韩文字的基本原理(见下图)。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(韩文字识别表-部分)

简单来说,上图中横轴可类比于拼音中的声母,纵轴可类比于韵母,他们是一一对应的关系,上图中横轴的“ㄴ”对应于“n”,纵轴的“ㅏ”对应于“a”,所以整个字“나”就读为“na”。韩文是一种看见了,就可以读出来的语言。“读”的方面,相比汉字真的简单粗暴很多。

另外就是一个关于布局的小问题,因为待会也会涉及到。横轴的元素会在字的左或者上方(ㄱㄴㄷㄹ等),纵轴的元素则会在右或者下方(ㅏㅑㅓㅕ等)。

为熊孩子量身定做的输入方式

回到这个app,实际上是经过了三个阶段:

1. 第一个阶段(偏旁+键盘)

正如我们一般理解的键盘输入法一样,把文字部件拆分,让小孩子打字输入文字,给予奖励提示。再加上一些自动完成功能,更加提高打字的效率。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(韩字输入设计-阶段1)

理所当然,是吗?

但小孩子不买帐。首先键盘与屏幕之间的关系对于他们就是一个很难理解的地方,为什么本来出现在下方的东西,会出现在上面?

然后刚刚说到的自动完成与调整功能,更是对孩子的挑战,为什么同一个位置的东西突然跑到其他地方去啦?如上方动图所示,为什么本来在字下面的“o”会突然变了位置,出现在其它字的上面了呢?

对于我们,键盘输入是系统学习之后的理所当然,对于孩子,一开始就还没系统接受文字教育,所以如果跳过这一步,先学习键盘打字这样的东西,自然不是马上能接受。

2.第二阶段(偏旁+键盘+动效)

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(韩字输入设计-阶段2)

动效加强了键盘与屏幕之间的联系,起到引导的作用。取消自动完成,避免孩子对文字位置的混淆。还记得开头提到的韩文元素位置吗?横轴的元素会在字的左或者上方(ㄱㄴㄷㄹ等),纵轴的元素则会在右或者下方(ㅏㅑㅓㅕ等)。

因此这一阶段的设计,打乱了传统的键盘布局,根据韩文元素的位置,重新安排键盘的布局。由图中可见,键盘左上方出现的元素是ㄱㄴㄷㄹ等,键盘右下方则是ㅏㅑㅓㅕ等。

3.第三阶段(偏旁+触屏+拼图)

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(韩字输入设计-阶段3)

真正的问题在哪里?认知,识别。孩子们需要更更更直接的交互。

于是设计改为直接移动元素,搭积木一样快捷的方式。然后设计还做了一个小细节,就是把一些会混淆的韩文字的粒度再减小,例如그(读音:keu/geu),  ㄱ(读音:k/g), ㅡ(eu),由于前者是后两者的相加,所以对于孩子可能会造成不同的认知,所以设计中就干脆去掉了“그”,把它拆开,一边学,一边认识他们之间的关联、组合联系,而不是一开始就灌输他们的固有概念。(其实对于这一点我还是存疑,会不会对整体韩语体系的架构认识出现偏差?但那是后话了。)

熊孩子的交互还应该注意哪些点呢

1. 拍(tap )与 按(press)

拍(tap)与按(press)互动的手势有什么区别呢?一个是按住之后,马上给出反馈,一个是按住再松开才会给出反馈。

想想一个小baby,需要什么东西的时候就会用手指“指”(point)给爸妈看,所以对于孩子来说,他们需要的,是最直接的反馈,这么看,“拍”比“按”要更为直接。可想而知如果是双击(tap-tap)的话,更是增加难度了。另外孩子每当拍了什么,就会期望有一些反馈。例如简单的钢琴游戏(见下图),点击按键出现反馈,孩子就会得到满足。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(简单的钢琴游戏)

2.导航

弹出框,导航。对于我们来说这是引导我们走完app的重要指示。但对于孩子却是一种严重的干扰,无法完全理解整个界面的他们,甚至不会知道导航的作用,在他们看来,一切东西可能都是可以点的按钮,“点完了,就要给我玩的东西”。如果真的不可避免,就尽量简单,例如下图,评级,写评论这些全部简化,只剩下一个大大的交叉,即使孩子不知道是什么,也知道要直接去点交叉,关掉整个弹框。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(一个儿童ipad游戏)

3.多图少字

孩子还处于识字的阶段,不认识的文字是一种干扰。Netflix的小孩子频道展示的不是宣传banner,而是小孩子喜欢的卡通人物。只要点开卡通人物,就会出现卡通相关的一系列图片。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(Netflix儿童模式界面)

4. 多触控,互动,群体

孩子们需要交流,需要与同龄人沟通去锻炼社交能力。电子化的今天,沉浸在app里的孩子会不会逐渐变得孤独呢?多触控的游戏为这样的问题提供了一个潜在媒介,例如之前流行的Where is my water游戏ipad版就支持多触控,孩子们可以一起为鳄鱼挖通道,合作,玩耍。

儿童键盘输入交互方式探讨:为熊孩子设计的输入法

(Where is my water游戏)

这是本篇的尾声

追溯到以前,我们也已经有了活字印刷术,王码五笔输入法。他们的形式,内涵与拼字的app类似,早年流行的where is my water,剖开本质,其实也与铅笔连字游戏无异。

所以其实我个人觉得,虽然科技一天天发展,但新的不是内容,新的是我们能够演变的交互方式,新一代的80,90甚至00后设计师也已经为人父母,或者即将为人父母(很快就会变成旧一代设计师了T.T)。

以前是为自己的理想设计,现在很多设计师也开始为自己的下一代设计了。新的交互,新的思考,孩子用着自己的app长大,成为你产品测试的长期用户,该是怎么样的一种体验呢?

参考资料

http://kr.hujiang.com/zt/shipinjiaocheng/

http://questionmarkq.blogspot.hk/2014/07/koreanski-alfabet-okresla-sie-nazwa.html

http://kr.hujiang.com/fayinbiao/#yuanyin

http://story.pxd.co.kr/1126

https://www.youtube.com/watch?v=27bHsRnPwc0

https://uxdesign.cc/design-considerations-for-little-fingers-ad2a19ed3816

 

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

题图来自PEXELS,基于CCO协议

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/21113/

(0)
CatherineCatherine
上一篇 2017-04-27 08:47
下一篇 2017-04-27 10:45

相关推荐

  • 用户体验的目标是做到“自然”

    不想错过精彩的荔枝话题,点击文章左上角关注“荔枝3十1”。每晚10:00点荔枝陪你说一事晚安文/励志妹图/荔枝工作室经作者授权发布用户体验的目标是做到“自然”导语“自然的体验是不需要用户去思考的。”1需要用文字来解释的交互不是好交互(1)我观察3岁的小孩用iphone很容易上手。比如,iphone的开锁,小孩甚至不用学就会用。因为触摸是人的天性,同时iphone通过箭头图标,向右滑动的文字条(小孩看不懂文字),来暗示手指触摸向右滑动来解...

    2018-04-28
  • 交互的未来标配!5个方法帮你设计好用的触控手势

    我们生活在一个人机互动频繁,由设备驱动的世界中。随着触摸屏逐渐成为移动设备的标配,多点触控手势的广泛应用,让我们与手机、平板电脑甚至是笔记本电脑之间建立起了一种更宽广的联系方式。我们通过模拟真实世界…

    2016-03-04
  • 浅谈视觉设计与用户体验的统一

    Dribbble,国内比较追捧的媒体。上面聚集了很多项目的视觉设计图,有的配色很漂亮,有的表现手法很新颖(一定程度上会激发我们灵感的火花),但我们在不了解设计场景、目标的情况下是无法判断出这样的视觉设计是否最终解决了用户的问题。脱离业务场景的设计是没有生命力的更谈不上产品体验、服务体验,只有视觉和体验统一起来才能更好的占有市场,设计才具备了商业价值。

    2017-05-24
  • 用通俗的方式告诉你什么是交互设计

    文章底部可领取设计资源(软件、笔刷、视频教程等)↓↓↓通常来说,拥有成熟产品的大型互联网公司都会设有交互设计岗位,这个岗位在近几年的招聘市场上也越炒越火。不同于视觉设计师有可视化的作品展示,交互设计师的工作大多无法直观可视化或出于保密性难以对外展示,所以在大众心目中始终是神秘的存在。所以今天就来给大家分享一下我作为一个交互设计师眼中的交互是什么样的。文章的目的是帮助对交互设计不太了解,但工作相关或对此感兴趣的人对交互设计进行基础入门的了...

    2018-04-08
  • 用写文章的思路设计banner

    工作中接触了一些banner设计的工作,借着本次整理思路的机会顺便和大家分享下,不周之处欢迎沟通指正。

    2017-05-24
  • “5媚娘传奇”——H5总结大会

    作者:KIKI 去年JDC出了不少优秀的武媚娘...不,H5呢,大家都很拼哒,同时当然也是累计了一些经验和教训啦。今天就从字体,排版,动效,音效,适配性,想法这几个方向结合咱们的例子朕就关上门只跟你来好好聊一聊关…

    2015-01-27
  • 用户体验五要素

    01战略层什么是用户体验:用户在使用产品过程中建立起来的一种纯主观感受。用户体验的重要性:给用户一个积极、高效的体验,他们会持续使用你的产品,产品满足用户某方面的需求并来盈利,帮助人们提高生活质量,提高工作效率,改善人际关系,等等。五要素:战略层、范围层、结构层、框架层、表现层用户体验要素的作用:要素之间相互作用完成任务,创建一个总体的用户体验设计。适用场景:设计:战略层→范围层→结构层→框架层→表现层用户体验:表现层→框架层→结构层→...

    2018-02-06
  • 场景是如何应用到交互设计的?

    我想在互联网领域,大家对“场景”这个概念并不陌生,但组成场景的关键因素有哪些?场景是如何应用到交互设计的?在工作之余,整理下相关知识,相信对大家的产品日常工作有一定的帮助,感谢大家抽出时间阅读,欢迎批评指正。1.场景的基本概念场景是指用户在一定的时间、地点等特定的情景下为了满足某种需求而触发的使用某种方法解决需求的行动画面。其关键因素包括用户、情景、需求、方法。产品的应用场景就是用户使用产品来解决需求的实际应用场景,比如上班族小张在午餐...

    2018-03-02
  • 【干货】学交互设计,毕业以后该做些什么呢

    大家对于交互设计有没有基本的认识,上一次的文章中给大家有过简单的介绍。平时和朋友同学之间再聊到交互设计,会觉得,交互设计都是app网站,但是随着科技的发展交互设计行业涉及很多方面,也有很多新的变化。所以在2018年之后,交互设计会有新的一些行业趋势。全感官体验因为未来找设计会越来越脱离我们所认知的app界面,会从app界面转移到其他的媒介上面去和其他设备上去做交互。全感官体验,因为平时我们都是从视觉上面去或者其他界面上做一个新的交互设计...

    2018-04-25
  • iOS 11 正式版即将到来,这里有 30 个值得关注的变化

    作者:周韶宏   随着新 iPhone 的发布,iOS 11 正式版会在 9 月 19 日推送。 新的操作系统在今年 6 月的开发者大会上面向开发者发布,当时它更像是一个用于展示的、并不完整的简单版。 之后 3 个月,iOS 11 陆续放…

    交互专题 2017-09-13