delphi xe2 project菜单怎么没有加组件功能_交互设计:让人困惑的三大交互组件及用法...

本篇文章中,笔者带我们了解了三大交互组件专有名词的用法,并结合实际案例进行了解释说明,与大家分享。希望通过此文能够加深你对交互组件及其用法的理解和分析。

1d577046d9494e024b86d4d30c9d5ca2.png

最近有很多同学来问一些设计中组件的专业名词,发现大家好像都没有一个统一的认识,有的说是ActivityViews,ActionSheet,Picker等等。

很多人不太清楚ActivityViews、ActionSheet、Alert三者的区别所以在这里我也把我对这些组件的理解给大家分享一下。

那么首先大家肯定要对于官方的设计指南定义有个了解。

一、ActionSheet(动作菜单)

“动作菜单是一种特定的警告样式,它出现在对控件或操作的响应中,并呈现⼀组与当前窗⼝相关的两个或多个选择。

用户启动任务或者执⾏潜在的破坏性操作之前弹出动作菜单请求确认。在较小的屏幕上,动作菜单从屏幕的底 部向上 滑出, 在较⼤大的屏幕上, 动作菜单会以弹出窗⼝的形式呈现出来。”

311d18778ff7a1f3bd930cd68ecb7e0b.png

用法及说明:

1. 提供一个取消按钮增加操作的明确性

取消按钮能够让⽤户在放弃一项任务时,对⾃⼰的操作更加肯定,并且动作菜单中的取消按钮应该总是位于屏幕的最底部。

2. 突出警示的选择项

使用红⾊突出⽤来执⾏破坏性或危险动作的按钮,并在 动作菜单的顶部显示这些按钮。

3. 避免在动作菜单中出现滚动情况

如果⼀个动作菜单中存在太多选项,⽤户就必须滚动查看所有选项,⽽滚动需要更多的时间来做出选择,且滚动过程中也容易误触到其他按钮。

喔吼,看到了吗,其实这些描述已经很明确了,首先根据屏幕大小的不同他可以有两种模式供大家选择,底部滑出或者以窗口的形式弹出来。它必须有取消的按钮并且对警示信息强调显示,并且不支持列表式的上下滑动

但是这里要注意的是,他也可以没有警告内容

05bbe1f5b590580eb44d24060f18a92d.png

同时他不支持滚动也是因为AS(后面简称AS:action sheet)的列表按钮点击即触发,为了避免用户在滑动时不慎点击,这里在设计上就不建议做上滚动。

另外AS在不同屏幕上的显示方式不同,例如iPhone和iPad上的组件展现就是不同的,因为pad中如果是底部或者中间弹出,用户会非常不好点,所以根据菲兹定律这里的AS直接显示在了按钮的边上。

f63d5bb8f7910c708f44ae5a2c9dd95b.png

在原生的组件中我们也会发现在AS的控件里还会有对还组件的描述,一个是帮助大家明确进行该操作的后果,另外也是让大家再次确认该操作。

当然了,这些都是“指南”告诉你怎么用比较正确,万一遇到一些特殊的情况,我们也可以根据自己的需求来进行调整,比如说样式之类的。

二、ActivityViews(活动视图)

“⼀个活动就是⼀个任务,例如“复制”、“收藏”或“查找”,在当前下背景十分有用。点击启动之后可以立即执⾏一个服务操作,也可以先请求更多的信息,然后再执行该操作。

活动在活动窗口中启动,活动窗口可以以表单或者弹出窗口的形式出现,这取决于设备的种类和屏幕的方向。使用活动可以让用户访问 App中可执行的自定义服务或者任务。”

用法及说明:

1. 设计简单的图像模板来展示你的自定义视图

⼀个图像模板使用⼀个蒙版去创建⼀个icon。使用带有适合透明度与抗锯齿的黑色与白色,还有不要包含投影。图像模板应该在⼀个70px X 70px的区域内居中显示。(这个尺寸不一定要遵循)

2. 创建的标题应该简单明了描述你的功能

标题显示事件图标的下方,通常来说简短的标题效果最好,如果标题过⻓长,iOS 会先缩小字号,仍然太长的话就会截断它。

3. 确保功能是可以对当前窗口中的内容进行操作的

虽然事件窗口中系统内置事件的位置是固定的,但如果它们不适⽤于你的App,则可以将其移除。

所以ActivityViews是这样的:

f03444cb9c4e70006a278acb8647e868.png

那有人会说,诶这里可以左右滑动难道就不怕误操作了吗?

我们上面提到的AS他本身是含有警告内容的,而且大部分的AS都有警示功能在其中,所以尽量不让他上下滑动,即便是没有需要警示的功能我们也就保持统一不进行滑动了,而且上下空间有限,本身也不适合进行滑动(如果你非要滑动那你不如用picker,当然picker的本质作用又和AS有区别),左右的空间更加多,适合多个活动的按钮。

所以AV(activityviews)大多数时候被聚合了分享、转发、收藏、复制等功能,这俩组件是有明显区别的。

b8bbf1af7a8614cb87d73a97420b2bb8.png

三、Alert(警示框)

“警告框⽤来传达与你的 App 或设备状态相关的重要信息,并且通常需要得到⽤户的反馈。

警告框的内容包括标题,描述消息(可选)、⼀个或多个按钮以及输 入框(可选)。除了这些元素之外,警告框的外观样式是不可更改的。它的使用方法和建议”

f7b5b4f0bb5e205af3a75a53429851cd.png

1. 避免使用警告框

警告框特别容易打断用户的操作、心流状态等,所以一般我们会用在非常谨慎的环境,比如当用户要删除重要的信息,当app重要非常紧急的信息要通知给用户时我们才会用它。

2. 警示框语言要简化

尽量不使用标点来完成文案,尽量让文案在一行显示,但不要让它太宽。

3. 文字要避免负面态度

要传达友好的态度和积极的态度,所以大家不要学抖音,这莫非是在威胁我?就差把确认按钮取消掉了

aa22c681593509270edfec9616dae7f2.png

4. 通常使用两个按钮的警告弹窗

两个按钮的警告弹窗,可以使用户更容易地在两个选择中做出决定。

⼀个按钮通常用于通知,它无法做出更多的选择。三个或以上的按钮会使选择变得复杂,并且需要滚动,会造成很不好的⽤户体验,这种情况下可以考虑使用动作菜单,请查阅 Action Sheets。

5. 创建简洁的、逻辑清晰的按钮标题

按钮标题最好由⼀、两个描述操作结果的词语组成。与所有按钮标题一样,使⽤标题模式的大小写(英文环境下, 每个单词的首字母大写),不要出现表示结束的标点符号。

尽量使用与警告标题和描述信息直接相关的动词或动词短语,例如“查看全部”、“回复”或者“忽略”。使⽤“确认”进⾏行明确的表达,避免使用“是”和“否”。例如是否进行删除,请将警示按钮设置为“删除”而不是“是”

比较

还有一些就不放上来了,大家可以自行翻阅设计指南。在我们对三个控件进行完描述之后大家是否已经清楚了3者的用法。唯一还有争议的就是AS和Alert都有警示的元素,我们该用哪一个?

首先AS他是包含警示的信息,他也可以完全没有,就像上面那个案例一样,所以在官方的解释下来看,除非是非常严重的操作,我们才会用到alert,例如删除订单、例如退出编辑。但是其实市面上很多app使用情况都不同。

b61e69e2dd67da6c9cbe7db87add6f10.png

如上图,微信和马蜂窝的编辑页点击退出,前者用了Alert后者用了AS,大家觉得有什么区别,一个是对话形式问你保不保留,另一个则是将不保留进行了警示标记高亮。

前者你必须选一个,只要你点了你就不能留在这个页面了。后者你还可以取消,所以在这种场景,我更青睐后者。

再来看个例子:

41aae3f6245c66d2f6d32d2a0f71f08e.png

一个是订单删除,一个是照片删除,在这里,大家都可以进行取消,但是我们来看下内容优先级,订单删除之后再想找回需要去电脑端,而这里产出照片我可以从最近删除中重新恢复,两者的找回成本差很多。所以前者用了alert后者用了AS。

再换个说法,AS可以通过点击空白区域退出,而ALert不行,这都意味着Alert的警示级别更高,所以当我们要给用户警示的时候,我们自己先考虑下当前的警示程度是否需要最高,如果仅仅是退出账户,那我个人建议选择Actionsheet而不是Alert。

综上所述,每种组件都有其特定的用法,根据场景和信息内容优先级来判断如何使用才是正确的设计方法。看不看得懂都点个赞吧~

#专栏作家#

应骏,人人都是产品经理专栏作家,公众号:应谋鬼计(shejishiyj)

本文由 @应骏 原创发布于人人都是产品经理。未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/434747.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Rails 3.1 CoffeeScript SASS初体验

http://heikezhi.com/2011/04/19/how-to-rails-3-1-coffeescript-howto/http://jashkenas.github.com/coffee-script/ 转载于:https://www.cnblogs.com/orez88/articles/2278254.html

request_threaded_irq()

今天在跟marvell沟通问题的时候,觉得有些地方的代码看得不够仔细,于是细看了一下。发现了几个请求中断的函数。 request_threaded_irq,这个函数在内核中有注释,参数有好多,大概参数有handler,这是要指定的中…

磁盘 I/O 性能监控指标和调优方法

在介绍磁盘 I/O 监控命令前,我们需要了解磁盘 I/O 性能监控的指标,以及每个指标的所揭示的磁盘某方面的性能。磁盘 I/O 性能监控的指标主要包括:指标 1:每秒 I/O 数(IOPS 或 tps)对于磁盘来说,一…

中断请求request_irq

今天在跟marvell沟通问题的时候,觉得有些地方的代码看得不够仔细,于是细看了一下。发现了几个请求中断的函数。 request_threaded_irq,这个函数在内核中有注释,参数有好多,大概参数有handler,这是要指定的中…

fastapi 传输文件存文件_python3 FastAPI框架入门 基本使用, 模版渲染, 数据交互,cookie使用, 上传文件, 静态文件配置...

[FastAPI框架入门 基本使用, 模版渲染, form表单数据交互, 上传文件, 静态文件配置]安装pip3 install fastapi [all]pip3 install unicornpip3 install aiofilespip3 install HTMLResponsepip3 install Responsepip3 install shapelypip3 install starlettepip3 install reques…

android平台的s5pc110触摸屏驱动分析

内核linux2.6.35 andorid2.3 触摸屏型号ft5xo6首先给出该触摸屏的一些结构体---->drivers/input/touchscreen/ft5x06_ts.h点击(此处)折叠或打开 #ifndef __LINUX_FT5X0X_TS_H__ #define __LINUX_FT5X0X_TS_H__ #define SCREEN_MIN_X 0 #define SCREEN_MAX_X 320 #define SC…

Thread类和Runnable接口

两者都可以实现多线程,那么两者的区别和联系有哪些? Thread类的定义。 public class Thread extends Object implements Runnable 从Thread类的定义可以清楚的发现,Thread类也是Runnable接口的子类,但是Thread类中并没有完全地…

mysql的每隔1分钟定时_mysql定时任务

查看event是否开启show variables like %sche%;开启event_schedulerset global event_scheduler 1;创建存储过程spark.testCREATE PROCEDURE spark.test ()BEGINupdate spark.userbehaviordatasource set v1 3 where page like page2%;END;创建event spark.e_testcreate event…

linux powerpc i2c驱动 之 i2c设备层的注册过程

Linux下i2c驱动的加载过程,分为i2c设备层、i2c adapter层与i2c核心层 i2c设备驱动层也就是我们为特定i2c设备编写的驱动,下面是我自己理解的i2c驱动的注册过程 在我们写的i2c设备驱动中,我们会调用i2c_add_driver()开始i2c设备驱动的注册&am…

易宝支付碰到 交易签名无效问题 (2)

无意中翻了翻旧日的代码,原来在上一次交易签名无效的问题仅仅是出现在一个调用的问题上,merchantProperties.php被调用了两次,当第一次被调用的时候是正确加载的,而在第二次调用的时候出就会出现参数丢失的现象,正因为…

北斗三号b1c频点带宽_北斗三号导航信号的创新设计(一)

《测绘学报》构建与学术的桥梁 拉近与权威的距离一需求与挑战1.1 卫星导航信号的作用与意义卫星导航信号是由导航卫星向地球表面播发的无线电测量信号,承担着传递时空基准信息和实施被动测距两大任务,是卫星导航系统实现三边定位的核心载体。卫星导航信号…

g++ linux 编译开栈_linux gcc和g++版本的修改

##编译的时候容易遇到:unsupported GNU version! gcc versions later than 6 are not supported这样的错误。所以我们要更改系统的gcc和g编译器版本。首先我们要知道一个基础的常识,一般而言,linux系统会把gcc和g默认安装在/usr/bin/的目录下…

使用FFmpeg从视频中截图的命令

截取一张352x240尺寸大小的,格式为jpg的图片: ffmpeg -i test.asf -y -f image2 -t 0.001 -s 352x240 a.jpg 把视频的前30帧转换成一个Animated Gif : ffmpeg -i test.asf -vframes 30 -y -f gif a.gif 目前还没有找…

Linux I2C核心、总线与设备驱动(一)

本章导读 I2C总线仅仅使用SCL、SDA两根信号线就实现了设备之间的数据交互,极大地简化对硬件资源和PCB板布线空间的占用。因此,I2C总线被非常广泛地应用在EEPROM、实时钟、小型LCD等设备与CPU的接口中。 Linux定义了系统的I2C驱动体系结构,在L…

微软企业库4.1学习笔记(十)企业库的设计

在设计整个企业库的过程中,使用了一系列的最佳实践。下面列出一些里面的最佳实践: 在核心库中使用了Common模块  使用了统一的命名约定和统一的版本  在设计的过程中使用单元测试  在所有模块中包含基础结构在企业库的模块中包含了下面的模式&…

ebay注册流程_跨境电商平台eBay企业入驻流程

整个流程一共包括8个部分了解企业入驻通道企业入驻通道将帮助现有eBay大中华卖家申请并获得高刊登额度的新账户,以满足卖家在品类拓展以及站点拓展的需求。准备材料1.营业执照2.法人代表身份证明,或eBay帐户注册人身份证明(根据地区法规有不同…

Linux I2C核心、总线与设备驱动(二)

从上面的分析可知,虽然I2C硬件体系结构比较简单,但是I2C体系结构在Linux中的实现却相当复杂。当工程师拿到实际的电路板,面对复杂的 Linux I2C子系统,应该如何下手写驱动呢?究竟有哪些是需要亲自做的,哪些是…

解决Android中的ERROR: the user data image is used by another emulator. aborting的方法

解决Android中的ERROR: the user data image is used by another emulator. aborting的方法 今天调试代码的时候,突然出现这个错误,折腾了很久没有解决。最后在google上找到了大家给出的两种解决方案,下面给出这两种方法的链接博客&#xff1…

mtu设置失败_Oracle RAC该调整网卡MTU值

在Oracle RAC的环境中,如果我们发现OSW监控数据显示包重组失败率过高,就需要引起足够的重视,因为这很可能会引发member kill/Node kill等重大故障,甚至在有些场景会连带影响到所有RAC节点不可用。一般我们会选择调整ipfrag相关参数…

i2c_add_driver函数用法

I2C的设备驱动是通过i2c_add_driver(&my_driver)向i2c-core注册的,my_driver中的核心是detach和attach函数,在attach中通过probe探测到总线上的设备并把设备和 驱动建立连接以完成设备的初始化。如何探测总线上的设备、Linux中i2c设备地址如何标识并…