`
kennyluo
  • 浏览: 81366 次
  • 性别: Icon_minigender_1
  • 来自: 珠海
社区版块
存档分类
最新评论

手机产品交互设计样式

 
阅读更多

很多人都说,手机产品交互限制因素很多,过小的屏幕分辨率,过低的系统性能,过慢的网速,过弱的电池续航能力等等。但是在限制中还能做出优秀的设计,才显得弥足珍贵,就像风靡Symbian平台的gravity一样。

其实,我认为手机产品交互设计还是有很多想象空间的,它不仅仅是界面交互,而是跟空间、跟时间、跟触觉、跟视觉、跟听觉、跟嗅觉的交互,而且随着技术的推移,相信界面的可扩展性也会越来越好,不管是电子纸(ePaper),还是投影技术应用到手机上,都会让手机界面变得能承载更多内容、更复杂的交互。

我们在使用手机产品的时候,视觉、触觉、听觉是经常被触发的。在此我对互联网产品的交互设计样式进行了分类:视觉交互样式、触觉交互样式、听觉交互样式和嗅觉交互样式。

1.1 界面

界面的信息传达作用不赘述,对交互的影响也不容置喙。

这里我更想说的视觉不仅仅是指界面,而是脱离手机屏幕本身的视觉效果,达到让用户的视觉上的体验越来越丰富的效果。

1.2轨迹球

当有新消息到达的时候,带有LED灯轨迹球的手机都会让轨迹球闪烁,起到提醒作用。相信不久的将来,五彩的轨迹球和轨迹球上写字都是可以实现的,到时候你可以根据不同的轨迹球颜色和文字提醒,在屏幕暗下的状态下也能判断出是什么新消息,来自谁。

图1 HTC hero和黑莓8900的轨迹球,在来电来消息的时候可以闪烁发光

1.3 指示灯

目前主流手机的LED指示灯大多是可以控制的,包括LED的颜色,亮的时长,灭的时长,都可以控制。之前指示灯多是用在提示电量不足,当快没电的时候,指示灯会按照一定的频率闪烁红光。充电的时候,红色指示灯常亮,充满电之后变成绿色。后来指示灯又被用在提醒功能里,有新消息、未接来电的时候,指示灯也会频闪。

图2诺基亚N900,指示灯,开机、充电、来电都会亮起

1.4 投影

Logic Wirele带投影功能的手机,被很多人认为是中国山寨手机的胜利。据了解,投影手机最早的机型来自中国南方。

图3 这款Logic Wireless投影手机Logic Bolt即将在美国上市,签约价格在2年100美元左右

图4 三星投影手机i7410,内置了德州仪器DLP微型技术的投影仪,投影的图像尺寸最高可达50英寸,可以为幻灯片、视频播放等手机功能提供投影服务

随着科技的发展,全息投影才是投影的未来。设计师Mac Funamizu设计了采用全息技术的革命性概念手机,这款手机的屏幕部分是一块空洞,利用全息技术生成图像,这样你在打电话的时候不仅能看到对方,而且看到的还是对方的3D图像,你可以旋转从不同角度观看,就像是出于真是场景一样。并且还可以通过这样的技术查看google三维地图。

图5 Trou Hologram采用全息技术的革命性概念手机

2.1 按键操作

触觉样式,不得不提到按键操作,按键可以执行基本操作,如回到主屏幕、调出菜单栏,也可以执行快捷键操作,如用1、3键翻屏,用音量键翻页等等。

2.2 手势操作

触屏手机的出现,让手势操作变得更加让人追捧。通过长按拖拽,交换应用程序的位置。通过两指拉伸,放大图片。

图6 常见的手势操作

2.3触觉反馈

你打了人,会有一个反弹力,告诉你你打到他了。你按下了手机上某个按钮,我们会改变按钮的状态告诉你,它被点中了。但是Nexus one采用了另一种形式为你提供反馈,就是震动反馈。

图7 Google的Nexus one手机,在你按下某个物理按键的时候,手机会震动一下,告诉你它被点中了。这种方式也曾在三星Anycall Haptic中试用过。

图8 三星Anycall Haptic手机,在使用某些特定功能时可以通过触觉向用户传递信息。

这个反馈方式在很早之前曾被用在手机的来电提醒里,其实还有很多可以使用的场景。这点是手机跟电脑最大的不同,你无法想象,你点了电脑上某个按钮后,硕大的主机或者显示器震动一下是什么样子吧?

索尼公司开发的“触觉引擎(TouchEngine)”使用了一个触觉产生器,将电子信号转化为运动,它可以通过震动的节奏、强度及变化的快慢等方面的差异来告知用户是谁打来的电话或来电的紧急程度。让体验来的更具体和实在。

『光诱导形状记忆聚合显示屏幕』(Light-induced Shape-memory Polymer Display Screen),让触屏设备的回馈更生动形象。

图9 微软的光诱导形状记忆聚合显示屏幕专利

这套主要是在说一个利用红外线来侦测触碰,同时选择性来改变表面状态的东西,也就是说,要让表面凹凹凸凸,或是平坦柔顺,全都靠特定波长的光来决定,好比说系统可以在默认为按键之处,投射某某波长的光,那该处就会显示突起,一旦人手跟表面接触后,势必会干扰到该投射光,系统要是侦测到相当程度的改变,就会自动让表面进行平坦、凹下等变化。相信到时候,设计师不得不考虑屏幕按下的效果了,说不定还可以做PC上的“鼠标悬浮”效果,当你的手机处于某个可点区域的上方时,会获得更详细的操作提示。

随着数字音频技术的发展,靠声音来与用户进行交互已经变得非常普遍且流行。比较常见的如新消息到达时的声音通知,Twitter的新消息被赋予鸟儿鸣叫的声音(Twitter的中文名经常被媒体翻译成“鸟鸣”还真的很贴切呢)。

人耳可以较容易的分别声音的强度、长短、音调、音色、节奏、旋律等特质。所以,声音一直被用来做为视觉的补充条件,提升用户体验。常见的声音反馈方式有——

3.1 反馈音

我们用手机进行输入的时候,不同的手机会伴随着按键动作产生不同的反馈音,类似的操作按键被点击,都可以有相应反馈音。注册成功、升级成功也可以有成功提醒反馈音。

3.2 警示音

当执行危险操作的时候、登录失败、下载失败、电量不足、倒计时时间将至的时候,会播放警示音告诉我们有危险;

3.3 提示音

当用iPhone发短信的时候,发送成功之后,会有一声确认提示音。用新浪微博客户端Weico刷新Timeline后如果有新消息达到,会有新消息提示音。这种提示音的好处,就在于,你可以执行操作之后就取做别的事情了,如果听到提示音,就知道消息发送成功了,有新消息到达了,有效的告知了用户。

3.4 拟物音

清除文件的时候,播放倾倒垃圾时跟垃圾桶碰撞的声音。QQ好友上线了,会有咳嗽声提醒,有新的加好友请求,会有敲门声提醒。

3.5人声

能不能靠模拟人声进行提醒呢?iPod shuffle依靠VoiceOver功能成为第一款会说话的 iPod。假如你在听一首歌曲,想要知道它的名称或表演者姓名。只需点按 iPod shuffle 顶部的全新按钮,它就会告诉你3。你甚至可以通过 VoiceOver 听到播放列表名称,并在它们之间进行切换。此外,如果你的电池需要充电,VoiceOver 也会告诉你。

图10 iPod shuffle的VoiceOver 会讲 25 种不同语言的原因,它可以你的母语说出歌曲和表演者名称

当然,尽管利用听觉可以做出很多有趣的交互体验效果,但是不能完全依赖听觉交互进行设计,因为在移动设备上听觉交互还有很多难题没有解决——环境,手机的使用环境复杂多样,在地铁上、路上等嘈杂的环境里,手机的声音可能就会变得微乎其微,听觉交互的可识别性将会大打折扣;噪音,当过度的依赖声音交互的时候,可能反而会形成一种噪音,干扰别人的生活。

所以,听觉交互要配合视觉交互一起使用,并且给予用户控制权,用户可以取消不需要的听觉反馈。

相对于视觉和听觉在交互系统中的运用,人们对气味的感知和反应能力还未被很好的利用。相关研究表明,气味能有效的唤起人的某些情绪。随着交互技术的发展,嗅觉体验正越来越被重视。

我们可能已经不稀罕环绕式立体声、宽屏高清电视之类的家庭影音系统了,设计师David Sweeney设计的“Surround Smell”把我们带入了新一波的体验中。这个设备内置有16种独特新颖的气味,用一个微电压泵控制,可以根据电视里不同的场景散发出不同的气味,来传达出不同的信息。譬如当电影情节发展到热带丛林里时,整个房间就会弥漫着一股丛林的味道,从而可以让人产生身临其境的感觉。

交互技术的迅猛发展,带来了新颖的交互行为,那些昨天还是出现在电影里的镜头,今天就活生生的出现在我们生活里。不过这些形式都是浮云,都是为了取悦用户,好的用户体验才是我们的终极追求。

以上是针对视觉交互、触觉交互、听觉交互、嗅觉交互几大类交互样式进行的梳理,尽管现阶段手机产品交互设计还大多数停留在视觉交互中的界面交互阶段,按键手机会有一些按键跟界面的互动,但是相信我们会在界面交互结构之上,探索更多的交互设计可能性,把复杂的交互设计变得简单化,站在用户的角度,不断提升交互体验

分享到:
评论

相关推荐

    用户交互设计:手机产品交互设计样式

    ### 用户交互设计:手机产品交互设计样式 #### 引言 在移动互联网时代,手机作为最普及的智能终端之一,其交互设计对于提升用户体验至关重要。本文将深入探讨手机产品的交互设计样式,尤其聚焦于视觉、触觉、听觉...

    简单交互设计个人相册.zip

    在IT行业中,交互设计是构建用户友好界面的关键环节,它关注如何使用户与产品或服务进行有效、愉快的沟通。本项目"简单交互设计个人相册"是一个适用于个人网站的解决方案,旨在提升用户体验,使访客能够轻松浏览和...

    手机软件交互设计经验分享–硬件、系统平台和设计规范的影响整理.pdf

    设计规范在手机交互设计中扮演着关键角色,它们定义了控件样式、布局规则、响应方式等,有助于保证设计一致性并减少重复工作。比如,S60第3版的菜单设计有明确的调出和收回规则,Android和Iphone OS则各自有其特色,...

    AxureUX手机移动端交互原型通用元件库v2.0(兼容AxureRP9).zip

    在实际使用中,设计者可以将元件库中的组件直接拖放到工作区,进行组合和定制,实现快速布局和交互设计。每个组件不仅包含了视觉样式,还预设了基本的交互行为,如点击效果、滑动动作等,使得原型更接近真实应用,...

    智能手机UI主题界面交互设计.docx

    在当前数字化时代,智能手机UI(用户界面)主题界面交互设计扮演着至关重要的角色。随着科技的飞速进步和消费者需求的多样化,UI设计师们面临着如何创造出既美观又实用的手机界面的挑战。智能手机UI主题界面不仅关乎...

    人机交互实验二 机票订票网站界面设计

    在“人机交互设计实验二指导书.doc”中,可能包含了对这些原则的详细解释,以及设计过程中的注意事项和步骤。而“人机交互实验二 机票订票网站界面设计.docx”很可能是对整个设计项目的总结,包括设计目标、设计草图...

    AxureUX手机移动端交互原型通用元件库 v2.0(元件库版).rplib

    总的来说,AxureUX手机移动端交互原型通用元件库 v2.0是移动应用设计领域的得力助手,它通过提供丰富多样的交互元素,简化了设计流程,提升了设计品质,是每一位专注于移动应用交互设计的专业人士值得拥有的资源。...

    交互设计-响应式Web设计实践 PDF电子书下载 带书签目录 完整版

    交互设计(Interaction Design, IxD)是一种关注于人与产品之间互动的设计方法。它强调的是用户体验,通过优化产品的可用性、易用性和用户满意度来提升产品价值。在Web开发领域,交互设计侧重于网页界面如何响应用户...

    axure原型设计-手机壳.zip

    Axure是一款广泛应用于产品设计和原型制作的工具,尤其在IT行业中,它是产品经理、交互设计师和UI设计师的得力助手。本压缩包“axure原型设计-手机壳.zip”聚焦于手机壳这一产品,旨在通过Axure来创建一个手机壳的...

    ios、Android、web端交互设计流程及经验.docx

    交互设计流程及经验 本文档主要讲解了交互设计的流程和经验,涵盖 iOS、Android 和 Web 端的设计规范、设计模式、页面排版布局和视觉心理学等方面。下面是对应的知识点: 一、设计规范 1.1 平台设计规范 * iOS ...

    手机APP用户体验设计中的一致性探究.pdf

    2. 交互设计的一致性:交互设计的一致性意味着相同的操作在不同场景下应有相同的结果。例如,滑动动作通常用于浏览列表,点击则用于选择或触发动作。保持这些交互模式的一致性,有助于用户形成习惯,提高使用效率。 ...

    应用博客APP(整套简约APP手机移动端UI界面UX交互设计作品集XD分层素材模板xd).zip

    【标题】"应用博客APP(整套简约APP手机移动端UI界面UX交互设计作品集XD分层素材模板xd).zip" 提供的是一个完整的移动应用UI界面设计资源集合,特别针对博客应用进行了设计,采用简约风格,同时包含了UX交互设计元素...

    85黑白灰家具设计产品交互动态全套网站源代码.rar

    《85黑白灰家具设计产品交互动态全套网站源代码》是专为家具设计领域打造的一款网站模板,它集成了前端动态交互功能,为展示家具产品提供了专业且现代的在线平台。这款源代码包含了丰富的HTML元素和交互效果,旨在...

    工作室小清晰产品服务企业交互案例设计展示手机响应式responsive.rar

    标题 "工作室小清晰产品服务企业交互案例设计展示手机响应式responsive.rar" 提示我们这是一个关于交互设计和响应式布局的项目,可能是一个工作室为产品或服务制作的展示模板。描述中的 "html" 指出这个项目是基于...

    手机 移动端Axure交互原型通用模板.zip

    本资源——"手机 移动端Axure交互原型通用模板.zip",提供了一套专为移动端设计的Axure交互原型模板,旨在帮助设计师和产品经理高效地创建手机应用的原型。下面我们将详细探讨Axure、移动端原型设计以及如何利用这些...

    互联网前端交互设计简历模板.zip

    在互联网行业中,前端交互设计是连接用户与产品的关键桥梁,它负责将视觉设计与功能代码融合,创造出流畅、直观的用户体验。本压缩包文件“互联网前端交互设计简历模板.zip”包含了一系列不同格式的简历样本,旨在...

    互联网前端交互设计岗位个人简历模板.zip

    在互联网行业中,前端交互设计是连接用户与产品的关键桥梁,它涉及到网页的视觉表现、用户体验设计以及技术实现。本压缩包“互联网前端交互设计岗位个人简历模板.zip”提供了适用于该岗位的简历模板,旨在帮助求职者...

    Axure手机开发必用的设计素材

    Axure是一款广泛使用的原型设计工具,尤其受到产品设计师和交互设计师的喜爱。本资源集合是针对手机开发的专业设计素材,旨在帮助设计师们快速构建手机应用的交互原型。 Axure手机开发必用的设计素材包含了丰富的...

    人机交互界面设计大作业冲锋岛游戏网页(2页))

    在这个“人机交互界面设计大作业冲锋岛游戏网页”项目中,我们看到了一个完整的网页设计实例,它包括了首页和二级页面,并且具备了留言板功能,能够适应手机端和PC端的不同设备。 首先,我们要关注的是HTML,这是...

Global site tag (gtag.js) - Google Analytics