序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!


天猫双11设计爆料——来看看今年的双11,天猫设计师和商家们一起用商品序列帧图片,都玩出了哪些新花样?

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

商品序列帧图片的互动设计

#01
滑动屏幕
体验超顺滑的商品拆机
DISMANTLE THE MACHINE

为了让消费者了解商品的内部结构,增强商品信息的互动性,设计师通过定义不同的触屏交互手势,运用序列帧图片交互的能力,让消费者与商品图片主动产生互动行为,帮助消费者快速认知商品和激发购买兴趣。


序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

电小二户外1800W大容量电源

拆解产品的结构,呈现内部充满科技感的汽车级电芯结构设计,这样一台大容量电源,可以满足户外自驾、户外作业甚至家庭应急的多种用电需求。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

小狗家用擦地吸尘器

消费者可以通过滑动屏幕,清晰看见小狗这台擦地吸尘器的无刷电机以及整机过滤系统的每个零件设计,了解产品的核心技术。


序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

UWANT多功能布艺清洗机

产品从完整到拆解的全过程,随着消费者的屏幕滑动依次顺滑的呈现。在消费者充分了解产品从外到内结构的基础上,从而影响商品的购买决策。

#02
直观感受
商品卖点对比的效果
– COMMODITY COMPARISON

设计师运用对比的方法,将商品的卖点烘托的更突出,让消费者在互动的过程中,形成对商品卖点更鲜明、更强烈的感受,对商品的特征产生更直观的理解。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

美菱十字双开门冰箱

使用同一块食材对比“深冷速冻”和“缓慢冷冻”的效果,消费者能直观感受到“深冷速冻”技术瞬间冻住食材,急速锁鲜让肉质鲜嫩如初。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

ZMI紫米PD快充手机充电器

以屏幕右滑模拟充电的过程,对比PD20W快充和原装5W充电器,在相同充电30分钟的前提下,不同充电器的充电量差异。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

vivo X70 Pro+ 智能手机

将实时“黑光夜视”的效果与使用前的画面进行对比,消费者可以非常直观的感受 vivo智能手机“黑光夜视”图像处理技术的魅力。


#03
轻松上手
操控商品的主要功能
OPERATION FUNCTION

线上购物主要透过屏幕了解商品的各项功能,无法直接对商品本身进行操作。设计师运用序列帧图片互动的能力,模拟商品的操作过程,让消费者轻松上手体验商品的功能特点。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

觉飞心愿全自动迷你洗衣机

觉飞这款迷你洗衣机很好的运用了图片互动的方式,配合画面的变化,在消费者左右滑动屏幕时,感受洗衣机“防手揉搓”的专利技术。


序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

华为 P50 Pro 智能手机

手机变焦功能已逐步成为主流手机的必备功能,那什么是拍照变焦呢?相信体验了华为这款商品的互动之后,你一定能很体会到1X、3.5X、10X、100X 变焦功能的强大。


序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

图马思特新一代动态力反馈方向盘

于此同时,消费者可以在触屏交互之间,模拟赛车游戏方向盘的操控,感受商品为游戏玩家打造的沉浸式场景体验。


#04
深度了解
商品的每个精彩细节
PRODUCT DETAILS

在了解商品的结构、功能之后,商品的每个细节也显得非常重要。运用图片互动的展示方式,让消费者可以更深度地了解商品本身,充分挖掘商品细节设计,最终激发消费者的购买欲。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

LANSAM 负离子电吹风机

从机身到电机的呈现,让消费者深度了解这款高达12W转/分钟的电机,对产品卖点产生更深刻的印象。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

蓓慈全自动按摩足浴器

消费者与商品图片互动时,可以直观看到足浴器在使用过程中水电分离加热技术运作的各个细节,对商品的整套加热系统更放心。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

道通智能 EVO Nano+无人机

在选购无人机时,摄像头是需要重点了解的功能部件。消费者以触屏滑动的方式,可以深入探索无人机镜头的细节,不放过每一处微小的设计。


#05
在哪里可以体验?
天猫双11新奇特会场
TMALL DOUBLE 11

今年的天猫双11,我们的设计师和众多天猫商家们一起,搭建了一个专属的互动会场,更多商品设计案例等你来玩!

方法1:11月6日-11月11日,长按保存二维码图片,进入淘宝APP用扫一扫打开,即可进入会场体验。

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!


方法2:  复制下方淘口令,进入淘宝APP即可直达会场玩起来~
79嘻以和过上他可一们也这子哈 https://m.tb.cn/h.fTter4G?sm=e0d2ea  11.11狂欢开抢,全场每满200减30!

注:以上案例均来自淘宝APP中商家已上线的设计方案,感谢天猫商家的支持!
编辑: 鲤

序列帧图片的互动设计:简单地滑动屏幕也能玩出新花样!

本篇文章来源于微信公众号: 天猫设计

UI/UX

长在Z时代审美点上的视觉设计-鲜花超级品类日

2021-11-9 16:30:00

UI/UX

看完他们的购物车,我小脸一红

2021-11-9 18:13:39

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索