恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
了解全面屏手机是如何提高单手操作?以及web端鼠标操作快捷组
0.0°
2019-08-06 原创文章 经验/观点 举报 1171 1 1 0

了解全面屏手机是如何提高单手操作便捷性和屏幕的利用率。

从2017年到2018年全面屏在智能型手机渗透率9.3%大幅提升至36.2%。可见全面屏手机大趋势已经到来,在没有任何按键的情况下,手机全面屏是如何解决单手操作的问题呢?下面给大家分享下自己平时发现和工作上遇到问题以及解决方案。


手势滑动示例



非全面屏手机特点:

可视面积有限,美观度不够,手势操作单一,依赖于按键操作,操作可见。


全面屏手机特点:

外观上:拥有更大的显示面积,视觉体检好,产品外观简洁,握持感和使用体验也更加轻巧。


操作上:安卓系统“三大键”和苹果系统“Home键”,用户可选择显示屏幕内或隐藏。隐藏按键后依赖于手势操作,手势操作较隐喻(搭配操作教程)。


方式1:边缘手势操作。

如:小米8“边缘手势”在屏幕两侧滑动为返回上一级,边缘底部“上滑”退出应用,“上滑并拖动”快速进入搜索页面。边缘底部“上滑拖动”切换后台应用。而努比亚Z17S“边缘手势”在屏幕两侧完成操控,双击侧边返回上一级、边缘滑动切换后台应用。


方式2:画出有效区域操作。

如:IPhoneXS在“边缘顶部”划分两个操作区域,“中间下滑”和“两侧下滑”分别是“显示通知”和“快捷设置”。vivoNEX “边缘底部”划分三个操作区域,底部左侧上滑、底部中间上滑,底部中间上滑并停顿,底部右侧上滑。


以上操作方式无外乎都是在手机边缘操作、边缘有效区划分操作和手机非边缘(内侧)操作,如上图:iPhoneXS和小米8手机内侧下滑和上滑。


同一处边缘也有两种操作方式,如:小米8 边缘底部“上滑”退出应用,“边缘向上滑动并停顿”快速进入搜索页面。

Image title


不管是什么样操作方式,目的都是提高屏幕的利用率和单手操作体验便捷性。


全面屏手机操作缺点

全面屏手机普及以及各个品牌做操作不太一样,手势操作上并不是很统一。给移动端适配带来一定的复杂性。尤其针对对于做医疗影像,画板工具类以及依赖手势操作的APP。

根据这种情况建议:

禁用系统屏幕操作手势,自己定义手势/使用工具栏进行操作

在做这种类型APP更多需要考虑误操作,如:在关键页面操作时,左右滑动手势,触发返回/退出,这个时候可以考虑设计弹窗确认是否要退出。


甚至同一品牌不同版本,手势操也有可能不一样,建议最好禁用手势,给出工具栏。




mobile全面屏和web鼠标操作集合


手机操作手势(根据不同手机的型号或品牌手势可能不同):

单击:选择

移动:图片移动

双击:图片放大/缩小

长按:调用更多操作,如:复制,翻译等

向右滑动:页面返回

向左滑动:滑动条目“编辑,删除”

向上/向下:滚动浏览信息

展开/捏:缩放图片

旋转:旋转图片

三指拖动:截屏(小米手机)

按住拖动:常用于卸载APP

左右边缘滑动:常用于返回,或者退出APP

边缘向上/向下:退出程序或者手机快捷设置

边缘向上拖动:切换应用或快捷设置

手机内向上滑动:快速进入网页搜索


Image title



web端鼠标操作:

左键单击:激活或选择

右键单击:直接访问属性

合击:左右键同时按下和释放(取消)

左键拖拽:从一个文件拖到另一个文件

左键双击:选择扩展使用或调用更多功能,如:复制

双击拖动:扩展选择词汇到句子,移动位置

shift+左键:连选

ctrl+左键:跳选


访问键(alt、箭头键)

菜单项或标题下滑字母来访问的。

按下Alt键时,进入助记符模式,用箭头可以导航所有模式,助记符模式开启后,按下适当的字母键执行相应的菜单。alt+上键/下键,可切换菜单中第一项/最后一项。


快捷键:

提供自定义快捷键同时,也要提供“恢复默认值”的控件。

验伤分类---一组为日常(使用快捷键),一组一定不会用的(不使用快捷键),一组最难办的(比较模糊的快捷键)

Image title



鼠标形状和样式:

Image title



END 鼓励下下哦~






更新:2019-08-06

收藏

1人已收藏

产品设计日常笔记

设计成就产品

  • 9

    作品

  • 36

    粉丝

  • 15

    关注

  • 搜索设计场景分析法-按照用户群体划分
  • LIFT模型——产品如何提升转换率?
  • APP优化方案改版
  • c4d礼物动效设计过程

    猜你喜欢

      2019-08-06 原创文章 经验/观点 举报 1171 1 1 0

      了解全面屏手机是如何提高单手操作?以及web端鼠标操作快捷组

      0.0°

      你确定要举报了解全面屏手机是如何提高单手操作?以及web端鼠标操作快捷组

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2019年07月30日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      1
      1
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录