十一吃喝玩乐必备SVG模版

宝藏模版

往期推荐(点击阅读):

趣味效果高大上可爱风年终总结循环特效情人节(一)情人节(二)妇女节儿童节儿童节(二)618父亲节丝滑动画端午节滑动妙用图片轮播又红又专中秋节(一)双十一世界杯圣诞节新年兔年春节元宵节|愚人节杂志范儿520/521五一旅游母亲节多巴胺微博夏日氛围大唐国风反诈宣传七夕节CityWalk开学季揭露丑恶真相运动会中秋节(二)

各位黑科技编辑器的会员,编辑器内 1000+ 的 SVG 组件你们都用过吗?十一&中秋长假将至,有哪些 SVG 组件适合体现企业品牌的休闲服务能力?上期《🥮适合中秋节的SVG模版🥮》我们已经做了部分盘点,本期再来看看更多吃喝玩乐主题推荐。

吃货地图!(任意点放大-消失)

想告诉读者某个店铺的准确位置?甚至超链接前往详情页面?不妨试试像 Google Earth 一样基于 SVG 编辑器创作连续 ZOOM IN 特效吧!请连续点击下方画面查找当下的北方美食热点:

结合「零高容器」就可以实现这样的创意排版,这里提供一个排版结构参考:

图片

  

想喝哪款?(摇摆效果)

想呈现单品的丰富性?通常运营人会采用标准的轮播动画循环滚动,但循环的运动容易让读者失去对数量的准确把控,并不足以感受到「多」的特征!此时,具备往返摇摆效果的 SVG 黑科技排版相对更能体现数据的宏观量,以瑞幸咖啡公众号的《酱香拿铁补货中!还有本周9.9好喝榜~》为例:

在黑科技编辑器的组件搜索功能内搜索「摇摆效果」组件,并在筛选器内调整为「左中右」版即可使用!同时,也推荐你点击阅读《以SVG展示商品?26款轮播/滑动模板任你选择。》了解更多典型的商品轮播 SVG 排版特效。

限定美食!(纵向滑动)

计划推出了限量、限店的特别美食?那少不了门店信息的罗列呈现。而如果清单过长,那么一定要利用好「纵向滑动」类型组件优化阅读体验:

注意在使用「纵向滑动」组件时,其默认高度为 160vw(约手机一个全屏高度),可以通过自定义参数对其进行修改。更多滑动类组件创意欢迎点击阅读《你距离SVG高手,还差这10个教程!》查看丰富的案例复盘视频教学。以下提供上述排版的结构参考:

图片

 地标打卡!(地图多点游走缩放

E2 平台的热门 UGC 原创组件「地图多点游走缩放」是由知名开发者@2H 发明设计并授权至 E2 的创意 SVG 黑科技排版,在微信派公众号的《这件事如果你今天不做…》最早亮相,非常适合大地图中的地标打卡互动:

通过该组件,可以让镜头产生游走效果,并放大弹出详情卡片,展示地标的具体图文信息,关闭后前往下一处位置……欢迎广大用户支持@2H 老师的这款创意发明,任何用户均可在 UGC 专区直接点击组件名购买,并请记得联系平台客服技术官索要该 SVG 组件素材包和教程,认真进行素材准备和提前练习。

景点收藏夹?(标签抽拉

接下来推荐的是由意符文化@GL 老师发明的「标签抽拉」SVG 组件,适合折叠多组图文信息并自选查看:

将丰富的吃喝玩乐信息在同屏内有效组合展示,详略得当,充分体现了 SVG 交互排版的价值所在。

欢迎光临!(层层滑动接伸长)

节日期间筹备了有趣的线下活动?无论是展览、乐园、游戏、快闪,都不妨采用这套由 SVG 交互设计先驱@计育韬 老师和 @GL 联合发明的 SVG 组件揭幕,正如《是 渔 夫,还 是 超 人?》中的画展预告,对读者产生了极强的吸引力:

这种左右拨开-层层推进-全文伸长的效果,将悬疑感与信息量的常见矛盾充分化解,同时具备较强的 3D 视效感官,是线下活动预告的 SVG 首选形式之一。

在黑科技编辑器的 UGC 专区,已获授权提供了多款简化后(不含最后放大步骤)的层层滑动接伸长形式,同样建议购买后联系平台客服技术官索要该 SVG 组件素材包和教程,认真进行素材准备和提前练习:

图片

   

时间管理大师!(热区型弹出式海报)

景区、乐园的节庆时间表总是略显冗长,但又希望用户能及时看到甚至保存图片,如何将时间表的美观度与可用性相结合?以上海海昌海洋公园公众号的《起猛了!办卡!》为例,通过按钮设计将时间表折叠,同时点击后可以弹出并保存:

这样以来,占用篇幅过大的时间表被巧妙收纳到一图流的设计中,通过点击唤起后又能保存到高清大图方便用户转发使用,可谓是一举两得。在使用「热区型弹出式海报」时,注意记得通过热区功能划定响应范围后再导入自己的公众号进行效果预览噢!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值