这是一个创建于 2102 天前的主题，其中的信息可能已经有所发展或是发生改变。
之前设计的发现动画没了，查了半天，发现原因竟然是登录成功和登录错误都几乎是瞬间完成，动画效果还没来及全部完成（ 0.3s ），既然网站速度太快，动画肯定想用也用不上了
之前做的动画效果是在提交的时候，“登陆 XX ”几个大字向上移动，如果登录错误，则退下来，并顺带错误信息也一块拉下来，就像插入钥匙然后拉抽屉一样，之前都用的好好的，现在用不上了还挺可惜的
还有就是同样的网速，各大网站登陆的速度并不快（ 0.5~1s ），这是怎么回事啊？
之前做的动画效果是在提交的时候，“登陆 XX ”几个大字向上移动，如果登录错误，则退下来，并顺带错误信息也一块拉下来，就像插入钥匙然后拉抽屉一样，之前都用的好好的，现在用不上了还挺可惜的
还有就是同样的网速，各大网站登陆的速度并不快（ 0.5~1s ），这是怎么回事啊？
第 1 条附言 · 2019-03-22 14:08:51 +08:00
新做好的动画演示： https://www.v2ex.com/t/547401
 |
1
iyaozhen 2019-03-19 23:48:04 +08:00 via Android
一个登录请求和网速关系不大，数据量很少。0，主要是后端响应时间
|
 |
2
fakeshadow 2019-03-20 00:08:37 +08:00
默认加个 timeout 好了
|
 |
3
ksharp8 2019-03-20 00:29:57 +08:00
js settimeout
|
 |
4
pinews OP |
 |
5
opengps 2019-03-20 02:00:46 +08:00 via Android
要不设计成非登录过程靠边小尺寸显示，登录过程居中大尺寸显示
|
 |
6
6260628 2019-03-20 02:06:05 +08:00
你这么描述问题注定苦恼
|
 |
7
LancerComet 2019-03-20 02:18:05 +08:00
楼主你看你自己怎么定位动画
如果你是觉得动画是载入时间的补充那在系统响应很快的情况下确实没什么用 不过有很多产品对动画的定位是一种视觉需求，毕竟人对美是有要求的，这些产品的登录都是一瞬间，但仍然会把精美的登录动画播放完成，比如 Discord |
 |
8
jinliming2 2019-03-20 02:56:51 +08:00 via iPhone  1
我的理解：动画的本身应该是在耗时较长的动作用来做补充的。
如果网速较慢，延迟较高，那么在用户点击提交按钮后界面会有较长时间的“无响应”，这个时候使用动画来进行过渡就会比较好。 但如果系统速度足够快，那么强行显示动画也会有点多余，甚至会令用户反感，毕竟不管你动画做的多么炫酷，“加载中”的状态总是令人讨厌的。明明我的电脑配置非常高，网速也非常快，为什么就是得不到无缝的操作体验？ 如果是转场动画，也就是一个界面切换到另一个界面，在这个过程中添加一个过渡效果也是可以的，但是动画要做到非常流畅并且动画时间越短越好，给用户一个反馈，但是还没等用户反应过来，动画就结束了。如果这个转场时间过长，那么就会给用户带来明显的延迟感，将原本应该直接打开的页面愣是改成了需要“加载中”的页面。 |
 |
9
Orchild 2019-03-20 08:22:13 +08:00
用产品大家还是希望快速登陆吧，难不成还有人喜欢看半天动画~
|
 |
10
Cheons 2019-03-20 08:37:34 +08:00 via Android
🤔你喜不喜欢 app 开屏广告？同理
|
 |
11
kanata 2019-03-20 08:41:04 +08:00
既然后端速度很快，要不就 toast 一下喽。
|
 |
12
megamilk 2019-03-20 09:50:58 +08:00
@jinliming2 这是交互设计知识吧？
|
 |
13
Sapp 2019-03-20 10:35:39 +08:00
@jinliming2 但是你要考虑到，网速是个不可控的东西，百分之 90 的人登录都是一瞬间，但是就有那么百分之几的卡住了，如果你不给个动画，这个体验就很差了。所以这个解决方案就是要么延迟一下取消动画，每个人都能看到动画，但是不需要延迟太久，太久就拖沓了。要么就延迟播放动画，让网速好的人直接进去，网速差的看动画
|
 |
14
hoythan 2019-03-20 10:38:34 +08:00
能先看下动画吗？
|
 |
15
DOLLOR 2019-03-20 10:41:59 +08:00 via Android
登录速度快是好事呀，过渡动画是用来缓解用户等待的焦虑，不必强迫用户观看。而且网络环境很复杂，说不定哪时候网络变差，就有机会用上了
|
 |
16
calon 2019-03-20 10:43:35 +08:00
很正常啊。
看你设计这样动画的目的是什么，是为了用户体验服务，还是为了自己服务。 如果用户的想法是尽快登录，什么动画也不想看，那么拿掉动画就是对的，人为增加延迟时间来展示动画是本末倒置。 再说，登录错误的设计还是可以用上嘛。 |
|
17
calon 2019-03-20 10:44:30 +08:00
看标题，还以为苦恼的是不知道怎么画两栖登陆舰呢。
|
 |
18
charten 2019-03-20 10:49:52 +08:00
你可以这样搞嘛，当登录请求发出去后开始计时，如果规定时间内请求还没有响应就触发动画，规定时间内响应就不触发。一旦动画开始跑起来，不管请求是否已经响应，都老老实实等待一个动画周期结束后再执行回调
|
 |
19
GuuJiang 2019-03-20 14:08:44 +08:00 via iPhone
这个简单，让后端在登录接口里加个 sleep （滑稽
|
 |
20
gauzung 2019-03-20 15:17:28 +08:00
开个会员系统，VIP 秒登，普通用户要等完动画，你自己的需求满足了，口袋也满足了（滑稽
|
 |
21
skyrem 2019-03-20 15:36:31 +08:00
你可以在輸入用戶名密码的时候就让你的动画开始动起来啊
或者页面显示出来用户点击登录之前 为啥非要等用户点登录之后 |
 |
22
580a388da131 2019-03-20 16:28:20 +08:00 via iPhone
这不是很正常吗？网速快的不看动画，网速慢或服务器卡的看动画。
|
 |
23
Biwood 2019-03-20 16:31:08 +08:00
本末倒置
|
 |
24
marsgt 2019-03-20 16:35:53 +08:00
得看需求。
如果登录确实很快+没有加载慢的问题，那么这个动画就是不必要的；反之如果中间会出现迟滞（不一定是你的连接速度，比如客户弱网络、或者个别有延迟之类的情况），那么这个动画就有存在的理由。 建议还是加个判断逻辑，如果很快那就把动画隐掉；如果时间相对较长，那么放动画。 |
|
25
pinews OP 谢谢大家的帮助，在网速快的时候设计了另外一个动画，网速慢的时候可以判断使用，有点复杂了，不想用了，只好雪藏了，等有时间给大家贴出来看效果。
|
|
26
pinews OP 做好演示了：请看 APPEND
|
Select Language