设计了一个登陆动画，却发现一个苦恼的问题

一个登录请求和网速关系不大，数据量很少。0，主要是后端响应时间

默认加个 timeout 好了

js settimeout

@fakeshadow
@ksharp8 这不成削足适履了么

要不设计成非登录过程靠边小尺寸显示，登录过程居中大尺寸显示

你这么描述问题注定苦恼

楼主你看你自己怎么定位动画
如果你是觉得动画是载入时间的补充那在系统响应很快的情况下确实没什么用
不过有很多产品对动画的定位是一种视觉需求，毕竟人对美是有要求的，这些产品的登录都是一瞬间，但仍然会把精美的登录动画播放完成，比如 Discord

我的理解：动画的本身应该是在耗时较长的动作用来做补充的。
如果网速较慢，延迟较高，那么在用户点击提交按钮后界面会有较长时间的“无响应”，这个时候使用动画来进行过渡就会比较好。
但如果系统速度足够快，那么强行显示动画也会有点多余，甚至会令用户反感，毕竟不管你动画做的多么炫酷，“加载中”的状态总是令人讨厌的。明明我的电脑配置非常高，网速也非常快，为什么就是得不到无缝的操作体验？
如果是转场动画，也就是一个界面切换到另一个界面，在这个过程中添加一个过渡效果也是可以的，但是动画要做到非常流畅并且动画时间越短越好，给用户一个反馈，但是还没等用户反应过来，动画就结束了。如果这个转场时间过长，那么就会给用户带来明显的延迟感，将原本应该直接打开的页面愣是改成了需要“加载中”的页面。

用产品大家还是希望快速登陆吧，难不成还有人喜欢看半天动画~

你喜不喜欢 app 开屏广告？同理

既然后端速度很快，要不就 toast 一下喽。

@jinliming2 这是交互设计知识吧？

@jinliming2 但是你要考虑到，网速是个不可控的东西，百分之 90 的人登录都是一瞬间，但是就有那么百分之几的卡住了，如果你不给个动画，这个体验就很差了。所以这个解决方案就是要么延迟一下取消动画，每个人都能看到动画，但是不需要延迟太久，太久就拖沓了。要么就延迟播放动画，让网速好的人直接进去，网速差的看动画

能先看下动画吗？

登录速度快是好事呀，过渡动画是用来缓解用户等待的焦虑，不必强迫用户观看。而且网络环境很复杂，说不定哪时候网络变差，就有机会用上了

很正常啊。

看你设计这样动画的目的是什么，是为了用户体验服务，还是为了自己服务。
如果用户的想法是尽快登录，什么动画也不想看，那么拿掉动画就是对的，人为增加延迟时间来展示动画是本末倒置。
再说，登录错误的设计还是可以用上嘛。

看标题，还以为苦恼的是不知道怎么画两栖登陆舰呢。

你可以这样搞嘛，当登录请求发出去后开始计时，如果规定时间内请求还没有响应就触发动画，规定时间内响应就不触发。一旦动画开始跑起来，不管请求是否已经响应，都老老实实等待一个动画周期结束后再执行回调

这个简单，让后端在登录接口里加个 sleep （滑稽

开个会员系统，VIP 秒登，普通用户要等完动画，你自己的需求满足了，口袋也满足了（滑稽

你可以在入用名密码的时候就让你的动画开始动起来啊
或者页面显示出来用户点击登录之前
为啥非要等用户点登录之后

这不是很正常吗？网速快的不看动画，网速慢或服务器卡的看动画。

本末倒置

得看需求。
如果登录确实很快+没有加载慢的问题，那么这个动画就是不必要的；反之如果中间会出现迟滞（不一定是你的连接速度，比如客户弱网络、或者个别有延迟之类的情况），那么这个动画就有存在的理由。
建议还是加个判断逻辑，如果很快那就把动画隐掉；如果时间相对较长，那么放动画。

谢谢大家的帮助，在网速快的时候设计了另外一个动画，网速慢的时候可以判断使用，有点复杂了，不想用了，只好雪藏了，等有时间给大家贴出来看效果。

做好演示了：请看 APPEND