2015-2016交互体验趋势

980x214

移动产品篇:

2015年移动应用数量增长依然强劲,但是移动交互体验却在发生着变化。较之去年层出不穷的新颖形式,今年交互体验趋势中,更多的是某一个方面的体验优化与深耕,而较少有创造性的引领者出现。这说明移动应用在市场在“爆发”后进入了一个新的阶段。这与智能机市场趋于饱和、手机屏幕尺寸增长与用户对应用的认知提升有着密不可分的关联。

 

今年MUX设计师们依然从体验角度出发,结合现有的报告和资料,寻找那些已经崭露头角,并且会在今年形成一定规模的交互体验趋势。与去年不同的是,我们同时给出了这些趋势的应用场景,希望对移动体验设计师有所帮助。

 

1.多媒体搜索实用化(Extensive Usage of Multimedia Search )

随着技术的不断突破,搜索的输入方式不在仅仅局限于文本搜索,多媒体搜索在搜索结果质量以及精准度上了有了明显的进步,创造了从娱乐向实用的过渡。在很多移动场景下,多媒体搜索较文本搜索有着不可替代的优势。通过《百度移动趋势报告2015》研究发现,移动互联网下一代主力军(零零后)对多媒体搜索的接受度更高。另外数据流量方面,4G增长迅猛也给多媒体搜索实用化提供了必要条件。

1.Camfind可以通过拍照物体进行搜索,准确的识别出搜索对象的颜色,质地,以及属性。并提供相关图片与相关搜索结果。

1-1

  1. Google的语音识别已经成为其搜索的主要形式之一,在很多私人场景中的应用较高,并且其语音转化成文本的精准度也有了很大的提升。

 

1-2

应用场景:文本输入成本过高,没有能力文本输入,或无法用文本描述搜索对象的场景 。

 

2.场景化前置,服务触达增强(More Entries Proposed Contextually)

根据TalkingData发布的《2014移动互联网数据报告》中的数据,全国平均每部移动设备上安装34款应用,平均打开20款。大量应用带来的竞争,促使更多应用希望通过入口前置,提高使用频率,增强易用性。但是在入口前置的方式中,只有部分提高了便捷性,更多的只是增加了用户的使用负担与负面情绪。而适合场景的前置则会显得尤为贴心,减少用户干扰,增强产品粘性与人文关怀。

 

1.网云音乐将“上一首”、“收藏”、“删除” 等快捷功能都前置到了锁屏界面。为那些想快速操作的用户带来极大的便利。同时这些功能也可以收起至“菜单”,可谓是非常的贴心的设计。高德地图将手机导航界面前置到了锁屏,解决了走路用手机导航时需要频繁解锁的不便。

2-1

  1. ios系统的锁屏界面,会根据用户的地理位置以及周边信息推荐可能需要的应用,例如用户在招商银行附近打开锁屏界面,屏幕右下角会出现招商银行应用的快捷入口。

2-2

​应用场景:使用场景明确,需要频繁操作的应用。可在锁屏界面、通知栏等位置加入场景化前置。

3.操作极致简化,核心效率提升(Minimalism of Interaction)

互联网终端多样化,使用场景复杂化,使得用户的操作越来越碎片,而且缺乏耐心。去繁就简,缩短流程成为了不可避免的趋势。与此同时,用户对主流的交互方式的认知程度有了增强,对常规的交互流程的信任度也有了较大提高,一些两年前看似激进的简化方式,现在并不会给用户带来过多的认知成本。

 

1、Blink将多媒体社交的过程极度简化,进行图片内容社交时,将”选择发送对象”,“创作发送内容”,以及“发送”三个动作,均由“点击联系人”一个触发事件完成。进行视频社交时,只需长按联系人,之后后松手即可完成整个过程。

3-1

2.Chrome将窗口的“关闭”、“新建”融入到了“刷新“动作中,一个下拉动作的变形包含三种操作形式。避开了在多窗口中进出的繁琐流程。

3-2

应用场景:操作步骤多且操作频繁的流程简化。如多媒体社交、支付等。

 

4.信息结构轻量化,减少负担(Lightweight of Information Structure)

大屏空间下内容承载更为复杂。在直观的扁平化视觉设计的背后,信息结构扁平化更为重要。出现了信息结构的轻量、清晰化趋势。轻盈的信息结构不仅可以强化内容本身,还能够减少用户对信息结构和逻辑的理解成本,缩短用户到达信息的距离。

 

1.百度手机助手在浏览应用详情的核心、高频路径中,通过半层弹层模式为整体框架和浏览行为“减负”,尽量避免了页面级的跳转,同时降低了用户浏览行为的负担感,使操作体验更加轻盈自然。

4-1

 

2.UniqDay做为 “小而美”的功能型应用,在产品设计之初会更多考虑到用户的学习成本和接受度。UniqDay就是通过轻量化的结构设计让用户在第一次使用的时候就记住它。对于倒数日的添加、编辑设计,UniqDay都巧妙的通过弹层或平移方式帮助用户理解当前所处的位置,使核心模块稳定在用户的视线内,减少页面级的跳转。

4-2

 

3.emo突破了传统的框架布局,极端强化了核心功能。这种沉浸式体验设计是结构轻量化、扁平化极端的表现,使得用户更专注于根据心情听歌的功能与呈现内容本身,而不被其他的操作路径打断。

4-3

 

应用场景:为信息层级较多、页面跳转较多的应用减负,或着功能较简单的垂类应用。

 

5.动效表现更具功能指向性,跨越成本收益鸿沟

(More Functional and Directive Motion Effects)

2014年底Android5.0 Lollipop、iOS8两大移动终端系统的发布,流畅的动效逐渐成为一个应用或系统中的“标配”。目前动效的使用出现了对于设计与情感的过度消费。需要让其发挥更多指向性和功能性的作用。通过指向性、提示性等动效自然映射抽象语言,更加直观的体现出界面、信息之间的层级和逻辑关系,让应用更加简单易懂,简化用户引导流程,降低用户学习成本,甚至带给用户惊喜。

1.Android5.0 Lollipop系统依赖于Material design设计语言对卡片化设计的定义,做出了教科书般的量子动效设计案例。系统上使用大量拟物化,指向性明确动效来引导用户,体现页面层级逻辑。

5-1

2.Yep!采用流畅的位移和变形动效,让用户理解搜索流程(选择一个活动-发送邀请-等待想做相同事情的其他用户匹配-搜索结果)的交互机制,使流程更平滑,更具自解释性。

5-2

 

应用场景:该趋势将普遍适用于应用的场景转换、提示,以及复杂信息层级表现

 

 

6.HTML5互动内容广泛应用,持续丰富产品表现

(Interactive Content Based on HTML5 Could Widespread Use)

2014年10月W3C宣布HTML5定稿。HTML5技术的发展引发了互动形式的创新:可以看到包括摇一摇、3D视图等形态的广泛使用。同时,可以看到2014年主打故事类场景、产品情怀等HTML5的设计,集中引爆移动互联网传播,并将在未来带来持续的浪潮。

 

1、大众点评的《我们之间就一个字》,主打文字方式的阅读表现。以差异化的音效、动效营造出不同的故事场景氛围,利用文字巧妙勾勒出不同主题的文字故事,通篇无人物角色却处处引发用户自身联想,多维度的促使用户产生情感共鸣。

6-1

2.《梦幻水晶球的世界》,细腻视觉画面呈现给用户一个美妙的视觉故事场景。而3D视图旋转等动效让用户可以将视角拉近看细节或推远看全局,像语言故事一样展开故事脉络,引发用户好奇心并吸引用户参与。

6-2

应用场景:强调品牌影响力的运营活动,适合情感化设计。

 

7.卡片化在多终端持续发挥优势,成就经典设计模型

(Continuously Advantage of Card Design)

卡片化内容呈现打破了原有的模式:内容至上,去除一切干扰。是目前应用比较广泛的以一种设计模式。在用户需要浏览大量信息的场景下,提高了内容的呈现效率。同时卡片化在多平台网站设计,以及多种屏幕尺寸适配方面依然具有非常明显的优势。

 

1.手机app的内容展现就采用了卡片化的形式,在信息展现上非常突出,同时针对不同尺寸的设备界面展现效果都很赞。

7-1

2. 在最新发布的apple watch应用中,卡片化的设计应用也很频繁。在下面这个手机百度的界面中,卡片化的设计能够把团购的重要信息一览无遗的展现出来。手机百度中地理位置服务也采用了卡片化的设计,保证不同的卡片组合及内容展现均能突出服务内容。。

7-2

应用场景:需要展现较大量信息的应用,跨平台应用等

 

8.大屏操作优化普及,塑造高效体验(Refine For Big Screens)

 

现如今,大屏手机已经随处可见。更大的屏幕可以展现更多的内容,优势不可比拟。根据《IDC世界智能设备跟踪报告》分析,大屏设备市场份额会持续上升。用户也越来越以开放的心态接受大屏手机。

屏幕越来越大,我们的手则不然。对于4英寸以上的大屏手机,用户的操作体验并不尽如人意。由于屏幕过大带来的操作不便利亟待解决,“为大屏设计”应运而生。通过优化界面结构,增加手势操作,以及适配单手操作布局,可以帮助用户解放双手,在大屏下更加自由便捷的进行操作。

 

1.重点功能底部聚焦:

根据情况将“功能”或“导航”等原本在顶部导航栏的按钮下移到界面底部,确保用户在单手操作时可以在易于操控的区域内,缩短操作路径,降低点击成本。轻单、KEEP、MONO等内容类的应用将主要功能按键设计在屏幕底端,不仅提升了操作的可触达性,同时突出了内容,改善了阅读浏览体验。

8-1

 

2.更多手势操作,滑动代替点击:

以iOS用户为例,常规返回按键多设定在屏幕左上角,对于大屏用户来说是不易触及的点击盲区。而Storehouse配合手势操作辅助,右滑退出界面,带来了极大便利性,滑动代替点击退出的用户习惯也逐步养成。PEEK是一个以手势为主导的应用,通过手势变化进行相应操作,大胆的舍弃了功能按键。

8-2

 

3.单手模式,缩小操作区域:

由于单手操作需求的普遍性,无论是客户端产品还是系统平台都做出了相应适应单手操作的解决方案。用户在特定场景下通过简易触发方式进入单手模式,缩小操控范围,将其控制在页面中下部手指易于触及的区域。iOS系统双击Home键以及锤子手机的下拉悬停,都是在系统层级的交互解决方案。产品层级中,百度输入法创新设计了可自主调节位置和大小的输入面板,得到了很好的用户反馈。

8-3

应用场景:平台类、工具类等,需要单手操作频率较高的应用

 

9.情感化权限请求,转化能力陡升(Prepositive Emotional Request)

 

部分iOS应用在初次使用过程中,会因为功能服务依赖,向用户请求调用系统功能的权限,如获取地理位置、访问相机等。请求方式通常为对话框询问,直接但唐突。通常用户应对这一场景做出的拒绝行为,导致关联功能服务的体验损失,进而会导致流水用户。而在新手引导中强调权限请求的“前置化”则会有效解决这一问题。通过情感化手段传递服务价值,使得用户理解调用的目的,会有效提升用户信任感进而提高授权转化率。

 

1. Looksery产品在调用iOS系统相机请求之前,通过情感化图标和询问式语言,向用户传达了调起相机的作用,让用户了解调用目的,使授权转化率得到很大的提高。

9-1

 

2.Gogobot产品在获取用户地理位置之前,描述对应使用场景及其必要性,满足用户对开放此权限的心理预期,提升授权转化率。

9-2

应用场景:适用于需要请求系统权限的应用,尤其是对其强依赖的应用

 

总体来讲,移动应用体验在未来的一年内,会在各自的领域细化与深耕,将体验向更加极致的方向推进。同时,屏幕尺寸、用户认知积累,以及产品市场的变化,给用户体验提升提供了更加有利的条件。这些变化希望能够被设计师们掌握利用,创造更优秀的体验。

 

 

泛体验篇:

泛体验包含了可穿戴设备、智能家居、虚拟现实、车联网等智能产品带来的新的用户体验。在近两年间这些新兴领域进行了快速的市场试验,虽然竞争惨烈,但其中很多优秀的产品和服务依然会脱颖而出,带给用户出色的体验。而随着今年新兴产品的数量增多,以及互联网巨头的纷纷入局,我们发现好的体验更多的是需要融合硬件、软件以及服务,对整体体验的要求会更高。

mux设计师们结合了部分项目经验,挖掘那些相对于传统交互形式更具有优势,且具备一定市场前景的体验趋势。希望这些趋势能够带给设计师更多启发,突破局限。对未来的体验设计有更多的延伸思考。

 

1.支付手段的交互多样化(The Diversification of Means of Payment)

伴随市场需求与技术进步,更多的支付手段被人们所创造,以适应更复杂的线下消费场景,并推动消费体验的改善。在移动设备领域,Apple Pay与Android Pay逐步商用。更多超出预期产品同期面世。

1.虹膜支付。用户只需在支付中看一眼手机就可以支付鉴权,完成整个支付环节。虹膜支付的安全性和准确性远远强于指纹、脸部识别。英特率先提供了具有支付功能的虹膜手机EyeSmart。

1-1
2.百度钱包联合国内公交系统利用NFC、蓝牙等技术向用户推出手机公交卡充值业务,用户只需将公交一卡通置于带有NFC或蓝牙功能的手机上即可轻松完成充值。另外还能读取用户的卡内余额、交易记录等信息,免去了用户线下排队的烦恼。

1-2

应用场景:支付、理财类产品,有线下业务的O2O产品,可以利用现有技术打通支付制造消费体验闭环。

 

2.操作交互更加细腻(Delicate Interaction)

iPhone上市之初,当大家都在吐槽触屏手机在操作上如何反人类、如何高门槛的时候,没人会想到触控屏幕会像现在这样普及。而当触控操作最基本的点按、拖动等操作已经成为大众的习惯操作后,新的触控技术也进入了量产产品中,带来新的体验。

1.2014年9月发布的Apple Watch,增加了全新的压力感应屏幕。将“点击”这个动作增加了一个维度:可以识别“重击”和“轻击”的区别。如果这种创新的操作能够成功,会将交互动作体系向前迈进一大步。

2-1

2.同样,新的MacBook笔记本电脑加入的Force Touch触控板,可以感知用户指尖的压力,通过不同按压力度实现不同的操作。不但如此,触控板还能够提供不同的触觉反馈。这样新颖交互体验为软件操作体验带来更多想象空间。

2-2

 

应用:支持触控操作的软件或硬件设备,可通细腻操作差别,进行不同体验设计。

3.AR、VR的深度应用(Deep Application of AR & VR)

随着AR(增强现实)和VR(虚拟现实)技术的逐渐成熟,交互体验的将迎来新一轮革命性的改变。从单纯的基础体验到如今深度的沉浸感知。AR(增强现实)与VR(虚拟现实)不断为使用者诠释着未来互动体验的多元化。

对于使用者AR(增强现实)倾向于真实与虚拟世界相结合来服务感知体验。VR(虚拟现实)的特点更倾向于营造出完整的虚拟世界。而就使用场景来讲AR(增强现实)相对于VR(虚拟现实)有着更为灵活、广泛以及可拓展的优势。但两者却保持着独具的体验与行为特点。

1.如今微软hololens全息眼镜应用AR技术,通过语音、手势等感知行为传达给用户展示完整的操作体验与沉浸感。这意味着使用者可以通过终端与外界进行全新的交互行为,为人们日常生活提更为丰富时信息展示与操作。

3-1

2.使用者对产品优质体验的高要求也将强化沉浸式体验的深度升级。Oculus VR(虚拟现实)设备有着惊艳的细节体验处理,为用户呈现更丰富的畅快感,将使用者在游戏中的感官体验真实化、场景化、丰富化。

3-2

应用场景:游戏娱乐虚拟试穿、虚拟家居等广泛场景

 

 

4.无缝的跨平台任务及操作(Continuous Task On Different Platforms)

笔记本,平板电脑,手机,智能手表等等,这些设备切割着我们一天的时间。我们在这些设备上安装着相同的应用,为了可以随时开始我们的工作。跨平台产品通过使用同一账号,便捷的跨终端使用相同功能,在不同的系统和设备间无缝操作同一个事件,保证任务的连续性。

1.苹果handoff:正在iPhone上编写电子邮件,此时走到Mac前,电子邮件已经在Mac上准备就绪,可以从中断的地方继续写。它适用于邮件,Safari,地图,信息,提醒事项,日历,通讯录,备忘录,keynote等。实现了Mac,iPhone,iPad的无缝衔接。

4-1

2.从google搜索网页端给手机(安卓)设定闹钟(目前仅限美国):在网页端搜索框输入“set an alarm”或“set an alarm for 11:00”,发送到选定设备。设定好的闹钟将直接出现在状态栏里,实现从网页到手机的任务传递。

4-2

应用场景:需要多终端即时同步,信息实时更新的效率类产品,以及即时通讯等产品

 

5.Apple Watch应用爆发(Outbreak of Apple Watch Applications)

Apple Watch作为智能手表的代表定义了很多新的体验。它更偏向管家角色,无声的反馈和提醒、健康监测,全新的交互操作,更多的语音互动等等。而与之匹配的应用也有3500余款,可分为“事务管理”、“健康生活”、“轻松游戏”三大类别。 这些应用将会有新的体验,而不会是简单的移植手机端。

 

1.事务管理类:在使用Apple watch版magic应用时,用户只需要点开手表上的应用图标,语音告知需求,这个需求就会被训练有素的各个领域的员工认领,并帮助用户执行。

5-1

 

 

2.健康生活类: Helthkit 通过光电测量法监测流经用户手腕的血液周期变化。再把这些光信号转化成电信号,这样Apple Watch就可以计算出用户的心率数据。

5-2

 

3.轻松游戏类:Apple watch是以展示信息为主,游戏主程序还是在iphone端运行。由于它的精简的信息提示、一键式交互等特点。消除游戏、问答型游戏、卡片类游戏和虚拟宠物养成等类型更加适合。

5-3

应用场景:原有IOS应用在iwatch端的扩展,以及为iwatch量身定做的应用

 

 

6.无人机应用更加广泛(Pervasive Application of UAV )

无人机硬件成本逐渐下降,飞控系统开源,民用和商用技术的逐渐成熟,无人机在民用和商用领域迎来增长。用途包括:航拍、小件物流、空中WIFI热点、安全监测、农田管理、环境监测、搜索救援等等。在降低成本的同时,无人机让服务我们可以享受更好的体验。

1.Matternet与无国界医生组织合作,将诊断结果和药品利用无人机进行运送。目前已准备好商业版的四轴无人机Matternet One。它可以提供一般货物(尤其是午餐和医药)的物流快递服务,能够搭载2.2磅重的货物飞行超过12英里。也可以在雨天和大风天气中飞行。

6-1

2大疆创新在纽约、伦敦和慕尼黑同时发布了大疆Phantom 3系列四轴无人机。可进行高清视频录像,可实现精准悬停和稳定飞行。用户可以在APP上实时查看拍摄内容,进行编辑和分享。

6-2

应场景用:数据监测,航拍,物流,空中WIFI等

7.更加趋于本能的手势交互(Gesture Interaction)

新产品的诞生往往伴随着不同以往的人机互动,从个人电脑点按鼠标的操作,到智能手机手指直接触摸屏幕操作,人们一直在追求更加趋近于人类本能的人机交互方式。但无论是键盘和鼠标或者是触摸操控,传统的操作方式本质上都在将我们的想法通过媒介间接的传达指令。

近几年随着可穿戴设备的兴起,虚拟现实技术的完善。比如挥动下手臂可以移动电脑里的文件,使用一个特殊的手势完成支付,这些人与机器的互动将更加直接并趋于本能。减少媒介的比重。

1.手表是贴近人体的“无感”设备,因此天然具备充当个人与虚拟世界交互入口的潜质。每当用户抬起手腕的时候,Apple Watch能够自动呈现相关信息提醒和个人健康数据,当有电话打来,Apple Watch不用触摸,摆动下手腕,即可接听电话。

7-1

2.Oculus 原本是一款为电子游戏设计的头戴式显示器,目前已经开始运用到建筑设计、教育和医疗等各个领域。它提供的虚拟现实体验使得用户戴上后几乎没有“屏幕”这个概念,用户看到的将会是整个世界。在这个世界里,你将体验到和生活中一样操作。

7-2

总结一下,在2015年,智能设备的泛体验领域经过了一年的摸索将会逐渐成熟且加速发展。加之行业中对产品整体体验的认知逐渐增强,体验设计的重要性与工作范围将会有较大提升。设计师解决问题的方式可以更加多元,希望这些泛体验的趋势能够给体验设计带来新的契机。

 

 

 

分类: 设计用户体验 标签:

[推荐] 百度 MUX2015招聘全面展开

2015job-980

job-ui

工作职责:

1. 负责参与产品(网页、手持方向)的前期视觉用户研究、设计流行趋势分析,主导设定产品的整体视觉风格,拆分设计工作量,时间安排;并跟进开发落地产品
2. 负责日常的运营活动及功能维护提供美术支持,并能够形成产品独特的具有传播力的运营设计风格。
3. 负责参与设计体验、流程的制定和规范 4. 负责分享设计经验、推动提高团队的设计能力

职位要求:

1. 本科及以上学历,美术、设计或相关专业本科以上学历
2. 从事设计行业工作3年以上,对工具型网站的设计有丰富经验,有成功案例案例者优先
3. 具有深厚的设计理论与娴熟的设计技巧,善于捕捉流行趋势,并能推动团队的设计能力
4. 热爱设计,拥有宽广的行业视野与时尚的审美标准(对平面设计、界面设计、网页设计、图标设计、符号设计、品牌设计、手持界面设计等都有了解甚至熟知)
5. 精通Photoshop、Illustartor、Flash等设计工具,了解flash(Actionscript)动画设计的优先
6. 具备良好合作态度及团队精神,并富有工作激情、创新欲望和责任感,能承受高强度的工作压力

投递简历须附上近期作品或链接 发邮件至:(邮件标题请注明“应聘视觉设计师”,附件在6M以内)

 

job-ue

工作职责:

1. 负责百度移动云事业部相关产品的交互设计工作
2. 参与到产品的规划和创意过程中,分析业务需求,并加以归纳、分解出交互需求
3. 设计产品的人机交互界面结构、用户操作流程等,完成界面的信息架构、流程设计和原型设计,提高产品的易用性
4. 编写界面交互设计说明书及交互设计标准规范和交互元件库,并对标准规范及元件库进行维护
5. 配合视觉设计师完成产品视觉设计,并协同前端及开发团队实现交互效果
6. 组织或参与用户访谈,配合用研人员进行可用性测试
7. 研究用户行为和使用场景,优化现有产品的设计缺陷并提出优化解决方案
8. 参与竞品研究,用户反馈和数据分析,进行产品可用性和易用性测试和评估
9. 分享设计经验,沉淀设计方法,总结设计思想,与团队共成长

职位要求:

1. 对行业内产品和应用有深入体验经验和理解、见解,对行业内产品和应用保持高度热情
2. 熟悉UED方法和工作流程;对交互设计有较深的理解和实践,可以独立完成整个设计过程(对流程图、线框图等到交互设计方法能熟练应用)
3. 能够独立负责多个产品或整个产品线,在产品规划、策略等方面有效推动交互设计思路
4. 能够积极参与研究过程,能够将调研结论有效转化为交互设计方案,发现并提出交互设计中的调研需求
5. 对产品有整体规划和梳理产品信息架构的能力,善于梳理各种因素之间的关系
6. 了解手机等移动客户端的交互设计和表现方法 7. 熟悉研究方法论,熟悉一般研究步骤,了解各种研究方法,有一定的统计和数据分析基础
8. 有1年以上交互设计经验,工业设计、计算机、心理学、平面设计、广告设计等相关专业,本科以上学历
9. 熟练掌握专业的设计和原型开发工具,如Photoshop,Illustrator,Axure,Visio等

投递简历须附上近期作品或链接 发邮件至:(邮件标题请注明“应聘交互设计师”,附件在6M以内)

 

Act-job

工作职责:

1. 负责百度移动事业部相关产品的交互设计工作
2. 参与到产品的规划和创意过程中,分析业务需求,并加以归纳、分解出交互需求
3. 设计产品的人机交互界面结构、用户操作流程等,完成界面的信息架构、流程设计和原型设计,提高产品的易用性
4. 编写界面交互设计说明书及交互设计标准规范和交互元件库,并对标准规范及元件库进行维护
5. 配合视觉设计师完成产品视觉设计,并协同前端及开发团队实现交互效果
6. 组织或参与用户访谈,配合用研人员进行可用性测试
7. 研究用户行为和使用场景,优化现有产品的设计缺陷并提出优化解决方案
8. 参与竞品研究,用户反馈和数据分析,进行产品可用性和易用性测试和评估
9. 分享设计经验,沉淀设计方法,总结设计思想,与团队共成长

职位要求:

1. 对行业内产品和应用有深入体验经验和理解、见解,对行业内产品和应用保持高度热情
2. 熟悉UED方法和工作流程;对交互设计有较深的理解和实践,可以独立完成整个设计过程(对流程图、线框图等到交互设计方法能熟练应用)
3. 能够独立负责多个产品或整个产品线,在产品规划、策略等方面有效推动交互设计思路
4. 能够积极参与研究过程,能够将调研结论有效转化为交互设计方案,发现并提出交互设计中的调研需求
5. 对产品有整体规划和梳理产品信息架构的能力,善于梳理各种因素之间的关系
6. 了解手机等移动客户端的交互设计和表现方法 7. 熟悉研究方法论,熟悉一般研究步骤,了解各种研究方法,有一定的统计和数据分析基础
8. 有1年以上交互设计经验,工业设计、计算机、心理学、平面设计、广告设计等相关专业,本科以上学历
9. 熟练掌握专业的设计和原型开发工具,如Photoshop,Illustrator,Axure,Visio等

投递简历须附上近期作品或链接 发邮件至:(邮件标题请注明“应聘交互设计师”,附件在6M以内)

 

分类: 设计用户体验 标签: ,

普通用户怎么看春节红包?——指尖上的春节之态度篇

2015年春节期间各大平台不吝重金为用户提供了丰富多彩的红包玩法,大家也抢的不亦乐乎。普通红包活动参与者如是说,那么普通红包活动参与者对各平台的评价如何,对于手机红包活动又是持什么态度呢,我们通过网络问卷调研了5897位参与过春节红包活动的用户,来听听红包活动参与者的声音吧~

1、从用户抢红包的平台来看,微信、支付宝优势明显,手机QQ紧随其后。

1

2、用户在手机上收发红包主要还是觉得气氛好,图个热闹好玩,可见趣味性是很重要的因素;当然,能抢到实实在在的钱,图个吉利也是吸引用户抢红包的重要方面,让用户感受到诚意也能打动人心。

2

3

3、接下来我们就来看一下用户对各平台在是否便捷、是否有趣味、是否有诚意方面的评价,针对至少同时使用过微信、支付宝、手机QQ三个平台抢红包的用户进行分析(这部分用户占抢红包总体用户的比例为25.6%),微信在便捷程度及是否有诚意方面得到了较多用户的认可,而支付宝在趣味性方面深得用户心。手机QQ在三个评价维度上都没有突出表现,要继续加油了。

4

4、大家都从哪里抢红包呢?各家主推的抢红包活动都是用户抢红包的重头,除此以外微信和手机QQ均发挥了很好的社交属性,用户能方便的抢到来自朋友,同学,家人亲戚的红包,这当中微信做的最好,如果新年想抢更多公司领导,或家人亲戚的红包,那就赶紧用微信吧;而相对社交属性较差的支付宝则通过砸钱方式吸引用户。

5

6

7

5、参与过微信红包活动的用户中,有七成用户表示参与了春晚摇一摇活动,但没有摇到的比例较高,满怀信心却没能摇到红包会让用户感到受挫,可以在体验上有进一步的提升。

8

6、抢到的红包,主要的应用场景是提现、充话费、网购,18岁及以下小朋友则更喜欢把钱用于买道具或Q币,没想好怎么用的也占据了25%的比例,可以为这部分低龄用户提供更适用于他们的消费途径。

9

7、总体上逾六成用户开始都知道抢到的红包是现金,但近三成的18岁及以下用户却当作抢着玩的游戏,并不知道是真钱。针对低龄用户的教育可以进一步加强,货真价实的钱会让用户对抢红包有更大热情。

10

8、红包活动对微信和手机QQ绑卡有明显促进作用,但对支付宝用户绑卡的影响较小。

11

9、大多数用户表示收发红包并不会对自己与身边亲人沟通产生影响;红包只是娱乐消遣,亲情才最重要。

12

注:以上数据源自腾讯问卷系统 http://ur.qq.com

(本文出自腾讯CDC博客: http://cdc.tencent.com/?p=8373)

[懒懒小报-外刊第4期]你如何做AngularJS项目的单元测试?

2015年2月27日 没有评论

微软本周宣布了 Windows Phone 8.1 Update 1,其更新列表中包括 IE 11 引入了对-webkit- 前缀代码的标准模式渲染,对于移动 Web 开发者而言相信是个好消息,来看看知乎上大家都什么看法吧

业界动态

充电站

  • The Basics Of ES6 Generators
    • 如果你对于 ES6 的生成器还不太了解,不妨来看看 Kyle Simpson 的这几篇关于 ES6 生成器的系列入门文章,目前深入浅出地介绍了生成器的概念、生成器中的迭代器、错误处理和委托生成器。
  • First Look: Getting Started with Facebook’s ReactJS Library
    • Kirill Buga 在这篇文章中分享了他的使用 Facebook 的 ReactJS 框架的经验,通过一个 Todo List 的案例来阐释 ReactJS 中的一些概念和模式。
  • Opinionated AngularJS styleguide for teams
    • 如果你的团队已经开始使用 AngularJS 了,有没有考虑过团队的代码风格统一化?不妨参考下 Todd Motto 分享的他的团队中目前 AngularJS 方面的代码风格规范。
  • AngularJS Unit Testing – For Real, Though
    • 除了官方的 Karma,AngularJS 应用的单元测试还有很多其他选择,这篇文章结合 Angular Mocks、Chai、Chai-as-promised 等工具,从可复用的端到端页面、处理 Promise 、mock 控制器和指令依赖、访问子和孤立作用域等几个方面进行了介绍。
  • Debugging in Git with Blame and Bisect
    • Git 提供了 Blame 和 Bisect 两个工具帮助我们定位和调试提交记录,但你是否能熟练掌握这两个工具呢?不妨看看这篇教程,相信会有新技能 Get 哦!
  • Swift for JavaScript Developers
    • 也许你已经见过不少关于 Swift 的教程了,但这篇分享不同之处在于以更贴近前端工程师的视角来认识这门苹果推出的新语言,通过比较 Swift 与 JavaScript 之间的异同来深入浅出介绍 Swift,相信会让你更轻松地掌握这门语言。

百宝箱

  • GabiAxel/ng-polymer-elements
    • ng-polymer-elements 是一个 Angular 的插件,主要解决 Angular 与 Polymer 组件之间的双向绑定问题,从而在 Angular 应用中也可以方便地调用 polymer 组件。
  • mscdex/httpolyglot
    • httpolyglot 是一个 Node.js 模块,用来在同一个端口号上同时提供 HTTP 和 HTTPS 连接,其内部实现机制通过嗅探请求流中的第一个字节来区分的。

附所有链接:
分类: 设计用户体验 标签:

[懒懒小报-外刊第4期]你如何做AngularJS项目的单元测试?

2015年2月25日 没有评论

微软本周宣布了 Windows Phone 8.1 Update 1,其更新列表中包括 IE 11 引入了对-webkit- 前缀代码的标准模式渲染,对于移动 Web 开发者而言相信是个好消息,来看看知乎上大家都什么看法吧

业界动态

充电站

  • The Basics Of ES6 Generators
    • 如果你对于 ES6 的生成器还不太了解,不妨来看看 Kyle Simpson 的这几篇关于 ES6 生成器的系列入门文章,目前深入浅出地介绍了生成器的概念、生成器中的迭代器、错误处理和委托生成器。
  • First Look: Getting Started with Facebook’s ReactJS Library
    • Kirill Buga 在这篇文章中分享了他的使用 Facebook 的 ReactJS 框架的经验,通过一个 Todo List 的案例来阐释 ReactJS 中的一些概念和模式。
  • Opinionated AngularJS styleguide for teams
    • 如果你的团队已经开始使用 AngularJS 了,有没有考虑过团队的代码风格统一化?不妨参考下 Todd Motto 分享的他的团队中目前 AngularJS 方面的代码风格规范。
  • AngularJS Unit Testing – For Real, Though
    • 除了官方的 Karma,AngularJS 应用的单元测试还有很多其他选择,这篇文章结合 Angular Mocks、Chai、Chai-as-promised 等工具,从可复用的端到端页面、处理 Promise 、mock 控制器和指令依赖、访问子和孤立作用域等几个方面进行了介绍。
  • Debugging in Git with Blame and Bisect
    • Git 提供了 Blame 和 Bisect 两个工具帮助我们定位和调试提交记录,但你是否能熟练掌握这两个工具呢?不妨看看这篇教程,相信会有新技能 Get 哦!
  • Swift for JavaScript Developers
    • 也许你已经见过不少关于 Swift 的教程了,但这篇分享不同之处在于以更贴近前端工程师的视角来认识这门苹果推出的新语言,通过比较 Swift 与 JavaScript 之间的异同来深入浅出介绍 Swift,相信会让你更轻松地掌握这门语言。

百宝箱

  • GabiAxel/ng-polymer-elements
    • ng-polymer-elements 是一个 Angular 的插件,主要解决 Angular 与 Polymer 组件之间的双向绑定问题,从而在 Angular 应用中也可以方便地调用 polymer 组件。
  • mscdex/httpolyglot
    • httpolyglot 是一个 Node.js 模块,用来在同一个端口号上同时提供 HTTP 和 HTTPS 连接,其内部实现机制通过嗅探请求流中的第一个字节来区分的。

附所有链接:
分类: 设计用户体验 标签:

[懒懒小报-外刊第3期]React的Virtual DOM有什么秘密?

2015年2月25日 没有评论

本周苹果 OS X Yosemite Beta 公测版正式与广大用户见面,预示着正式版的脚步离我们又近了一步,还没有尝试但想体验的小伙伴们可以前往https://appleseed.apple.com/sp/betaprogram/guide 下载。

业界动态

  • Firefox 31 is out now with a search bar on new tabs, better developer tools, and more
    • Firefox 31 本周发布,功能方面带来新 Tab 页面搜索框、支持 Prefer:Safe 请求头便于家长控制、CSS3 中的变量的实现等,开发者工具方面带来 Canvas 和附加组件调试器,支持 Object.setPrototypeOf()Array.prototype.fill()等。
  • What’s New in Chrome 36
    • Chrome 36 正式版上周正式与大家见面,带来大量优化和提升,对开发者而言更重要的是完善支持 Web Components、无前缀的 transform 以及Object.observe 和 element.animate()
  • Opera 23 released
    • Opera 23 正式发布,CSS 方面支持 touch-actionwill-change 、无前缀的transform 属性,JavaScript 方面支持element.animate()Object.observe()、ES 6 WeakMap & WeakSet,此外还支持 HTML Imports

充电站

  • Analyzing Your Website With the Screaming Frog SEO Spider
    • 如果你在设计站点的 SEO,那么这个 Screaming Frog SEO Spider 应用程序一定可以帮到你,它提供了搜索引擎爬虫的视角来帮助你直观地检视你的站点,并提供了导出 SiteMap 的功能。
  • Introduction to the Resource Timing API
    • 如果你想统计你的 Web 应用的加载性能,资源计时 API (Resouce Timing API )应该可以帮到你,如果你还没有接触过,不妨从这篇入门教程了解下都有哪些可用的 API 和定义吧,此外文中还介绍了浏览器兼容情况,并提供了一个 Demo。
  • The Secrets of React’s Virtual DOM
    • 与 Angular 脏值检测的思路不同,React 选择了使用 virtual DOM 做 DOM diff 从而通过算法以最小的开销在 model 变化时更新视图 DOM,想深入了解其中的机制吗?这篇 Fluent 上的分享为你揭开其中的秘密。
  • Resources for HTML5 game developers ✩ Mozilla Hacks
    • Mozilla Hacks 博客带来这篇介绍 HTML 5 游戏开发者不可错过的一些有用的资源,除了 MDN 上的 Games Zone 之外,还有 Firefox 的一系列开发者工具,以及相关的教程文档等。
  • CSS Shapes: Breaking the Rectangular Design Shackles
    • 这又是一篇介绍 CSS3 Shapes 的教程,借助 Shapes 我们可以将我们的页面打造成像平面设计一样的排版,而不拘泥于块状的栅格排布,这篇文章中通过一个个 Demo 详细演示了 Shape 涉及到的各种 CSS 属性和值,简明易学。
  • ES6 interview with David Herman
    • ES 6 Rocks 就 ES 6 对 Ecmascript 标准核心贡献者 David Herman 进行了采访,重点关注了 ES 6 中的模块化、类机制增强、如今各种针对 ES 6 的转编译器等话题。
  • Comparing Winston and Bunyan Node.js Logging
    • Winston 和 Bunyan 都是较为成熟的 Node.js 日志框架,在功能特色方面也势均力敌。这篇文章从安装、使用、格式化到各自特性对两者进行了对比,让你更轻松了解二者各自的特色。

百宝箱

  • LivePool
    • LibePool 是来自腾讯 AlloyTeam 打造的一款基于 Node 的类似 Fiddler 的跨平台抓包和资源代理工具,支持基于请求路径的本地文件替换和基于请求路径的路由转发,支持请求响应的构建,以及模拟慢网速等特性。
  • SassDoc/sassdoc
    • SassDoc 是一个类似 JSDoc 的 node.js 工具,帮助你自动生成 sass 文件的文档,提供命令行和 node.js 模块以及 Grunt 和 Gulp 的插件。

附所有链接:
分类: 设计用户体验 标签:

动效-APP设计的肢体语言

156-980

引言:如果把APP比作一位美女,那么icon是她的证件照,界面是她的形体,而动效则是她的肢体语言。

在如今玲琅满目的App中,如何脱颖而出?设计师要考虑的,不光是产品如何更合理的展现结构与功能,更重要的是思考自己的App是否能做到简便易懂的同时,又给用户新颖感?此时,有限的屏幕空间紧靠文字的提示是不够的,App需要更多的新鲜血液——“动效设计”。动效设计可以拓展空间内容,简化引导流程,降低学习成本,更重要的是给用户带来意想不到——类似于“Cool”的惊喜,它就像人类的肢体语言,通过肢体语言传达更多的抽象信息和性格展现。

肢体语言(body language)又称身体语言,是指通过头、眼、颈、手、肘、臂、身、胯、足等人体部位的协调活动来传达人物的思想,形象地借以表情达意的一种沟通方式。一个人要向外界传达完整的信息,单纯的语言成分只占7/100,声调占38/100,另外的55/100信息都需要由非语言的体态来传达。肢体语言的重要性可见一斑。
肢体语言大致可分为三类动作:基本动作,招牌动作和高难度动作,这三种动作是如何在APP设计中体现呢?

1.基本动效让用户舒服

基本动作也可称为日常动作,如坐立,行走,握手,拥抱等.对应APP中的基本动作分三类:1.指向性动效(滑动,弹出等)
2.提示性动效(滑动删除,下拉刷新等)
3.空间扩展(翻动,放大等)

不要小瞧基本动作,试想当你看到一位美女起身向你走来结果驼背,外八字,是啥感觉!APP亦是如此。流畅,自然映射,重力模拟这些看似简单但却能让用户在操作时轻松自在并有强烈的代入感。这类动效最重要的是让用户感到毫无负担又如沐春风,也就是不要夺人眼球,悄无声息的顺应用户行为,引导用户需求。
这类动效在设计过程中需要主意几点:
1.系统兼容和资源占用
2.动态速度的节奏
3.仿生性or现实重现

举例:
图片1.3X3动效控件

156-001
2.加载动画

156-002
3.翻页动画

156-006
2.招牌动效加深用户印象

招牌动作是基于基本动作有选择性的差异化展现。例如针对空间扩展而设计的path加号按钮动画。facebook 推出的paper关闭消息的拉伸曲线动画等。
巧妙的设计在满足产品功能需求的基础上更能让用户惊艳。这类动效是APP的专属符号,APP的品牌和逼格展现通过此类动效有较大的发挥空间。。这就像Michael Jackson的亮相pose,他本人or模仿者只要一摆出这个POSE我们就立马想到MJ。同样这类动效的设计更具尝试性和前瞻性,它是动效趋势的实践和探索,甚至能引发跟风潮流。
这类动效设计需要注意的是:
1.操作前的提示引导
2.夸张化和个性化的表现
3.对动态趋势的预测
举例:
图片1.手势提示的动画

156-003
2.特型动画

156-004
3.前瞻性动效演示

156-005
3.高难度动效让用户『WOW』

基本动效让用户舒服,招牌动效让用户印象深刻,只有这些对于一款“高逼格”标签的App还不够。在这个大家都很拼的世界,不来点让人经验的高难度动作很难让别人对你刮目相看。这类动效很酷,很炫,可让用户作长时间的视线停留享受,让用户『WOW』的同时,不得不为设计动效的同学点赞,大大提升了对APP所属品牌及开发团队实力的认可。当然不要忘了APP的主要功用,高难度动作只是锦上添花抑或画龙点睛。所以在APP设计中高难度动作并不一定都会使用,要根据APP的切实需要进行设计。在不干扰主功能的前提下,进行探索展示。所以这类动效多出现在引导页或者特殊功能展示上例如手机清理APP展示清理进度的仪表动效等。

这类动效的需要注意的是:在满足系统资源占用的前提下尽可能发挥吧!Just do it!
图片:仪表盘动画

156-007
基本动效,招牌动效和高难度动效的合理运用,可以让App变得更出众,更性感,更有趣。在App设计过程中,这三类动效要遵循以基本动效为主,招牌动效为辅,高难度动效精选使用,切勿过度炫技的准则。在全民扁平化的设计趋势中,相信动效会为设计带来更多的可能和惊喜。设计师们又多了一片可发挥的领域,各位加油吧!

分类: 设计用户体验 标签:

大屏手机时代,如何重塑界面交互

157-980

这是一个大屏手机的时代。
强调这件事情的意义在于,这已经成为事实。

Medium上存在一份个人统计。
在过去7年,新上市的手机屏幕尺寸越来越大。

157-001

以4.5英寸为分界点,我们更清晰的看到这一变化。过去的两年,4.5英寸的比例从10%升至80%。

157-2

在国内的过去3个季度,使用FHD HD分辨率的手机从38%的份额增至50%。

157-3

【图】《百度移动分发报告2014H1》

更大尺寸的屏幕可以承载更多的内容展现,更适合游戏、阅读与播放视频,体验得以提升。

157-004

【图】《百度移动趋势报告2014Q2》

然而屏幕尺寸的上升并没有引起用户操作上的过多不适,有51%的用户已经适应双手操作。

157-5

【图】《How Do Users Really Hold Mobile Devices》by Steven Hoober

即使用户单手操作,在操作大屏幕时的相对盲区(深色区域),需要更多的响应时间,也可以被接受。

157-6

【图】《Mobile UI ergonomics: How hard is it really to tap different areas of your phone interface?》By Mikkel Bo

即便如此。3.5英寸~4英寸,依然是平衡单手操作与体验的合理尺寸范围。

157-007

这样就产生一个矛盾:用户拥有更大屏幕的尺寸,但从人机交互的角度,并不完美。

面对这一现状,从APP产品界面设计的角度,需要做出改变。

 

大屏幕拥有典型的可用性问题:纵向单手操作机身,边角、顶部、左右侧边难以触达,放置在以上盲区的点击入口,将导致体验路径中断。

 

交互设计角度的最佳实践:

1.设计安全区域,避开操作盲区。

示例,百度搜索结果页,根据视线规律,典型的左上角操作盲区可以用于logo展现。

157-8

2.注意使用场景路径触发的连贯性。

示例,在百度手机助手Android中下载百度浏览器,操作区域集中在安全区域。

 

 

157-009

3.更多的使用可拖动的浮动按钮,给用户更自由的操作可能性。

示例,百度浏览器Android中翻页/返回顶部的组合按钮。

157-010

4.更多的使用手势,并提供暗示。

示例,百度浏览器Android的删除窗口操作。

157-011

5.更多的使用语音作为输入方式。

示例:生活手记中使用语音替代键盘输入。

157-012

6. 横屏Pad化的操作设计,以及更多的内容展现。

示例,百度浏览器iPhone的横屏设计,如同网页的Responsive Layout概念。

157-013

在界面交互的层面之外,在不远的时间,硬件存在更多的优化可能性。

1.更窄的边框,更大的显示比例。

157-014

2.柔性材质。

157-015

3.“手机”成为服务的触发者,屏幕投射与隔空操作。

157-016

《The World as a Display》

 

之所以将讨论的范围扩展到硬件,是希望设计师在针对具体屏幕设计的同时,能够从另外的视角,思考人机交互的变化与可能性,激发创造力。

 

当前是大屏手机的时代,推动你的手机APP产品跟进吧!

 

 

一些有价值的相关基础研究链接

 

  1. 百度移动分发报告2014H1
  2. 百度移动互联网发展趋势报告2014Q2
  3. The Rise of the Phablet: Designing for Larger Phones
  4. Common Misconceptions About Touch
  5. How to design for thumbs in the era of huge screens
  6. Designing for Large Screen Smartphones
  7. Mobile UI ergonomics: How hard is it really to tap different areas of your phone interface?
  8. Insights on Switching, Centering, and Gestures for Touchscreens
  9. A comprehensive look at smartphone screen size statistics and trends
分类: 设计用户体验 标签:

安卓手机使用习惯调研

为提高手机软件的用户体验,百度移动用户体验部有偿招募用户若干名。

如果您身在北京,热爱发现、尝试手机应用,正在使用甚至热衷于使用手机助手软件,速来报名吧!我们将从报名的用户中邀请体验达人来百度北京总部,优秀的你将与优秀的百度同学零距离分享、讨论产品的用户体验,你的建议将引领下一代产品的发展,欢迎大家积极报名!

报名链接:http://uxsurvey.baidu.com/n/index.php/844922/lang-zh-Hans

 

分类: 设计用户体验 标签:

短视频应用使用情况问卷调研

亲爱的用户,您好!

诚邀您填写短视频应用使用行为调查问卷。

我们将在完成问卷的用户中,抽取幸运用户,赠送30元手机充值卡!

期待您的参与,谢谢!

本调查包括23个问题。

问卷链接:http://uxsurvey.baidu.com/n/index.php/275453/lang-zh-Hans

分类: 设计用户体验 标签:

无觅相关文章插件,快速提升流量