「抖音」如何保持让用户的操作始终在手部舒适区内进行? - 优设网 - UISDC

交互手势 「抖音」如何保持让用户的操作始终在手部舒适区内进行?

产品：抖音iOS 作者：抖音设计团队
 时间：2019-02-27

猎人： 小白 观众：5566人

细节描述

多数产品在设计页面模态弹窗引导用户进行操作行为时，都会将操作控件放在固定的页面位置（一般居中或者处于页面底部）。但「抖音」的设计却让人眼前一亮：系统会自动检测用户进行操作时手指与屏幕的接触位置，并将模态弹窗的操控按钮显示在离用户手指最近的地方。随用户手部活动区域变化而灵活变更位置的模态弹窗设计，使用户在进行手势交互的过程中操作动作能始终在手部的舒适区域内进行，是应对大屏时代十分友好的体验设计。

围观案例 ! 温馨提示：案例或因时间流逝和版本迭代与截图时有所差异
本篇知识点及话题# 交互手势# 人性化# 弹窗# 抖音# 易用性# 短视频# 舒适区域# 设计逻辑

发表评论 加载中....

评论加载中....

下一篇

捕获自 网易云音乐iOS

你将掌握 用户体验 的小知识~

生活没有那么奇妙，但有你才会变得美好

在「知乎」与「百度」等搜索平台搜索关键字「自杀」，都会出现暖心的开导用户的文案与心理援助热线提示。「网易云音乐」在处理...

官方微信

weixin
设计头条 行业热门
交友脱单 活动丰富
干货私单 涨薪法宝

优设官微 掌上更精彩 扫码关注

猎人推荐 我要投稿

相关细节

设计逻辑 英语测试通过，AI老师向你投来一个开心的表情包

「EF Hello」是一款运用AI技术打造智能英语陪练的应用，通过模拟对话聊天的学习模式拉近与学习者的距离，帮助用户更加便捷与高效的学好英语。从进入App的用户引导界面开始，就是以模拟对话的形式展开。虽然是AI老师在跟你对话互动，但整个互动过程拟人化做的很好，生动有趣。根据你的答题情况AI老师不仅会做出点评回复，还会根据对话情境给你发表情包表达它的情绪。完成几个测试阶段后还会出现请你为产品打分评价向用户寻求体验反馈的对话，会给出选项回复不会很麻烦。如果你选择了不喜欢它，它还会回复「别担心，我们还是一样爱你」。整个产品的情感化体验设计很赞。

产品：EF Hello iOS 作者：EF Hello团队 猎人： 小白

微交互 有史以来画风最可爱的官网长这样

Same是一款主打年轻化的兴趣社交产品，它的web端官网简直是画风清奇，萌点满满。Same的首页放眼看去除了logo一个字符都没有，满屏的图标信息让你仿佛置身于火星文的世界。但当你把鼠标hover上去，会开启一个新世界（icon都变成文字了）。这种信息呈现的反差与神秘感，反而会激发用户对网站信息探索的好奇心。如果觉得麻烦还可以通过右上角的开关，一键将icon换成文字。这个设计很大胆，虽然有点冒险，但对于喜欢个性与创意的年轻用户而言还是很合适的。

产品：Same 作者：Same设计团队 猎人： 蓝点

用户体验 「微博」的青少年模式，让浏览内容更健康

互联网时代，各种社交媒体和视频平台成了大家主要的信息来源。但内容的质量参差不齐，不健康的内容对于青少年的耳濡目染会带来身心上的影响。所以各大平台都陆续上线了青少年或者儿童模式。「新浪微博」近期也上线了「青少年模式」，在已有的账号中可设置单独一个青少年模式账户，设置好密码家长就可以为自己的孩子有选择性的选取健康优质的内容，从而避开那些不健康信息。

产品：新浪微博 iOS 作者：新浪微博团队 猎人： 神经蛙

优设精选专题 查看更多

148458人看过 7篇文章

图标绘制指南

高手从零开始带你画图标

本专题由「超人的电话亭」撰写，旨在帮助新人设计师学会图标的绘制方法。从图标基础知识到5大图标类型绘制方法详解，最后附上图标应用方法。UI 设计新手学习图标之前，建议完整阅读这个专题，帮助极大。
查看专题
826087人看过 18篇文章

配色指南

一个专题囊括所有配色方法和技巧！

来到本专题，你不仅可以掌握基础的色彩知识，还能学会高手的配色训练方法和独家配色技巧，更有超多在线配色神器免费使用，让你轻松从配色小白变高手！
查看专题
636232人看过 11篇文章

后期修图

最全面的后期效果方法总结

由国内知名的修图软件@泼辣修图 主笔叶明老师倾情撰写，全是日常大家最喜欢的后期效果，无论你中意哪个风格，在这儿都能找到修图方法。
查看专题
51684人看过 5篇文章

AR设计

AR 设计可能是距离设计师最近的未来

目前市面上关于AR 设计的教程极少，我们可能是唯一一个把高质量教程都收集起来供你学习的，这里有最详细的基础科普，有可供把玩的AR APP，有交互方法总结，收藏这个，以后需要设计AR 类产品就不慌！
查看专题

优设热门私房课 查看更多

iPad 手绘入门快速学习指南

iPad 插画练习技巧和速写方法入门科普

闫实
优设大课堂人气老师

Q版头像Ai插画疾速入门指南

不需要手绘板，零基础也能快速上手，6大知识点带你绘制专属卡通头像

周小馋
优设大课堂人气老师

UI设计师直通大厂的简历&面试秘籍

用科学系统的方法提高求职面试的成功率，比内推还有效的大厂秘诀

慕青
知名大厂设计师

包装插画入门学习指南

从接单、沟通、IP形象设计到包装印刷落地的完整过程呈现

鱼吉
艺术院校老师

腾讯设计师求职成功指南

国内顶尖设计团队「腾讯ISUX」设计师亲自撰写的求职面试经验

腾讯ISUX
国民级产品设计团队

成长型插画师的插画练习术

Dribbble 人气插画师快速成长的插画练习术揭秘

风绽
资深插画师
查看更多热门课程 > >
版式设计 交互设计师 界面设计 排版布局 职场 设计师干货 优设专访 优设大课堂 设计达人 配色 视觉设计 web前端开发 素材下载 AI教程 设计流程 设计理论 神器下载 字体下载 设计师专访 psd下载 设计规范 用户体验设计 海报设计 设计趋势 平面设计 动效设计 logo设计 图标设计 ICON 产品设计 神器推荐 App设计 字体设计 职场规划 酷站推荐 交互设计 ui设计 优秀网页设计 设计师职场 ps技巧 酷站 用户体验 PS教程 网页设计 经验分享

您还没有登录

优设启用更安全省心的 微信扫码登录

微信扫码

300万设计师聚集地！优设网是极具人气的设计师平台
2012年成立至今，一直专注于设计师的学习成长交流

把好文章收藏到微信

打开微信，扫码分享
学设计 优设网 在这里