欢迎访问智唯网络!专业H5响应式营销型网站建设、百度seo优化、网络推广服务!
营销之道 干货分享
了解企业新动态,分享前沿的营销推广干货,成长路上,我们携手同行
网站设计News

实战案例!从零开始见证蘑菇街APP 新版的设计流程

发布时间:2017:03:21 11:03:15 | 已阅: | 作者:智唯小编 | 来源:智唯网络 | 共 0 条评论

扫一扫
手机访问

本文共有1431个文字,预计阅读时间4分钟
导语
编者按:用蘑菇街的新版案例带你学会一个App 的敏捷设计方法,包括快速竞品分析、绘制用户头像、搭建信息架构等

  编者按:用蘑菇街的新版案例带你学会一个App 的敏捷设计方法,包括快速竞品分析、绘制用户头像、搭建信息架构等等。

  本文作者是蘑菇街的设计团队,欢迎大家关注他们的追波地址哟:https://dribbble.com/mogu

  蘑菇街设计团队文章:

  《绝对不能错过!2016 年最流行的8个UI设计趋势分析》

  《热门趋势!从IOS 10 的交互设计中学到的3个设计启示》

  从2010年成立至今,蘑菇街已经成立6年。在未来的10年,我们的目标是:让中国的年轻女性变得更美更时尚(也因此更自信更幸福)。这是一个长远的目标,而我们当前的目标是:用最适合的方式,将物美价廉的时尚消费品交付到她们手中。

  为了实现这一目标,蘑菇街正在进行着一系列的变革,我们将从“社区电商”转型为“导购电商”,为更多的女性提供更优质的时尚内容和商品。变化从我们的APP开始,转型从我们的思维出发。新版app在几个星期内从无到有,完成了从业务,到产品,到交互,到视觉的全过程。

  谨作此文,一是团队和个人的工作总结,二是抛砖引玉,跟大家分享下期间的思考。

  

uisdc-app-20161219-(0)

  产品分析

  1. 以用户为中心,定位目标用户群

  唐.诺曼说过,如果在用户界面设计和人机交互领域中有任何神圣的原则,那必然是“了解你的用户”。不同的用户群体,他们的需求往往不同,甚至互相冲突。

  首先我们开始了解蘑菇街的用户。通过查阅数据,焦点小组,问卷调研等方式,我们对现有的用户提取了多维要素,形成了一系列数据标签,再对用户特征进行组合,归纳产生重要用户画像,并据此更好地根据核心大众用户的特征和需求找到适合他们的设计语言。

  

uisdc-app-20161219-(1)

  蘑菇街一直将目标用户定位于年轻,追求时尚的女性群体,经过分析,以下是两种最主要的用户模型:

  

uisdc-app-20161219-(2)

  2. 从社区到导购:一切从“痛”开始

  在女性用户领域长期深耕,使我们对自己的用户群体有着更深入的了解。年轻女性都是时尚的追求者,然而她们在购物时最大的痛点是:

  (1)不会搭配。

  (2)不会挑单品。

  而蘑菇街在时尚搭配,潮流,美妆等方面长期积累,功力深厚,完全有能力利用自身优势,将优质的商品提炼,组织,发掘出对用户真正有价值的内容。

  因此,我们这次改版设计思路,将围绕着“解决女性用户的痛点,传达时尚的感知体验”展开。表达和呈现内容

  1. 信息结构:根据使用场景的导航

  为了支撑新拓的导购业务,延续原来的社交内容,从用户的使用场景出发,重新梳理了信息构架,让“导购”、“社交”和“电商”能齐头并进,高效协同,让用户能够迅速找到入口、融入其中。

  基于用户的使用场景,5个tab分别定位为:

  • Tab1-导购:让用户“逛逛逛”。以PGC的内容为核心,提供精编时尚内容,激发用户兴趣。

  • Tab2-市场:让用户“买买买”。以市场频道、类目入口为主,以货架的形式组织商品,让用户最快效率地找到商品。

  • Tab3-动态:延续之前的社交形态,是用户和关注的达人(或商家)之间的互动社区。

  • Tab4-购物车:一站式的清单管理,让用户更方便地选择商品购买下单。

  • Tab5-我的:更多内容的入口。

  本次改版将原来与社交强关联的“聊天”入口进行了弱化,分散到各个页面的右上角,方便用户在任何地方都可以和卖家进行无缝聊天。转而使更方便购物结算的“购物车”占据了导航的一席之地,更突出了产品的电商属性。

  通过信息结构的重新排布,不同需求的用户可以快速地切入主题,“导购”、“电商” 和“社交”的内容都得到了恰当清晰的展现。

  

uisdc-app-20161219-(3)

  2. 首页设计:传递时尚感知

  首页是一个App的门面,尤其是新改版后的App。新老用户打开app进入首页,就好比走进一个装修一新的房子。第一眼的感觉,很大程度上决定了他能继续逛下去还是头也不回地离开。

  蘑菇街导购主要从“穿搭潮流、美妆资讯“等内容出发,以“时尚主编,潮流达人,普通用户”的精选内容为核心。

佛山网站建设优化公司 智唯网络

专业建站,免费排名「快速上首页」5年建站优化经验

免费上首页>>马上咨询
专业建站 免费排名(有什么疑问的请留言或咨询在线客服)
  • 全部评论(0
    还没有评论,快来抢沙发吧!

上一篇:在线航班预定服务:GoogleFlights的交互设计

下一篇:从初级新手变成资深UI设计师 先掌握这3个设计方法论

  • 同行价格

    统一报价,无隐形消费

  • 金牌服务

    一对一专属顾问,7*24小时金牌服务

  • 售后无忧

    完善售后,客服经理全程跟进

建站优化二维码
建站优化二维码

截屏,微信识别二维码

微信号:13825575516

(点击微信号复制,添加好友)

优化二维码打开微信