首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

做好 Loading 设计

Loading 的产生是为了在网络请求中优化用户的使用体验。 反过来看,Loading 动画能够为网络访问提供更多的加载时间,提高用户的转化率。...也就是说 loading 是为了缓解加载延迟提供的一个视觉\交互方案,形成一个连贯的视觉体系。 Loading 设计在不同实用场景下有不同的最优方案: 2. 加载模式分类 2.1 骨架屏 ?...一开始返回的页面带有完整的文字信息,图片用矩形框填充占位,矩形框内显示 loading。待图片、视频等大资源加载完成之后再替换图片。 2.3 全屏加载 ?...例如在全屏 loading 中加入当前状态的文字提示,或者一些 tips 都有帮助。 3.3 预先缓存/加载 代入一个场景,比如你在订票软件中,输入完出发地,目的地和时间之后点击确认。...真正理想的情况不是有好的 Loading,而是没有 Loading

1.4K20

说说Loading这件小事

不管是从最早的原生JavaScript还是到现在的React、Vue,只要有页面的地方就有loading,似乎loading是一个前端同学永远也绕不过去的坎。...之所以说是坎,因为在页面中对于loading的控制,确实让前端工程师比较头疼,但大家似乎对于loading很多时候也不是那么在意,可有可无,也放在最后优化。...本篇文章,我们从loading的分类、需求产生、视觉状态、生命周期几个方面介绍一下loading。...从loading的作用范围大致分为3类 全局loading 单页面loading 局部loading 首先对于全局loading比较常见,尤其是在C端,小屏幕设备上,在后端请求没有完全返回来之前, 或者前端页面没有完全加载完...,给用户以友好的提示,简单说就是安抚用户情绪,本篇

96720

Human Interface Guidelines — Loading

自上次参加完回音分享会后,我下定决心要洗心革面乖乖打基础,于是开启了这个part,争取两个月不间断更新,写完Material Design与iOS中的组件(顺便学学英语),以便今后在使用的时候完全不虚 Loading...Human Interface Guidelines链接:loading 内容加载时,空白屏幕或静态屏幕可能会使 app 看起来像冻住了,这会让人困惑和沮丧,并可能导致人们离开app。...Loading ·在发生加载时清楚说明 至少,展示一个表示正在发生的事情的环形loading圈,最好能显示明确的进度,以便用户可以估算出他们将等待多久。 尽快显示内容。...·教育或娱乐人们掩盖加载时间  考虑展示有关游戏玩法,娱乐视频序列或有趣的占位符图形的提示

66640
领券