浅析APP中预加载图设计

  的一个环节,今天就来聊聊这些场景下其他产品是如表达的,提前掌握这种场景表达方法,便于我们在今后项目中能够快速找准适合自己产品内容呈现方式。

  预计加载过程中表现形式有加载等待(转圈动画或其他GIF动画),加载历史缓存数据,提前加载一半,逐步加载,后台提供默认加载图,当然还有加载失败场景。今天我们这里只讨论预加载中的Content表达方式,我分析提炼了几个常用的视觉表达方式:

  他是什么?在加载过程中,会预先在用户面前呈现出来一些图像元素,通过LOGO或者相关图标来表达,给用户一种前期的心理预期要呈现的大致内容

  缺点是适配麻烦,不同样式图片都需要切图,增加APP包大小,安卓还需要单独切点九图片来适配等等,有些人肯定会问,安卓为何就不能切整张图啦?哈哈你可以试一试,如果你想你们包大小超大的话。

  他是什么?在加载过程中,会预先在用户面前呈现出来一些色块元素,这种做法方法是: 直接读取图片的颜色,取什么颜色?大致是图片中的主色调,面积大的者读取图片平均色,当然后台需要有一个强大色库来支撑且需要提供一种或者2种默认颜色,因为避免取色失败,目前这样做的产品有苹果音乐、天猫App、Pinterest、Twitter、花瓣移动端等等,当然苹果音乐加载不出来是直接提供默认的logo色块。

  优点是图片适配非常方便,全端展现方式提供一套色库即可,画面不枯燥,最后补充一点,截图真的好难截啊,说明这些应用优化的真的很牛,Pinterest是个奇葩比较好截。

  需要色库配得好,颜色需要设计师亲自调,当然我目前还没想到有更好的方法,如果有请各位元老大神告诉我下,感谢。

  解析:特别说明下Twitter是采用的两种表达方式,一种是提供默认灰色图,一种是图片取色,一般灰色值采用#F2F2F2,优点画面干净,适配简单,这里说明下,可以开发写,可以我们自己提供,但是推荐我们提供,免得增加累赘代码。

  这两者其实都有两种表达方式一种是这种空内容,一种是提供灰色默认图,只是所在场景不一样,这种加载效率最高

  通过把预加载出来的图片进行高斯模糊处理,Instgram也是采用提供灰色图和高斯模糊两种方式,好玩有趣

  通过以上分析在做默认加载预览过程中实现方式推荐有以下几个方式,根据自己产品特色选用合适的表达方式:

  网站在前期的时候都是很难上排名的吗,那么是因为你的网站基础优化都没做好,怎么可能会有排名呢,首页说到了基础的优化那就要从根本的地方说起。前期就是先把网站的设计和网...

  随着情人节的结束,2月份的设计圈干货大合集悄然更新。新的工具新的资源,依然是以往的分量,依然是相同的味道。和过去的合集相似,免费的素材、工具、服务占据了列表中9成的...

  每个网站都是由不同功能不同类型的页面构成的,当用户打开错误链接的时候,网站的404页面就派上用场了。一个可靠的404页面在告知用户他们走错地方的同时,还应当引导用户继续浏...

  今天来给大家讲讲如何用Axure实现上下滚动效果。 如何实现上下滚动效果: 让内容在显示区域滚动; 内容面板没有接触到顶部时,让内容面板移动至顶部; 内容面板接触到顶部,没有接...

  你还在加班为每一个小功能的实现自己“码码码”吗?今天想早点下班的你,快来看看我最新发现的工具包吧!有了他们,这些功能你只需要直接用,或者用一点时间把他们优化的比作者创造时更...

  对于电商产品而言,注册功能必不可少,但是各大APP间注册功能设计有何不同,作者对此站看了分析,一起来看看。 过去一周因为工作的需求,我潜心研究了各大电商APP的登录注册功能...

  本文作者将以淘宝、京东为例,从产品设计方面来了解巨头们是如何做内容电商的。enjoy~ 消费继续升级,众电商平台意识到导购垂直电商对其分流影响,了解到内容对消费决策的影响力...

  注:使用用户路径图,能够帮助我们统筹全局,对整个网站/APP的用户流动洞若观火。 什么是最好的设计? 1971 年,英国伦敦,国际园林艺术研讨会,迪斯尼乐园的路径设计获得世界最...

  其实,应用市场图相关文章之前就有写,一直没有整合。最近在进行新版本设计,在新版本设计中,分析的竞品与优秀应用的市场图多达40余款,从中发现问题并得到解决方案,一同记...

  大家都知道,LOGO对于一个产品来说,至关重要。 成功的LOGO可以让用户在短时间内判断你是谁,做什么的,而且区别于竞品的同时,传递自己的品牌理念,让用户达成共识,并进行广泛...

上一篇:用提供信息服务的心态去做网络营销
下一篇:这10个趋势,是2018年用户体验设计关注的重心

欢迎扫描关注我们的微信公众平台!

欢迎扫描关注我们的微信公众平台!