【产品设计】Android 和 IOS 的交互设计对垒

news/2024/4/23 19:40:04/

在手机操作系统百花齐放的年代,也是产品经理最头疼的年代,因为需要根据不同的操作系统做出不同的设计。而如今,手机操作系统基本只剩下安卓和IOS两大阵营,只需处理好安卓和IOS交互上的差异部分就可以做好产品设计了。

在这里插入图片描述
手机操作系统发展至今,基本只剩下安卓和 IOS 两大阵营,虽然部分平台还有提供其他手机操作系统的 App 下载,但基本也是处于不再维护升级的状态。

在这里插入图片描述
在手机操作系统百花齐放的年代,也是产品经理最头疼的年代,因为每个系统的交互都有所不同,因此要求产品经理在做产品设计时,需要根据不同的操作系统做出不同的设计。

这样令人头疼的问题随着手机操作系统的逐渐消亡而锐减,而安卓和 IOS 两大系统在发展过程中相互借鉴,在交互上基本大同小异,产品经理现在只需要处理好安卓和 IOS 交互上的差异部分就可以做好产品设计了。

如果你是一名 App 产品经理,但只用过其中一个系统,对另外一个系统不熟悉甚至没有用过,相信这篇文章对你会有所帮助。

*本文的安卓系统泛指所有基于安卓底层的操作系统,包括各大手机产商定制的基于安卓的操作系统,不限定于安卓原生系统;笔者手头没有 IOS 设备,部分与 IOS 系统有关的图片均来自互联网,旨在说明原理,可能与实际界面有所出入,请注意分辨。

一、侧滑返回手势

IOS 诞生之初就设定了返回的操作只能有一个途径,就是点击左上角的“返回”按钮,随着手机屏幕越来越大,果粉们的手越来越够不到左上角的“返回”按钮,因此在2013年 IOS 7发布的时候,带来了“极其先进”的侧滑返回手势。

这个交互手势给手机产商的产品经理们带来了灵感,国产定制的安卓系统纷纷跟进,也带来了全局侧滑返回手势,不仅可以从左往右滑,还可以从右往左滑,对于大屏手机来说,简直不要太好用,甚至原生安卓系统也跟进开发了相应的手势操作功能。

这个时候,果粉们坐不住了,随着这几年手机屏幕的发展,形成鲜明对比的是毫无变化的返回手势,果粉们开始吐槽:为什么一定要按住左侧边缘才能激活侧滑返回手势?为什么不能从右侧激活?为什么不能在任意位置激活?

以上就是两大系统关于返回手势的背景和现状。因此,我们在设计这两大系统的 App 返回手势的时候,交互上需要有所区别。

首先,安卓系统的 App 不建议设计边缘侧滑手势,比如侧滑返回上一级,或侧滑显示菜单等,因为上文所说的全局侧滑返回手势几乎是所有安卓系统标配的功能,而且这些返回手势都是系统级的,也就是说,应用内边缘侧滑手势可能永远都不会被触发。

当然,也有部分手机操作系统考虑到这个问题,所以对返回手势进行优化,从中下方侧滑激活全局返回功能,从上方侧滑触发应用内的功能。
在这里插入图片描述
下图支持侧滑手势的应用中,在应用中下方激活边缘侧滑的时候,出现了返回的提示图标,表示激活了返回手势;在应用上方激活边缘侧滑的时候,触发了应用的功能,这个应用刚好也是通过侧滑返回上一级页面,并且在侧滑的过程中还可以触发“浮窗”功能。
在这里插入图片描述
我们平时单手握持手机,用大拇指进行操作的时候,无论是用左手还是右手,触控区域主要集中在应用中下方。
在这里插入图片描述
所以要触发应用内的侧滑功能,需要双手同时进行,对用户来说这不是一个方便的操作。

也有人会说,可以做全局侧滑的手势。下图是另外一个应用,在应用的多个界面都做了全局的侧滑手势,即使不用贴着边缘也可以触发手势,使用起来是比贴边侧滑更容易触发,但是,在这个应用中,不同界面的侧滑手势会触发完全不同的功能,下方截图就有3种完全不同的交互。先不说开发的时候,根据不同界面区分手势的不同功能需要花费的时间和精力,光是用户在操作这些功能时眼花缭乱,因为无法预知在什么地方侧滑会触发什么功能而被劝退时,对用户来说,这都算不上是一个体验合格的功能。
在这里插入图片描述
全局侧滑还有一个风险,就是误触发。单手操作的时候,用户的触控轨迹是一个扇形的形状,用户在做上下滑动的时候,如果手指不够灵活,或应用对手势的识别调教得不够精准,很容易变成左右滑动而误触。

在这里插入图片描述
最后总结一下安卓应用的边缘侧滑设计:

1、尽量不做侧滑设计,安卓系统级的侧滑返回已经足够便捷;

2、如果一定要做,尽量不要在侧滑中加入多个功能,如侧滑返回上一级,同时还能触发“浮窗”功能;

3、如果一定要做侧滑,侧滑中包含的功能要有其他更符合用户直觉的补充触发方式,如通过左上角同样可以返回,通过隐藏菜单同样可以触发“浮窗”功能。

在这里插入图片描述
在 IOS 中则不一样。苹果要求上架到 App Store 的应用在侧滑返回的手势操作上需要遵循苹果的规范,即通过边缘侧滑返回,有的应用取巧做了全局侧滑返回,涵盖了边缘侧滑的操作,也算符合规范,而我个人建议,也是可以在 IOS 端的应用中加入全局侧滑返回的设计。

虽然全局侧滑返回我在上文提到有误触的风险,但在 IOS 对边缘侧滑返回这个设计做出“更加先进”的升级前,至少可以在某种程度上缓解果粉们对这个设计深恶痛绝的情绪。但是要注意,在 IOS 上的全局侧滑,建议只做返回上一级页面的操作,经过 IOS 多年的“教育”,果粉们已经很清楚,从左向右侧滑就是返回上一级的逻辑,IOS 系统应用甚至连 Tab 页的切换都要求用户通过点击来完成,没有通过侧滑切换的操作,所以产品经理们没有必要再“创造”新的交互来“为难”果粉们。

二、长按与滑动

安卓诞生以来,系统层面充斥着各种长按操作:长按进入编辑模式、长按弹出隐藏菜单、手机控制中心的图标长按可以进入设置页面等,安卓用户几乎到了看见某个界面就能预测到什么地方可以进行长按操作的程度。

而 IOS 却是极尽所能地避免长按的操作,诞生之初,IOS 的长按操作主要限于桌面长按图标进入桌面编辑模式,任务中心长按图标进入编辑模式(IOS 7之前),长按选取文本等,而 IOS 系统几乎没有长按弹出隐藏菜单的功能,只有在输入框长按的时候会弹出复制粘贴文本的菜单等。

2015年,苹果在新发布的 iPhone 6s 上带来了极其先进的 Force Touch 技术,使得手机可以在用户操作屏幕时感应按下的力度,从此,手机也变得“知道轻重”,重按图标弹出快捷操作,重按短信列表快速预览对话内容,重按图片快速预览大图等。

然而果粉们并不买账,重按操作首次在手机上出现,令果粉们无所适从,操作的时候要控制力度,比如想重按文章列表预览文章,力度小了,预览出不来,反倒触发了长按的操作,力度大了,直接打开文章,终于掌握好力度,打开了预览,手指得一直按着,一松手又回去了,一用力又变成直接打开,而且预览的时候只能看到第一页,对于用户来说,这么费劲的操作还不如直接点击打开来得便捷。

苹果也意识到这个问题,所以在后续的 IOS 版本升级中,取消了重按的逻辑,把一些原本通过重按触发的快捷操作变成了长按,于是,长按的操作开始在 IOS 系统中“遍地开花”。这套新的逻辑,iPhone 用户是否买账呢?在写这篇文章之前,我找了一个用 iPhone 手机的朋友了解了一下,总结一下他日常用得最多的几个长按操作:

  1. 长按复制和粘贴文本
  2. 长按识别二维码

当我告诉他,长按控制中心的手电筒图标可以弹出亮度调节功能的时候,他露出了一副不可思议的表情。至于长按桌面图标会弹出快捷操作,这个他是知道的,但那是因为他要卸载 App 的时候触发的,平时从来没有用过。

是的,陪伴过 iPhone 成长的果粉们,在很多界面上依旧没有长按操作这个概念,当他们看到控制中心的图标的时候,他们知道这些图标可以点击,但却不会把它们跟长按联想到一起,而安卓用户则不一样,当他们看到 IOS 的控制中心,他们就知道那些图标可以长按,只是安卓用户会认为长按图标应该是进入设置页面,而不是弹出快捷操作。

IOS 最早的列表操作是通过向左滑动来进行删除操作,随着系统的迭代,左滑菜单的操作已经不仅限于删除,一方面是因为 IOS 的要求规范,另一方面 IOS 的用户已经习惯了通过左滑来对数据进行操作,所以在进行 IOS 端应用的设计时,需要注意遵循这个原则。
在这里插入图片描述
安卓则不一样,在安卓系统中,几乎没有通过左滑来进行操作,因此,如果将 IOS 的交互规范放到安卓的应用中,用户会摸不着头脑,当安卓用户找不到一个操作的时候,他们会习惯性长按,所以,同样的功能,IOS 端的应用通过左滑来操作,安卓端则是要设计成通过长按来操作。
在这里插入图片描述

三、生物识别

2015年,iPhone 5s 发布的时候,正面的圆形 home 键集成了指纹识别功能,iPhone 再一次改变世界,让指纹识别不仅限于考勤打卡,安卓手机也迅速跟进。

指纹识别诞生之初主要是作为锁屏的解锁方式之一,随着移动支付遍地开花,指纹识别的场景也得到了进一步的丰富,指纹识别的安全性也逐步发展到可用于替代支付密码的程度。

为了提升指纹识别的实用性,无论是 iPhone 或是支持指纹识别的安卓手机,都开放了生物识别的接口,不止系统应用,第三方应用也可以在特定的场景下使用系统提供的指纹识别功能,但 IOS 和安卓系统提供的生物识别接口形式有所不同,所以在产品设计时需要注意区分两端应用的不同交互。

我们可以先看看两者生物识别的工作流程。
在这里插入图片描述
从图中可以看出,安卓的指纹识别全部通过接口形式实现,每次识别都会返回识别结果,所有的界面和交互都需要第三方应用来做;而 IOS 则不同,第三方应用调起 IOS 的指纹识别,会直接触发 IOS 系统级的识别界面,接下来的交互由 IOS 进行,用户识别成功后 IOS 会告诉第三方应用识别的结果。

我们来看一下实际的例子。

以下是某安卓应用调用指纹识别的界面,调用后,等待识别的界面和验证失败的页面都是在收到系统指纹识别的接口返回信息后,由第三方应用进行展示和提示。

在这里插入图片描述
再来看看 IOS 应用调起指纹识别的交互,在 IOS 应用中,调起指纹识别后,识别的过程直接由 IOS 系统进行接管。
在这里插入图片描述
2017年,苹果发布了 iPhone X,人脸识别在 iPhone 上全面取代指纹识别,但是第三方应用调用人脸识别的核心逻辑与调用指纹识别是一样的,可以参照上述逻辑进行设计。

四、应用版本更新

自诞生以来,碎片化一直是安卓系统的一大弊病,虽然也有 Google play 这样的官方应用商店,但因为众所周知的原因,在中国大陆并没有用起来,反倒催生了一大批第三方应用商店,豌豆荚、应用宝等,曾经是多少安卓用户装机必备的 App,随着各大手机厂商逐步完善健全自己的应用商店体制,第三方应用商店越来越少人问津,但安卓应用的安装依旧统一和固定的安装途径,时至今日,依旧只要一个 apk 的安装包就可以避开所有应用商店直接安装。

IOS 则不同,2008年,IOS App Store 推出,意味着以后在 iPhone 上安装第三方应用有了一个官方且唯一的途径。

因为以上的原因,所以导致了在设计安卓和 IOS 的第三方应用更新版本时的逻辑也不相同。

IOS 由于要求应用需要统一从 App Store 下载或更新,所以当 IOS 第三方应用检测到新版本后,会直接跳转该应用在 App Store 对应的页面进行更新。

安卓在检测到版本更新时,可以根据设备进行判断,直接跳转到对应设备的官方应用商店进行更新。

但目前推荐还是采用直接下载 apk 安装包的形式,这也是大多数应用采用的更新方式。但建议在推送更新之前,优先在各大应用商店上架最新版本,目前很多手机在安装 apk 包的时候,如果该应用在官方的应用商店有上架,系统会提示到应用商店安装,用户很容易被引导到应用商店,如果此时应用商店的版本没有更新到最新,用户很容易就错过这个版本的更新。
在这里插入图片描述


http://www.ppmy.cn/news/46920.html

相关文章

微信小程序登录注册页面

// login.js // 获取应用实例 var app getApp() var api require("../../utils/api.js")Page({data: {motto: zhenbei V1.0.0,userInfo: {},hasUserInfo: false,disabled: true,btnstate: default,username: ,password: ,canIUse: wx.canIUse(button.open-type.get…

EMQX vs Mosquitto | 2023 MQTT Broker 对比

引言 物联网开发者需要为自己的物联网项目选择合适的 MQTT 消息产品或服务,从而构建可靠高效的基础数据层,保障上层物联网业务。目前市面上有很多开源的 MQTT 产品,在性能功能等方面各有优点。本文将选取目前最为流行的两个开源 MQTT Broker…

Python入门教程+项目实战-9.5节: 程序实战-模式匹配算法

目录 9.5.1 何为模式匹配? 9.5.2 朴素模式匹配算法 9.5.3 系统学习python 9.5.1 何为模式匹配? 模式匹配是数据结构中字符串的一种基本运算: 给定一个子串,要求在主串中找出与该子串相同的所有子串,这就是模式匹配。举个简单的…

1. 大端法和小端法

int32_t num 0x01020304;一个int32_t是4个字节,在内存中的存储是高位字节在低地址,低位字节在高地址。 (数字)前者的高低是数字位数的高低,左边是高位数,右边是低位数; (地址&…

凌恩生物美文分享|好看又实用,多组学联合分析项目大揭秘!

基因层面的功能潜能有没有真的实现表达,表达量是高是低?下游合成的蛋白质行使了什么样得功能,代谢产物通过体循环到达靶器官,又是如何影响靶器官的工作运行的? 一个完整的生物学故事,中心法则贯穿始终&…

PS学习记录-基础操作与快捷键

1、复制图层 在【移动工具】状态下,配合【alt】按键拖动图像,可以进行复制图层 当然,PS里复制图层的方式很多,比如:选中图层,按【ctrlJ】,也是复制图层 2、多选图层 2.1同上,也是…

unity打造基于增量断点更新的下载框架与代码实现

Unity是目前最流行的游戏引擎之一,它可以用来制作各种类型的游戏,例如2D和3D游戏。在游戏开发过程中,我们通常需要使用一些下载框架来帮助我们管理和更新游戏资源。其中,增量断点更新是一种非常重要的技术,它可以大大减…

MathType+MicrosoftWord

MathTypeMicrosoftWord MathType的安装Microsoft Word MathType的安装 链接:https://pan.baidu.com/s/1bEd41GF-yRCRw2tb1XH8og?pwd1234 提取码:1234 语言选择英文!!! 安装好之后,按win键,可…

CentOS7.x安装php7.x或php.8.x

CentOS 7.x默认安装的是PHP 5.x系列版本,想升级可以按照以下步骤,以PHP7.4为例: 移除旧版PHP: yum -y remove php*添加EPEL (Extra Packages for Enterprise Linux)仓库(如果已安装,或提示已是最新版本&…

ArcGIS中的土地利用变化分析详解

本篇主要是针对矢量数据的分析。 一、不同时期的土地利用矢量数据,如何分析其图形及属性变化? 土地利用图(左图为1993年,右图为2003年) 思路如下: 可以先对2个图层进行Union操作,然后在结果中…

电子采购系统的优缺点分析及选型建议

在现今,电子采购系统的出现,为企业采购带来了全新的解决方案。它可以使采购过程更加自动化、高效化,减少采购成本和人力资源的浪费。本文将对电子采购系统的优缺点进行分析,并提供选型建议。 电子采购系统优点: 1、自…

Spring《三》DI 依赖注入

🍎道阻且长,行则将至。🍓 上一篇:Spring《二》bean 的实例化与生命周期 下一篇:敬请期待 目录 一、setter 注入🍉1.注入引用数据类型2.注入简单数据类型 二、构造器注入🍊1.注入引用数据类型2.…

Java基础(十七):日期时间API

Java基础系列文章 Java基础(一):语言概述 Java基础(二):原码、反码、补码及进制之间的运算 Java基础(三):数据类型与进制 Java基础(四):逻辑运算符和位运算符 Java基础(五):流程控制语句 Java基础(六)&#xff1…

Golang流媒体实战之七:hls拉流服务源码阅读

欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos 本篇概览 本文是《Golang流媒体实战》系列的第七篇,继续学习一个重要且通用的知识点:hls拉流在《体验开源项目lal》一文中&#xff0…

【大数据基础】基于 TMDB 数据集的电影数据分析

https://dblab.xmu.edu.cn/blog/2400/ 实验内容 环境搭建 pip3 install bottle数据预处理 本次项目使用的数据集来自知名数据网站 Kaggle 的 tmdb-movie-metadata 电影数据集,该数据集包含大约 5000 部电影的相关数据。本次实验使用数据集中有关电影的数据表 tm…

公司新来一00后说我不会自动化测试,3个问题直接给他问趴下...

今天我们公司刚入职一小伙,听说是00后,今天在办公室交流了一下,他问我会不会自动化测试,我直呼好家伙,直接问了他3个开展自动化测试问题....一问3不知.....还有待加强呀 我们在制定自动化测试实施策略时,首…

哪个洗脱一体机好用?好用的洗拖一体机推荐

洗地机是一款使用非常方便的清洁工具,通常可以实现吸、拖、洗三个功能,对于各类家庭污渍都有着不错的处理能力,无论是干燥垃圾还是潮湿垃圾一律可以有效清理。不过很多新手朋友在选购洗地机时会因为看不懂参数而频繁踩雷。本文为大家整理了洗…

【hello Linux】理解文件系统

目录 创建文件的过程: 删除文件的过程: 创建目录的过程: 查看inode编号: 硬链接 软链接 Linux🌷 我们知道文件所有数据 文件内容 文件属性信息; 未打开的文件是被存放到磁盘/固态硬盘中的; …

Allegro thermal relief热风焊盘

为了画个通孔焊盘,看了很久的 Thermal relief相关的内容,终于基本上理解了。记录一下。 这篇文章讲得非常清楚: 深入理解Allegro之Thermal Relief与Anti Pad - 百度文库 (baidu.com) 热风焊盘般用在内层,减少一些焊盘和铜皮的连…

Leetcode究极刷题笔记(31~35)

(31)下一个排列(中等) 实现思路: 从题目中,我们可以看出本题的意思就是让你选一个比当前序列大的最小的那个解,比如132,哪么比它大的最小解就是213(先从第一位开始比&am…