移动app html手势实现的,移动端常见的手势交互操作方式详解,你不得不看

这是一篇关于APP常见手势操作方式的干货教程。同时也让大家详细了解什么是移动端常见的APP手势交互操作方式。

真正了解明白了这些APP手势交互操作对象,有助于让我们设计出更好的APP UI界面设计作品。

如下图:

6963abc1547887ded37adb43a7b7c7c9.png

上图这张APP界面设计当中,包含了2种手势流:

第一种手势流是向下的。 只要用户往下滑就会出现上面的三个菜单。 然后只要往上滑即可关闭。当然也可以点击关闭按钮。

第二种手势流是左右的滑动切换当前显示的内容。

下面就跟随25学堂的小编来一起学习下常见的APP手势操作对象吧!

第一:常规设计的手势操作分为以下几个重点来考虑:

首先,手势本身或操作过程的设计应该能够体现并符合大多数或者特定文化表现的用法。特别是形象的、有意义的手势更加容易记忆和学习。比如360浏览器提出的画左回旋表示返回上一页。

其次,在设计过程中,手势本身的形状或操作过程是从具体实物中简化出来的,其内涵具有实物的隐喻意义。比如划圈将某部分内容选中。

最后,将手势设计完成后,要换位考虑用户是否可以适应和接受此操作。从而可以检验用户是否对容易上手。比如,将命令或品牌的中文或英文的首字母符号作为该命令的手势。

如用 “c”(copy)表示“复制; Baidu的小写b来打开搜索。

基于几个重点设计的手势操作层出不穷,目前各种设备用户均能够接受的操作除了在第一章提到的基本操作外,对对象的操作目前也有很多得到了用户的认可和接受。

第二:对于一些对象的操作也达成一些普适模式如下图:

b666f384d08800889e12f01c5b740cbc.png

第三:对一些关于导航的操作也渐渐形成了一种约定俗成的手势规则。

如ipad等大屏移动设备的触摸手势操作。

18bed0233041b3fc242b63d9e0302603.png

最后,目前上面这些手势都是大多数用户被接受和认可:换句话说已经成为移动用户的使用习惯啦。

如果从方向上体现的功能来分析,可以把手势的功能大致这样分类:

1、从功能上看,目前横向滑动赋予的功能有:删除、平级切换、返回首页,,开关,滑块,附属功能。

2、从功能上看,目前竖向滑动赋予的功能有:下拉刷新,底部加载更多、全屏、上下篇切换、返回上一级,附属功能。

3、拖动是更大力度的滑动,常见的是拉出附属功能或其它隐藏内容。

4、 双指收缩、拉开常见的功能是:图片、字体放大,亮度调节,打开关闭,新增删减等。

5、按住并拖动一般用于自定义(改变顺序,加入,拉出等)。

所以,我们在设计APP交互方式的时候,一定要遵循用户行为习惯。

通过用户习惯分析的结果可以给予手势操作模式的指导性的方案,尽可能的接近用户平时操作习惯的操作模式和应用使用环境会将新方式的陌生程度降到最低。

在此,25学堂还跟各位APP设计师分享100个触屏手势矢量素材。相信大家肯定会喜欢

的。

ce25c8fbc87d4afeb80703744db5aeff.png

100个触屏手势矢量素材下载:点击下载      微盘下载:立即下载

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值