男装推荐分享网站设计研究.ppt

1.课题简介,在时尚类购物推荐方面，男性用户往往是受到歧视的。拿当下非常火爆的美丽说和蘑菇街来说，男性一直是被排斥在外的，并且美丽说至今仍不允许男性用户注册。对于本来就不太懂得穿衣打扮的男性来说，其实他们更需要关怀! 其实，男人也有买衣服的需求，也想了解些男装穿着搭配的常识，提高下自己的审美品味。据相关数据统计，57%的男人还没有找到属于自己风格的服饰；83%的时间浪费在选不适合自己的衣服上；62%的男人因为工作繁忙从没有认真打理过自己；全国至少1亿男人的衬衫尺码错误；10个男人中有3个习惯白色袜子配黑色皮鞋 男人帮就是为此而创立的男士时尚购物分享网站，我们只专注于男性市场，为18-35岁为主的男性用户提供服饰搭配和时尚潮流的购物分享及推荐，解决男人场合着装、服饰搭配、时尚潮流、商务礼仪等方面的购物和交流需求。,3.1 用户研究,网上二手资料展示：,用户persona 模型,嘉宾：C君和D君 档案：23岁左右；理发师； 爱好：上网、音乐、旅游。 喜欢时尚，淘宝达人，愿意分享自己喜欢的衣服和鞋子,访谈场景及录音,用户persona 模型,分析需求：,用户persona 模型,找的资料展示：,加关注，可以有很多粉丝,可以上传，分享,用户persona 模型,嘉宾：D君 档案：23岁；学生； 爱好：看书、健身、上网、打电游。 作为一名学生，闲暇之余，除了健身之外，他通常喜欢打打电脑游戏或者上网看看新闻、数码、汽车。,注：与他交流过，但是无访谈场景拍照及录音,用户persona 模型,分析需求：,用户persona 模型,找的资料展示：,可以推荐一些团购发送优惠券,导航清晰，易于使用,用户persona 模型,嘉宾：B 君 档案：37岁左右；商店老板； 爱好：与人沟通、音乐、上网。 B君也喜欢上网淘宝，但是由于体型偏胖，要想找到称心如意的衣服非常困难,访谈场景及录音,用户persona 模型,分析需求：,用户persona 模型,找的资料展示：,可以加入和创建一些小组，一起讨论,用户persona 模型,嘉宾：F姐 档案：23岁；学生； 爱好：看书、音乐、旅游。 和所有的女人一样，她的衣橱整洁而又秩序，里面有各种各样的衣服，她知道在不同的场合穿什么样的衣服。唯一让她头疼的是她的男朋友，每次要出门的时候，总觉得少了点什么,访谈场景及录音,用户persona 模型,分析需求：,用户persona 模型,找的资料展示：,可以上传自己的上身效果图,可以发表评论,3.2 网站解构,美丽说,男品街,男品街解构,解构思维导图,男品街解构,3.2.1 视觉-界面的解构,首页,男品街解构,3.2.1 视觉-界面的解构,潮流街,男品街解构,3.2.1 视觉-界面的解构,搭配街拍,男品街解构,3.2.1 视觉-界面的解构,潮专题,男品街解构,3.2.1 视觉-界面的解构,男人帮,男品街解构,根据我对男品街网站的解构，该网站的界面设计主要有一下特点： 1.整体布局简约，体现了一种男士精致的生活，囊括了潮男、型男、品质男的时尚选择，拒绝平庸。 2.从色彩看，主基调为蓝色，蓝色非常纯净，通常让人联想到海洋、天空、水、宇宙。纯净的蓝色表现出一种美丽、冷静、理智、安详与广阔。蓝色具有沉稳的特性，具有理智和准确的意象，强调科技和效率。 3.从人体工程学角度看，有颜色、图像等媒体的界面增加了视觉上的感染力，减少疲劳感；图形更具有直观、形象、信息量大的优点，使用户的操作及其观感更直接、可见和逼真，增强软件系统的可理解性和易学易用性。还有一些反馈信息和容错手段。,界面设计的解构的总结：,男品街解构,根据我对男品街网站的解构，该网站的界面设计主要有一下不足： 1.整体布局非常简约，显得不够丰富，而且极大部分是静态的，缺少一些灵动。 2.从导航和状态栏看，只有大的标题，如果想要进入大标题下的小标题，必须先打开大标题的页面才能跳转。 3.从人体工程学角度看，主页显示的内容过多，需要下拉才能继续浏览,界面设计的解构的总结：,男品街解构,1.整体布局也需要保持简约，主基调也采用蓝色，尽量图文并茂，多添加一些动态的东西。 2.设置导航条时，鼠标移入显示子标题。 3.尽量把内容显示在一页内，更新速度快一些。,我的网站的规划：,男品街解构,3.2.2 操作方式的解构,男品街解构,3.2.2 操作方式的解构,1,2,3,4,男品街解构,3.2.2 操作方式的解构,男品街解构,3.2.2 操作方式的解构,男品街解构,3.2.2 操作方式的解构,男品街解构,3.2.2 操作方式的解构,男品街解构,3.2.2 操作方式的解构,男品街解构,3.2.2 操作方式的解构(Visio 图),男品街解构,首页操作流程：,男品街解构,潮流街操作流程：,男品街解构,搭配街拍操作流程：,男品街解构,潮专题操作流程：,男品街解构,男人帮操作流程：,男品街解构,达人秀操作流程：,男品街解构,根据我对男品街网站的解构，该网站的操作方式主要有一下特点： 1.操作方式主要是鼠标移入、移出、点击、滚动，还有键盘输入，都是一些常用的操作，操作简单方便。 2.操作起来条理清晰，能够引导用户做出正确操作，同时具有一定的容错能力。,操作方式的解构的总结：,男品街解构,根据我对男品街网站的解构，该网站的操作方式主要有一下不足： 1.男品街是一个倡导买家分享推荐的社区，但是总是有大量的广告性分享。 2.男品街定位是推荐男士精品，分享贵于精而不在于多，总是有些比较杂乱的商品分享。,操作方式的解构的总结：,男品街解构,1.操作方式主要是鼠标移入、移出、点击、滚动，还有键盘输入，因为都是一些常用的操作，操作简单方便。 2.操作起来条理也应该清晰，能够引导用户做出正确操作，同时具有一定的容错能力。 3.我们会对用户分享的商品进行人工筛选，优秀的分享会推荐在潮流街的相关商品类目中。,我的网站的规划：,3.3技术背景,Axure RP 允许程序设计者为程序或者网站制作动态的线框图、流程图、以及其他所需的图表。 规范的图标文档让您在交流、记录，设计上更容易被接受，使用Axure RP 建立更简单、更专业的数据表、图。 Balsamiq Mockups是一款进行网页原型设计的工具，内置很多常用的网页元素，可以让用户很方便地设计页面结构、注释交互关系。与其他原型设计工具不同的是，Balsamiq能够嵌入到Confluence、JIRA或