超越按钮,拥抱触摸界面

简介: 苹果iPhone手机的发布,可以说带来了一个全新的“触摸”时代。现如今,就连小孩子都能够非常自然的使用一些触摸设备,手机、iPad等等。父母们一定很惊奇孩子们能够如此快的学会这些设备的使用方式,从这一点来看触屏设备的界面和交互设计中隐藏着很多种可以让使用体验更加简单和有趣的要点。

苹果iPhone手机的发布,可以说带来了一个全新的“触摸”时代。现如今,就连小孩子都能够非常自然的使用一些触摸设备,手机、iPad等等。父母们一定很惊奇孩子们能够如此快的学会这些设备的使用方式,从这一点来看触屏设备的界面和交互设计中隐藏着很多种可以让使用体验更加简单和有趣的要点。
 
菜单栏和按钮的挑战
 
苹果发布的“ Human Interface Guidelines”以及苹果应用审核委员会,对数以万计的应用产生了重要的影响。它帮助众多的设计师和程序员理解了移动界面设计中的核心UI。例如苹果一直推荐的  UITabBar 和  UINavigationBar。然而实际上我们设计或制作的第一个应用可能并没有包含顶部或底部导航,手机屏幕的尺寸是如此珍贵,如果设计了顶部和底部导航,则会占据屏幕20%的内容。我们需要记住的一条原则是: 用尽可能多的空间展示内容
 
在这个充满创新的行业中,设计师需要时间去创造出更有创意、也更加原本的用户界面。也许正是苹果应用审核委员会的拒绝评语“ think out of the box”,才能激发出象  Clear 和  Rise 这样的应用,让我们看到触屏界面设计的一些希望。
 
 
手势驱动界面的威力
 
在两年以前,我在探索手势如何才能为移动应用用户界面带来价值时总结了一条规律,“ 手势的使用必须自然而然”。这也就是为什么 Loren Brichter的“ 向下拖动刷新”几乎成为了行业的一个标准。
 
清除UI障碍
 
开始设计一个更加手势驱动的界面,你面临的最大问题就是“ 不要总是觉得应该把一些导航元素弄成可见的”。相反,我们可以想象一个2-D或者3-D的屏幕空间,可以考虑将导航放在上、下、左、右任何一个位置,设计一个轻轻拖动或者扫过的手势,导航出现。以Facebook和Gmail的iOS版来说,我觉得最重要的一个特性就是“side-swing”菜单。这个UI概念非常易于使用。这样做的好处一方面在于能够让App的显示更加注重内容,另一方面也使得触发另外一个界面只需要一步或者两步操作就可以实现。
 
 
除了界面的导航,App中的内容有时也需要与用户进行互动。在所有内容下放摆放三个按钮,一定会将界面弄的混乱。这时才是使用手势的最佳时机。考虑一下双击屏幕或者长按屏幕。Instagram中,双击屏幕可以对一个内容进行Like或者Unlike。所以别再犹豫了,尽量的使用手势而不是传统的导航控件吧。
 
具有适应性的界面
 
对于一个创新的App来说,预测用户的行为通常是非常困难的。作者在做Belgium's Public Radio的时候,一直困惑于应该为用户提供什么样的界面,最终,决定提供三种不同的界面布局形式,而布局的调整可以通过拖动图标来实现。
 
 
仔细考虑时间、空间和动画
 
用户轻拍一个项目时会触发什么动作?如何对这个动作实现可视化?进入视窗的速度是多少?应该自动消失吗?
 
触摸设备的出现极大的改变了我们设计交互的方式,与传统的思考屏幕和页面的角度不同,我们需要更多的考虑时间、空间和动画这三者的结合。那么你一定会发现,设计并向同事展示这些交互概念,还采用传统的静态页面的方式已经远远不行了。一些原型工具,例如  Pop 和  Invision ,能够创作具有动态效果的原型。这样就非常容易来测试程序的流程,并且来 检验用户会卡在什么地方。这样做充满了实验主义和创新精神,在向客户进行展示时,不再使用传统的静态页面和简单导航,而是将客户邀请进来参与整个交互过程。这样做会增加预算、延长工期,但是如果客户允许你这么做,那一切都不是问题了。
 
 
学习曲线
 
在设计手势驱动的用户界面时,移走传统的导航元素,用户的学习曲线就会对应上升。如果没有适当的用户引导,很可能用户会茫然不知所措。一点小小的探索没有关系,但是必须让用户清楚从哪里开始。很多应用在第一次运行时都有一个介绍,我觉得开场的介绍应该只介绍哪些最重要的交互方式,不要所有的东西都进行解释,那多数用户都会跳过这个步骤。也可以采用另外一种方式进行引导,再用户第一次要用到某个特性的时候进行介绍,Youtube的应用中就有这样的例子。
 
 
Stop Talking,Start Making
 
参考资料:
 
相关文章
|
5天前
|
云安全 监控 安全
|
2天前
|
存储 机器学习/深度学习 人工智能
打破硬件壁垒!煎饺App:强悍AI语音工具,为何是豆包AI手机平替?
直接上干货!3000 字以上长文,细节拉满,把核心功能、使用技巧和实测结论全给大家摆明白,读完你就知道这款 “安卓机通用 AI 语音工具"——煎饺App它为何能打破硬件壁垒?它接下来,咱们就深度拆解煎饺 App—— 先给大家扒清楚它的使用逻辑,附上“操作演示”和“🚀快速上手不踩坑 : 4 条核心操作干货(必看)”,跟着走零基础也能快速上手;后续再用真实实测数据,正面硬刚煎饺 App的语音助手口令效果——创建京东「牛奶自动下单神器」口令 ,从修改口令、识别准确率到场景实用性,逐一测试不掺水,最后,再和豆包 AI 手机语音助手的普通版——豆包App对比测试下,简单地谈谈煎饺App的能力边界在哪?
|
10天前
|
机器学习/深度学习 人工智能 自然语言处理
Z-Image:冲击体验上限的下一代图像生成模型
通义实验室推出全新文生图模型Z-Image,以6B参数实现“快、稳、轻、准”突破。Turbo版本仅需8步亚秒级生成,支持16GB显存设备,中英双语理解与文字渲染尤为出色,真实感和美学表现媲美国际顶尖模型,被誉为“最值得关注的开源生图模型之一”。
1178 7
|
1天前
|
人工智能
自动化读取内容,不会写爆款的普通人也能产出好内容,附coze工作流
陌晨分享AI内容二创工作流,通过采集爆款文案、清洗文本、智能改写,实现高效批量生产。五步完成从选题到输出,助力内容创作者提升效率,适合多场景应用。
205 104
|
16天前
|
人工智能 Java API
Java 正式进入 Agentic AI 时代:Spring AI Alibaba 1.1 发布背后的技术演进
Spring AI Alibaba 1.1 正式发布,提供极简方式构建企业级AI智能体。基于ReactAgent核心,支持多智能体协作、上下文工程与生产级管控,助力开发者快速打造可靠、可扩展的智能应用。
1182 41
|
3天前
|
人工智能 安全 前端开发
AgentScope Java v1.0 发布,让 Java 开发者轻松构建企业级 Agentic 应用
AgentScope 重磅发布 Java 版本,拥抱企业开发主流技术栈。
338 13
|
16天前
|
人工智能 前端开发 算法
大厂CIO独家分享:AI如何重塑开发者未来十年
在 AI 时代,若你还在紧盯代码量、执着于全栈工程师的招聘,或者仅凭技术贡献率来评判价值,执着于业务提效的比例而忽略产研价值,你很可能已经被所谓的“常识”困住了脚步。
959 78
大厂CIO独家分享:AI如何重塑开发者未来十年
|
11天前
|
存储 自然语言处理 测试技术
一行代码,让 Elasticsearch 集群瞬间雪崩——5000W 数据压测下的性能避坑全攻略
本文深入剖析 Elasticsearch 中模糊查询的三大陷阱及性能优化方案。通过5000 万级数据量下做了高压测试,用真实数据复刻事故现场,助力开发者规避“查询雪崩”,为您的业务保驾护航。
572 32