省钱快报新版本设计

2年前发布

原创作品 / UI / APP界面
作品版权由yolandashan 解释, 禁止匿名转载;禁止商业使用;禁止个人使用。 临摹作品,同人作品原型版权归原作者所有。

省钱快报进入2018年,累计用户千万级,日活百万,设计团队也希望能让用户得到更好的视觉和用户体验,2.6.6版本对界面风格和交互体验进行了调整,希望在接下来的新版本UI中,在突出内容和功能的基础上,可以给用户更加年轻的设计的感受。
根据用户反馈、设计团队调研、设计流行趋势,总结发现省钱快报App存在一些问题,例如首页不整体,元素零散,入口太多,显的乱,层级关系不明确,设计风格不够新颖精致等问题。

设计关键词:新颖、时尚、品质、精致、简洁

首页
原有首页视觉不新颖,不够简洁,层级关系不明确,元素多而杂乱,我们真对这些问题进行调整:
1、统一了头部颜色,将品类tab切换条与头部合到一起,选用统一的品牌色彩:橘色渐变;
2、将原有选中条缩短,圆润,使其更轻量级更活泼;
3、头部搜索框也跟随整体风格,变成圆润的长方形,颜色深于底色,更突出搜索词;
4、banner做不通栏设计,悬浮效果,弥散投影,是banner更突出;
5、去掉分割线,将每一部分成为一个组件,通过色块,内容本身来做区分,使背景更统一,不零散;
6、根据运营需求,banner下面添加了五个运营位,让用户有更多的选择。

分类搜索页
1、突出分类滑动条选中状态,是其更醒目2、其他元素与其他页面风格统一

原有搜索结果页,视觉风格有些老,不够新颖精致,新的设计,将头部统一,用统一底色,使用户更有沉浸感,去掉之前的各种分割线,用色块区分。

商品详情页
将标题与价格位置互换,突出券后价格,在标题右侧增加分享icon,方便用户操作。
个人中心
区分层级关系,将常用突出功能至于页面顶部明显位置,其他功能以列表形式呈现,是页面整体,层级关系明确。

9.9页面整体风格没有大的改动,优化了一些设计细节:
1、头部搜索框与首页样式统一;
2、头部图片运营位圆角统一为14px;
3、品类切换tab有之前纯文字tab改为图文结合,是品类更形象具体,减少用户思考时间,方便用户选择。

3
- 位站酷推荐设计师推荐 -

声明:站酷(ZCOOL)内网友所发表的所有内容及言论仅代表其本人,并不反映任何站酷(ZCOOL)之意见及观点。

作品信息

  • 创作时间

    2018/05/08

省钱快报新版本设计
yolandashan 关注
没有新消息