| | 3 | 美搭化妆品1.0.0版本开发需求 |
| | 4 | 改版背景 |
| | 5 | 1,利用女性网化妆品库庞大的数据资源以及PC指数等独有分析数据,将化妆品库APP化。 |
| | 6 | 2,通过APP,协助销售同事的工作,增加网站的效益。 |
| | 7 | |
| | 8 | 开发概述 |
| | 9 | APP1.0.0的主要的功能概括如下: |
| | 10 | 1,【首页】显示焦点图和编辑推荐榜单入口 |
| | 11 | 2,【找美妆】为库型结构栏目 |
| | 12 | 3,可通过【品牌馆】进入某品牌的单品列表 |
| | 13 | 4,首页、找美妆、品牌都有【搜索】入口。 |
| | 14 | 6,【分类单品】列表,可通过选择功效筛选单品 |
| | 15 | 7,【品牌专页】展示品牌介绍和该品牌的全部单品,单品系列。 |
| | 16 | 8,【单品终端】展示产品信息,每个【单品终端】有【专业评测】、【试用报告】和【购买】的入口 |
| | 17 | 页面框架链接http://192.168.20.18/beauty.zip |
| | 18 | |
| | 19 | 页面结构: |
| | 20 | |
| | 21 | |
| | 22 | 首页功能需求 |
| | 23 | 1,首页内容 |
| | 24 | 焦点图读取规则:自动读取化妆品web的焦点图,等比例压缩, |
| | 25 | 焦点图可能出现的内容 |
| | 26 | 属性 说明 |
| | 27 | 评测终端 焦点图原链点:http://beauty.pclady.com.cn/100/1009629.html |
| | 28 | 应对应到化妆品库评测终端,打开app内的相应评测页面 |
| | 29 | http://cosme.pclady.com.cn/pingce/102934.html |
| | 30 | 活动/专题 用web veiw打开。 |
| | 31 | 单品终端 应对应到化妆品库单品终端,打开app内的相应单品页面 |
| | 32 | 试用页面 用web veiw打开。 |
| | 33 | |
| | 34 | 推荐榜单入口读取规则:图片icon、名称、链点由编辑后台录入,最少录入6个,iPhone4截取前3个显示,iPhone5显示6个。 |
| | 35 | *点击进入【功效榜单】 |
| | 36 | |
| | 37 | 2,辅助工具 |
| | 38 | 条形码扫描:点击扫描按钮打开扫描页面。线下扫描并解析实物条形码后,匹配网站数据库终端,进入对应单品终端。 |
| | 39 | *返回时直接回到首页 |
| | 40 | |
| | 41 | 搜索功能: |
| | 42 | 属性 说明 |
| | 43 | 进入搜索页面的入口 首页工具弹出层按钮、【找美妆】搜索框、【品牌馆】搜索框。 |
| | 44 | |
| | 45 | 交互方式 从首页进入:原页面向左滑动消失,同时搜索页向左滑出现,键盘从下往上弹出; |
| | 46 | 从【找美妆】【品牌馆】搜索框进入:搜索框缩短,显示取消按钮;搜索框一下内容切换为热门搜索词,键盘从下往上弹出。 |
| | 47 | 热门搜索词 可后台更新,点击热门搜索词跳转到搜索结果列表 |
| | 48 | 收藏夹:本地保存用户收藏的单品 |
| | 49 | 属性 说明 |
| | 50 | 单品列表 显示图片+单品名称 |
| | 51 | 删除 点击删除按钮,单品出现“X”图标,可逐个点击删除;删除按钮变成确认图标,点击确认退出删除状态。 |
| | 52 | 分类 收藏的单品按照分类排列,如收藏中无该分类的单品,则不显示。 |
| | 53 | |
| | 54 | 3,【找美妆】——产品库 |
| | 55 | 功能概述:找美妆栏目包含分类列表和搜索框。分类中包含一级分类和二级分类,交互按家居优品3.0,二级分类列表可上下拖动。点击二级分类进入【分类榜单页】 |
| | 56 | |
| | 57 | 分类榜单页功能: |
| | 58 | 属性 说明 |
| | 59 | 分类标题 显示所进入的榜单标题 |
| | 60 | 排序 点击标题栏的排序按钮可切换按不同维度排序: |
| | 61 | 按高分,按热门,按最新,最贵,最便宜 |
| | 62 | *默认按高分排序(即按PC指数高低排序) |
| | 63 | 样式切换 样式切换区域隐藏在列表顶部,交互效果见原型: |
| | 64 | 点击切换“普通列表样式”和“大图样式” |
| | 65 | 功效筛选 点击筛选按钮(或向左拖动榜单页面),原页面向左移动,露出“功效列表”; |
| | 66 | 再次点击筛选按钮(或向右拖动榜单页面),原页面向右移动,遮盖“功效列表”。 |
| | 67 | 点击选择功效后,改label呈选中状态,原页面向右移动,遮盖“功效列表”,并且刷新列表数据。 |
| | 68 | 交互效果见原型: |
| | 69 | 列表内容 普通列表样式: |
| | 70 | 图片,名称,点评数,PC指数,排名名次 |
| | 71 | *名次在所有排序中都会显示,但都是以PC指数的分数来确定每个单品的名次。 |
| | 72 | *名次只显示到前30名,30名以外的不显示名次数字。 |
| | 73 | |
| | 74 | 大图样式: |
| | 75 | 图片,PC指数,名次 |
| | 76 | |
| | 77 | 产品终端: |
| | 78 | 属性 说明 |
| | 79 | 显示内容 单品名称,PC指数,价格,产品分类,排名,多维评价数据,规格,功效; |
| | 80 | 添加到收藏按钮,分享按钮; |
| | 81 | 专业评测入口(显示评测标题),试用报告入口(显示点评数量); |
| | 82 | *1-30名显示具体数字,30名以外的单品统一显示为“30名外” |
| | 83 | 价格与购买 价格取价格列表中的“官方”价格; |
| | 84 | 点击购买按钮切换到报价列表页,点击报价列表某项打开购买链点webview; |
| | 85 | *无价格数据时不显示价格与购买按钮。 |
| | 86 | 多维评价数据 包括:专业评测 / 详细评分 / 肤质分布 / 年龄分布 |
| | 87 | 以柱状图形式展示各维度分数 |
| | 88 | *没有专业评测数据时隐藏之,只显示另外三个数据 |
| | 89 | 交互方式 从列表页进入产品终端页,产品终端页由右向左滑动出现; |
| | 90 | 点击返回按钮(或向右拖动终端页)返回到榜单 |
| | 91 | |
| | 92 | 评测与点评:读取网站上用户对每个单品的评价内容进行展示 |
| | 93 | 属性 说明 |
| | 94 | 专业评测 http://cosme.pclady.com.cn/pingce/1679.html |
| | 95 | 评测内容分页显示,每页内容底部显示评测对应的单品,点击跳转到单品页。 |
| | 96 | 试用报告 显示用户头像,用户名,肤质,年龄,点评内容,“精华定评”和“使用报告”标签。 |
| | 97 | 可选择只显示“精华定评”和“试用报告”,这两类评论可点击进入点评终端。 |
| | 98 | |
| | 99 | 4,【品牌馆】功能需求 |
| | 100 | 功能概述:品牌馆栏目包含品牌列表和搜索框,点击品牌图标进入【品牌专页】。 |
| | 101 | |
| | 102 | 品牌馆功能: |
| | 103 | 属性 说明 |
| | 104 | 品牌列表 可参考电脑网品牌列表: |
| | 105 | 顶部有8个推荐品牌置顶,编辑可在后台更新; |
| | 106 | 其余品牌按品牌首字母排序; |
| | 107 | 右侧有“荐,A,B,C.....Z”滑动条,点击或滑动定位到相应的字母分类位置 |
| | 108 | 品牌分类 品牌分类切换区域隐藏在列表顶部,交互效果见原型: |
| | 109 | 点击切换“全部”“欧美”“日韩”“国货”四个品牌类别; |
| | 110 | 默认显示“全部” |
| | 111 | |
| | 112 | 品牌专页功能: |
| | 113 | 属性 说明 |
| | 114 | 品牌介绍 品牌图标,品牌中文名,英文名,创始人,发源地 |
| | 115 | 品牌单品列表 显示单品图片,单品名称,PC指数; |
| | 116 | 按照web默认排序,点击进入单品终端 |
| | 117 | 品牌系列 点击系列按钮(或向左拖动榜单页面),原页面向左移动,露出“系列列表”; |
| | 118 | 再次点击筛选按钮(或向右拖动榜单页面),原页面向右移动,遮盖“系列列表”。 |
| | 119 | 点击选择系列后,改label呈选中状态,原页面向右移动,遮盖“系列列表”,并且刷新列表数据。 |
| | 120 | 交互效果见原型: |
| | 121 | 样式切换 样式切换区域隐藏在列表顶部,交互效果见原型: |
| | 122 | 点击切换“普通列表样式”和“大图样式” |