全速×飞凡汽车 | App视觉升级,探索焕新飞凡视界

原创 收藏 评论
举报 2023-03-10

社会经济快速增长,中国汽车产业也在不断创新升级,科技前沿的产品设计、周到的门店选购服务、舒适的驾乘体验对于众多汽车品牌来说已是标配,越来越多的汽车品牌开始追求更加极致的用户体验。在移动互联网赋能万物的今天,用户在选购汽车前更倾向于通过网络收集汽车信息,帮助自己进行购买决策。针对此用户需求,各大汽车品牌不断优化其App,帮助消费者足不出户,动动手指就可以享受到看车、选车、买车全链路服务。在汽车App的设计与开发中,成功的视觉设计可以直观地向用户传达公司文化底蕴以及可信赖的品牌价值。那如何通过视觉呈现来优化用户体验?UI设计的成功密码又是什么?话不多说,一起来看看全速在“飞凡汽车App视觉焕新”案例中的探索与创新。


全速×飞凡汽车App视觉升级案例



飞凡汽车是一家由世界500强上汽集团打造的用户导向的数据驱动型汽车科技公司,以“持续不断地用科技兑现人类对智能出行的想象”为品牌愿景及使命,致力于打造高阶智能纯电移动空间。在此之前,飞凡汽车已推出自己的App,但为了顺应其业务等方面的发展、持续为客户提供最佳的使用体验,需要对其App进行全新的视觉升级,从而焕发品牌活力。



根据品牌网页UI应用展示、品牌App UI应用展示、标准色以及品牌原有风格,我们对视觉风格进行探索创新,完成设计方案的输出。


设计风格:透气、时尚、年轻

①运用线性Icon和大圆角的CTA按钮,给人一种时尚、年轻的感觉。

②通过足够宽松的间距设置,来营造透气感,有效控制信息密度,提升设计感。

③结合多色多样的配图,使整体的设计风格更年轻、更有活力。



开屏页面

整体背景颜色改为灰蓝色,以适应整体APP改版的色调要求,将Logo置于中上方,加入英文Slogan,结合动效设计,体现空间感和品质感。


探索页面

①将Banner放大处理,去除圆角,增加毛玻璃效果,显得更加潮流、科技。

②新增快速入口组件,使用双色线性图标,避免页面纯图组件展示。


社区页面

①Banner样式保持统一,增加了双列信息流的间距,营造透气感。

②制定了用户上传图片审核规范,保证图片的展示效果。


“探索”、“社区”页面展示


爱车页面

①将非核心CTA按钮下放到二级页面,降低展厅首页的信息密度,最大化显示图片效果。

②优化页面的tab切换效果。

③将白色不透明CTA按钮改成毛玻璃效果。


商城页面

①增加留白使页面更具呼吸感,添加横版浏览模块,不仅增加页面利用率还增加了组件多样性。

②对商品图片进行新的规范,保证页面的统一性。

③调整优化了图片组件各个字段的层级关系和亲密性,并用橙色凸显价格,提高视觉权重。


“爱车”、“商城”页面展示


我的页面

①去除云端背景,以符合品牌规范。

②对信息进行分类分区,宫格布局。

③整体背景颜色改为浅蓝色,会员积分卡片改为浅色卡片,配合橙色文字做突出,“签到”部分重点显示用户是否签到,信息更易被理解和阅读;对信息进行分类分区,突出图标弱化文字,信息内容一目了然。


“我的”页面展示


更多页面展示


感兴趣的小伙伴们,欢迎进入应用商店搜索“飞凡汽车”App进行下载,注册登入后即可体验。


汽车App的设计,对促进汽车行业的发展,以及最大化程度满足用户需求,都起到了重要的作用。希望飞凡汽车App此次视觉焕新,能够通过更精致的细节、更清爽的页面、符合品牌特色的设计风格,给客户带来全新的视觉体验。



项目负责

UI设计:用户体验设计部


文中图片及版权信息归非凡汽车所有

该文章为原创文章,如需转载请联系我们

本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
转载请在文章开头和结尾显眼处标注:作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
未经授权严禁转载,授权事宜请联系作者本人,侵权必究。
本内容为作者独立观点,不代表数英立场。
本文禁止转载,侵权必究。
本文系数英原创,未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权,侵权必究。

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    DIGITALING
    登录后参与评论

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    800

    推荐评论

    暂无评论哦,快来评论一下吧!

    全部评论(0条)

    作者
    全速数字设计

    全速数字设计

    浙江 杭州

    拱墅区祥园路108号中国智慧信息产业园A座6楼