苏宁易购商城首页设计分析 推荐苏宁易购首页改版内容

哈喽,小伙伴们大家好,今天秦浩废话就不多说了,直接上干货,标题:苏宁易购商城首页设计分析,苏宁易购首页改版内容,还有干货苏宁易购商城首页等等各种精品,希望各位能认真阅读。因为,只有这样才能真正理解和掌握!

苏宁易购作为国内领先的综合性购物平台,大多数用户都有各自的不同诉求。无论是有目标性的购物,还是以“逛”为性质的浏览,亦或是看视频看直播性质的娱乐,用户对苏宁易购APP的使用体验都有着不同的希冀,而作为设计者,将这种希冀变成现实便是我们的工作目标。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

首页在苏宁易购客户端中扮演着十足重要的角色。进入首页后,该如何快速的找到想买的商品?该如何找到优惠活动?想看看购买攻略,又该从哪里下手?想娱乐一下,逛逛店铺看看直播,能满足吗?带着问题,一起来看看,这次的苏宁易购首页都有哪些变化吧!

设计思路

首先需要明确的是此次首页改版的几个目标:

  • 一平台的角度制定规则,提升首页坪效。

  • 内容展示空间更立体,主次分明,楼层类别清晰,浏览体验流畅,适当的留白不拥挤。

  • 首页所有楼层不要单独设计独特性,引导用户侧重内容特色,内容为王,考虑品牌感与品质,品牌更需渗透到整个链路中。

这也就意味着我们需要从视觉语言上设计出更清晰的楼层和更具有辨识度的分类场景,同时模块更多的考虑支持内容的露出。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

当然,在满足用户的同时,更高的留存率与转化率,更有效的品牌渗透也是我们所追求的,毕竟苏宁易购可是我们吃饭的家伙(笑)!

首页在满足用户诉求的同时,还需更多的考虑易用性和情感化,我们不希望只是提供一个冷冰冰的购物工具,而是希望更贴近用户的情感,“温暖购物”。

设计亮点

梳理产品脉络,优化布局

新版首页加入了头条以及场景化的分类,也同时对首页的布局进行整体的优化。旧版的视觉问题是小元素较多、楼层分类不明显、拥挤感比较强,所以我们想用新的设计让页面更加整体。

新版的页面区分和业务紧密集合,除了常见的搜索功能、联版广告、分类导航icon区以外,我们在首屏放入几个主推模块作为主打产品。紧随其后的是场景化分类展示区,这个区域根据生活场景将频道与内容归类整理,方便用户浏览。其次则是直播及视频、热门市场入口、单品推荐区。这些大区域的区分方式我们注意了排版的统一性,利用纵向栅格使得上下对齐严格统一,横向栅格则使页面节奏统一,以达到提升浏览效率,层级更加清晰的目的。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

严格遵循对齐布局

更通透的界面

2016年横扫硅谷的新趋势Complexion Reduction风格,有几大特点:

  • 标题字号加大、加粗。

  • 图标简化。

  • 黑白两色界面。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

新旧版Apple Music对比

这一设计理念使得产品界面摆脱了无用的模块拼接式设计,走向了一条更加注重整体感、重视用户感受的道路。当然,app的页面设计应该以内容为准,而不是跟随潮流,但其中的精华可有所借鉴。

CR的设计风格使用大量留白,减少分割线等,来使界面更为清爽,此次首页也借鉴这种理念,尽量减少分割线的使用,利用留白和色块区分层级。旧版的首页由于放出了较多频道的LOGO字符使得页面字体较多,显得杂乱,新版使用统一的字体来避免出现体验满意度下降的情况。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

ICON区域与头条区域仅使用留白划分功能区域

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

例:减少复杂交互,色块平铺

联版优化适配

我们一直在寻找最理想的针对iPhone X的适配方案,希望在支持iPhone X适配的同时,依然减少运营的工作量,并且又能达到视觉层次的完美。所以,适配方案需要能支持千变banner的运作,又要照顾视觉的美观。

我们尝试的第1套方案将搜索与banner分开,iPhone X的界面将顶部多出的长度以对应的颜色填充。此方案的适配工作量最小,但缺点也很明显:1、增加了顶部高度,使得首屏展示内容变少2、没有沉浸式体验。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

方案1

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

方案1

方案2的样式则在iPhoneX上依然最大化的保留了沉浸式的氛围体验,同时也使得首屏展示的内容更多。利用裁剪的技术方式,每张banner也仅需设计一版,无需增加运营成本。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

方案2

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

方案2

经过考虑后,我们认为方案2的视觉样式更具优势,所以最终选定了方案2。

场景化分类

我们从用户的角度出发,重新将频道的分类进行了场景化的区分。旧版的首页很难快速找到自己喜爱的频道入口,而此次首页划分出5个场景化楼层:品质潮流、爱逛街、爱生活、爱我家、玩转金融,用户可根据场景化的分类快速找到自己喜爱的内容。

每个楼层的楼层标题与场景氛围图融合,楼层内的模块可作为频道入口亦可成为内容展示入口,丰富了展示类型。同时APP会自动记录分析你的浏览行为,对哪些品类更感兴趣,其位置就会更加显著的出现在你面前,以实现千人千面的效果。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

对应楼层的VI色则是根据对应场景来确定的。冷艳低调的蓝、热情张扬的红、健康积极的绿、温馨静谧的黄以及高端大气的土豪金,VI色的应用将对应楼层区分开来,同时也对应展现了这些场景想表达的情感。

  • 潮品质:突出品质以及潮流元素(蓝)

  • 逛实惠:突出实惠元素(红)

  • 享生活:突出生活的健康(绿)

  • 精致家:突出家的温馨(黄)

  • 智慧金融:突出商务感稳重感(土豪金)

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

上密下梳布局

在超过3屏后,页面已经属于靠下的位置,这也就需要更清爽的层级来表达信息以便用户能快速定位。因此我们将靠下楼层的内容的密度降低,进行留白以便用户快速定位。

这样做同时也避免首页信息量过大,缺少主次层级的问题。经过调整对比后,我们决定从热门市场楼层开始将布局改为一行3模块的布局,以减少每屏的信息量。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

一行4模块密度降低为一行3模块

模块化搭建

首页需要满足机动性、可替换性,由此我们联想到了乐高。利用不同模块的“积木”,可以组合出各种各样的“造型”。首页的设计我们也融入了这种模块化的思维,做到每个模块可替换、可编辑、可自由组合。利用这种设计,不仅可以轻松的调整业务框架,也能满足大促时期的氛围营造。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

模块化的搭建,较大的发挥空间

下拉刷新及二楼交互优化

优化原先的下拉刷新交互,增加下拉打开二楼的功能,我们对下拉交互的文案及高度做了优化,期望达到更好的体验。

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

苏宁易购商城首页设计分析,苏宁易购首页改版内容,苏宁易购商城首页

结语

此次首页改版通过新的设计语言,在满足产品诉求的同时,带来更好的用户体验。希望在年前的最后一个版本,为大家带来一个耳目一新的首页。

好了,今天就说到这里了,希望这篇文章可以帮到你,看完了这篇苏宁易购商城首页设计分析「推荐苏宁易购首页改版内容」还是不太明白的话,建议多阅读几遍。更多相关知识,尽在巢座耶学习网,每天坚持更新!

本文发布者:百事通,不代表巢座耶立场,转载请注明出处:https://www.chaozuoye.com/p/13589.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 jubao226688#126.com 举报,一经查实,本站将立刻删除。

(0)
上一篇 2023年12月2日 14:11
下一篇 2023年12月2日 14:31

相关推荐

  • 余额宝存款上限多少 新手必看:最新限额规定介绍

    大家好,今天沈达华给大家讲解下关于余额宝存款上限多少,最新限额规定介绍的事情,以及余额宝存款上限的一系列相关干货,整理总结之后,我就想着写这篇文章和大家分享一下,因为毕竟新手朋友还是很多的! 理财产品已经得到投资者们的青睐,很多人只要有闲钱就研究起各种理财方式,下面就跟大家聊聊理财产品! (1)余额宝 2013年6月余额宝货币基金诞生,瞬间得到投资者的青睐,…

    2023年11月24日 百科
  • 网站怎么推广 秒懂:目前最有效的推广方法

    很高兴又和小伙伴们见面了,这次周彬主要整理了一些关于网站怎么推广,目前最有效的推广方法的事情,还有关于网站怎么推广这些的精品干货文章,精心为你准备的干货,通过这篇文章相信你能有所收货! 时光匆匆如流水,转眼间,三年时间已过。从网推小白,成为网推高手。还记得当初,掌握一种推广方法的时候,就会很高兴。 也经常会因为自己的推广手段与他人有稍微的差别,就忍不住的想要…

    2024年1月12日
  • 学生怎么利用网络赚钱 推荐推荐10个正规靠谱的方法

    大家好,今天孙子涵给大家准备的干货是学生怎么利用网络赚钱,推荐10个正规靠谱的方法,以及怎么利用网络赚钱等等各种一系列的相关干货,认真阅读完,把我想表达的思路完全理解,相信你很快就可以掌握! 如今这个竞争激烈的时代,兜里没点钱真的不敢出来混。不管是去干什么,只要一动就得花钱。像北上广这种一线城市,很多月光族都在每天的挣扎,挣扎着起床,挣扎着上班,挣扎着挤地铁…

    2024年3月9日 百科
  • 开网店哪个网站好 推荐新手开网店必看教程

    大家好,今天杨天予精心为你准备了干货开网店哪个网站好,新手开网店必看教程,以及开网店哪个网站好这些一系列的相关干货内容,成功的路上不会一帆风顺,每一个成功的背后都有一个惊人的故事。 其实商家的选择也不多,电商平台也就那么几个。 如果是工厂,可以选择的平台是1688,抖音直播Ftoc(工厂直接对接用户模式),小程序商城。还有各种电商平台的厂家直销频道。 如果是…

    2023年11月22日 百科
  • 现在开网店在哪个网站好 秒懂:新手开网店平台推荐

    小伙伴们你们好,沈美君很高兴又和各位见面了,今天主要来讲讲现在开网店在哪个网站好,新手开网店平台推荐,以及其他关于开网店在哪个网站好的一些相关干货,主要就是想给大家提供一个思路分享给大家,毕竟也是经过一系列总结过的哈! 开店网上卖东西,但是现在网购平台的日益增多也不知道在哪个平台操作会好一些,今天我就给各位新手详细分析一下,首先自我介绍一下我这边是电商创业八…

    百科 2023年5月6日
  • 抖音增加粉丝技巧及注意事项 必看:教你抖音怎么一天涨一万粉丝

    最近比较忙,今天钱小琴又抽时间给大家带来了抖音增加粉丝技巧及注意事项,教你抖音怎么一天涨一万粉丝干货,还有关于抖音增加粉丝技巧这些的内容,先说明一下,老司机直接飘过吧,主要是讲解给新手朋友们的哈! 我知道,很多朋友都想做抖音,或许你也是,搞个30万、甚至100万的大号,接广告都衣食无忧了,但是!你不知道如何起步!OK,我刚好跨过起步阶段,有8句话可以跟你分享…

    2023年7月3日 百科