新闻资讯

当前页面:首页 > 资讯动态 > 小多比的设计笔记(16):营养食谱APP改版分享

小多比的设计笔记(16):营养食谱APP改版分享

图片


关于营养健康食谱这一类别的app的发展,主要是由于近年来吃货标签的流行、美食爱好者逐渐增多的需求,以及对于自主烹饪产生兴趣的群体越来越多。与此同时,生活中频发的食品安全、食品卫生、饮食不规律影响健康等问题使得人们相比之前更加关注饮食健康和营养均衡,更多的人回归自主烹饪的方式。当下营养食谱类APP众多,如何才能脱颖而出?今天就为大家介绍来自UI29期阮同学关于营养食谱的APP改版心得。


图片


通过对竞品的分析调研,得出竞品app多以食谱推荐,课程学习,美食社区和购物商城为主,下厨房app更加重视食材电商部分,豆果美食更加注重健康管理,而香哈菜谱有着丰富的美食社交分享板块。但也各存在一些不足,在此基础上我们通过用户调研,了解了一些用户需求痛点,例如每日吃什么选择困难,新手做菜小白难入手,缺乏专业营养搭配常识。针对不同的用户群体,重新梳理了产品功能,考虑如何增加趣味性,能够适合更广泛的用户群体,我们在功能结构和视觉层面进行了优化。


首先是整体配色选择了logo中温暖的橙色作为主色,更加衬托食欲感,并且符合较多年龄层次的用户群体的审美。其次是图标的规范设计,为了贴合健康有食欲的特点,图标的设计联合实物进行了拟物的联想,并且色彩选取多为明度高的颜色,加之其浅色作为底板。整体统一且易懂。

图片

图片

接下来就是主要页面的概述。通过对旧版页面的分析,主要的问题是视觉风格杂乱,缺乏品牌特点,以及功能不够完善,且层次较混乱,用户操作繁琐。在此基础上我们进行了针对性优化。

图片

首页,图标比较复杂,色彩风格不统一,食谱展示缺乏食欲,并且菜谱推荐和教学视频放在了一起很难区分。改版后,我们进行了布局重构。在上方增加了搜索功能,完善了金刚区功能入口,下方的信息展示区也做了分类。关于金刚区重构,在原本的分类中增加了比较热门的减脂增肌,轻食控糖,以及用户需求较多但食谱类app很少关注到的助眠和母婴辅食类别。然后把下方原本单一的瀑布流推荐,分为三类,三餐计划,每日推荐和热能推荐,增加热门榜单标签,帮助用户进行信息分类。

图片

因为用户的分享欲需求,也乐于展示自我和社交。新增加了美食社交板块,根据饮食习惯形成饮食圈,同圈子的用户可以交流经验,分享食谱,增加了用户之间的交流,有利于增加用户粘性。同时设置一些热门话题和菜谱的有奖征集等活动,来提高app用户的活跃度。


接着是在商店板块,将购买时食材品类的选择优化为更明显且可以突出视觉效果的金刚区。以直观的瀑布流形式展示商品,便于高效选择购买。

图片

紧接着就是app最主要的功能部分,就是食谱课程板块。精选课程和会员课程分类,用户选择频次较高的以瓷片区的形式展示在最上方,下方的课程以及课程标签再次分类,便于不同用户群体根据自己的实际需求进行选择。点击进入就会看到食谱的详细信息,例如用时、难度等,帮助用户进行筛选,食材的一键加购,减少了用户的操作步骤。


在此流程中,首先看到的是课程名称和标签,建立认知,详细信息和食谱的浏览量和收藏量以及用时难度,增加信任感,其紧接着促使购买。食谱教学规范了信息层级和可操作区域,分步骤跳转也降低了用户的学习成本。


图片

在食材的详情页,原本的热量呈现方式信息层级不够突出。改版后不仅将食材的营养元素和热量详细呈现,同时标注了食材的不宜搭配,并且推荐该食材的相关菜谱,不仅可以增加食谱课程的点击率,也可以为新手小白以及需要注重搭配的母婴、养生人群带来便利。


图片

食谱的发布界面规范了创建食谱的界面。食谱的名称,描述,做了字数限制,图片也做了比例限制,食材的添加用量也分步骤依次出现,使用户在查看食谱的时候能够更加清晰易学,体验感更好。

图片

原本的个人中心和消息界面主要是做了视觉的升级,消息界面的图标选择了微质感偏扁平的风格,把个人中心重要功能用简洁的线性图标呈现,更加直观。同时也突出了会员功能,吸引用户点击,也是盈利的入口之一。下方切换可以清晰地看到自己的课程和发布的动态。

图片

其他页面的部分,首先是引导页,设计了比较具有趣味性的2.5d的形式,向首次进入app用户概括的展示介绍了app的主要功能。闪屏页根据不同的节日的传统美食进行设计,贴合app的美食内容吸引用户。同时也设计了H5运营活动,例如这个美食共享的周末特惠系列,通过促销福利,促进app的留存拉新。

图片

图片


PS:阿多比设计UI37期训练营3月8日开启,期待大家的加入!


图片



小多比的设计笔记(16):营养食谱APP改版分享

阅读量:1772