根据图虫网的app产品倒推了图虫网的产品需求文档,写这篇文档主要是为了加强对产品功能的逻辑和细节上的把控,也是为之后工作中能给开发UI测试呈现出一个可量化条理清楚便于理解的产品需求文档做准备。本文省去了实际PRD中版本修订、业务描述、产品前景等内容,直接从PRD的核心内容产品功能逻辑说起。 目录 一、文档综述 1。1PRD输出环境 1。2产品介绍 1。3文档名词说明 二、产品结构 2。1产品结构图 2。2产品信息结构图 三、全局说明 3。1功能权限 3。2键盘说明 3。3页面内交互 四、产品详细功能说明 4。0常用操作 4。0。1。常用icon 4。0。2。分享弹窗 4。0。3。更多操作 4。1。欢迎页 4。2。登陆注册页引导页 4。2。1登录首页 4。2。2授权后注册页 4。2。3注册页 4。2。4登录页 4。2。5选择感兴趣图片分类页 4。3。发布图博页 4。3。1选择照片 4。3。2图博编辑 4。3。3输入标签 4。4。首页 4。4。1首页推荐列表 4。4。2顶部文字图博图片图博 4。4。3热门标签推荐 4。4。4用户推荐 4。4。5活动推荐 4。4。6首页关注列表 4。4。7图虫编辑推荐 4。4。8大图 4。4。9图片图博详情页 4。4。10文字图博详情 4。4。11回复详情弹框 4。4。12用户列表页(关注粉丝喜欢人优秀讲师列表) 4。4。13打赏 4。4。14图片标签主页活动标签主页 4。5。图博列表页 4。6。发现页面 4。6。1发现页面 4。6。2搜索页 4。6。3摄影课堂页 4。6。4影像频道 4。6。5热门摄影师页 4。6。6活动列表页 4。7。消息 4。7。1消息 4。7。2通知列表页 4。8。我 4。8。1我图博 4。8。2我喜欢 4。8。3我活动 4。8。4我更多 4。8。5设置 4。8。6个人信息 4。9。用户主页 一、文档综述 1。1PRD输出环境 1。2产品介绍 图虫网是专为摄影师打造的照片分享与经验交流的平台,其致力于成为中国年轻摄影师的成长平台。为摄影爱好者营造一个自由平等、版权尊重的环境,让其输出的影像发挥其价值。 1。3文档名词说明 二、产品结构 2。1产品结构图 2。2信息结构图 三、全局说明 3。1功能权限 分为未登陆状态与登陆状态。 登陆状态下可进行所有操作 未登录状态下不可进入导航栏中发布图博消息和我,不可进行喜欢、评论、打赏、关注用户、参加活动、订阅标签的操作;进行以上操作跳转到登录首页4。2。1 3。2键盘说明 点击(手机号、验证码)输入框时弹出数字键盘 点击其他输入框弹出字母键盘 3。3页面内交互 四、产品详细功能说明 4。0常用操作 4。0。1常用icon 4。0。2分享弹窗 页面逻辑:点击分享到朋友圈微信好友手机QQ微博 4。0。3更多操作 页面逻辑: 朋友圈微信好友手机QQ微博:点击分享 生成长图:点击生成长图〔略〕 查看参数:点击打开照片参数弹窗 举报:点击弹出actionsheet,按钮1:淫秽色情,按钮2:违法有害,按钮3:广告营销,按钮4:版权盗用。点击按钮后弹出toast举报成功 编辑:点击打开图博编辑页 删除:点击删除图博 4。1欢迎页 首次启动app进入开屏视频,开屏视频播放5秒出现下图中开启图虫按钮,点击开启图虫进入登录首页4。2。1 非首页启动app进入欢迎页1或欢迎页2 页面逻辑: 若未登录,显示欢迎页1,3秒后进入登陆首页4。2。1 若已登陆,显示欢迎页2 a)欢迎页2背景图为编辑人工推荐的应用内用户所发照片 b)点击欢迎页2任意位置进入该推荐图片的图博详情页4。4。9 c)未点击3秒后自动跳转到首页4。4 4。2登陆注册页引导页 4。2。1登录首页 页面序号逻辑: 点击调出微信微博QQ授权接口,授权登陆后进入首页4。4 点击进入注册页4。2。3 点击进入登陆页4。2。4 点击进入以未登录状态进入首页4。4 4。2。2授权后注册页 页面序号逻辑: 默认为授权号的头像。点击弹出actionsheet,按钮1为拍摄照片,点击打开设备相机;按钮2为相册上传,点击打开相册。 用户名唯一不可重复。默认为授权号用户名,若授权号用户名已被注册,自动在授权号用户名后加随机三位数字,例如张三383。 未输入用户名为禁用状态,输入用户名切换为可点击状态。点击后校验用户名是否唯一,校验失败弹出toast该用户名已被注册;校验成功进入选择感兴趣图片分类页4。2。5 4。2。3注册页 页面序号逻辑: 点击校验手机号格式 手机号已注册,弹出toast该手机号已经存在 手机号格式不正确,弹出toast手机号格式错误 手机号无误,点击发送验证码,进入120s倒计时,文本变为Xs后重试,倒计时结束后恢复发送验证码状态 点击进入《图虫用户协议和隐私条款》〔略〕 输入项有一项为空注册按钮为禁用状态,全部输入后变为可用状态。点击按照用户名、密码、手机号、验证码的顺序校验。以下为校验失败提醒。 用户名:用户名重复,弹出toast该用户名已存在 密码:密码6位,密码框上红字提示密码长度至少6位 手机号:手机号已注册,弹出toast该手机号已经存在;手机号格式不正确,弹出toast手机号格式错误 验证码:验证码位数不对,验证码框上红字提示验证码位数不正确;验证码错误,弹出toast短信验证码错误 所有项校验成功点击进入选择感兴趣图片分类页4。2。5 4。2。4登录页 页面序号逻辑: 点击忘记密码进入密码找回页〔略〕 登陆:输入框有一项为空时为禁用状态,全部输入变为可用。点击校验用户名、密码,校验成功进入首页4。4 4。2。5选择感兴趣图片分类页 页面序号逻辑: 编辑推荐的标签分类,选择后打钩 选中任何分类弹出;分类至少选择3个;每选择一个文本中数字减1;选择3个或以上时文本变为完成;点击完成进入首页4。4 其他说明:此页面选择的分类标签存储在用户订阅的标签中 4。3发布图博页 点击底部导航栏中,打开选择照片 4。3。1选择照片 页面序号逻辑: 未选择图片时为禁用状态,选择后可用,点击进入图博编辑页 点击校验图片宽高比,1:5宽高比5:1。若不满足要求选择失败弹出toast图片宽高比不能大于5:1或小于1:5,换一张试试;符合要求选择成功 点击进入页面2 点击选中显示照片大小,1M以下以K为单位,1M及以上以M为单位 其他说明:最多选择30张图片,选择第31张图片时弹出toast最多只能上传30张图片 4。3。2图博编辑 页面序号逻辑: 发布 无图片时为禁用状态,有图片时可用 点击后若未添加标签,弹出alert添加标签可以让更多人发现你的作品,不添加标签就发布吗? 发布后进入首页关注,并展示发布的图博 点击删除照片 点击进入右边页面 点击进入选择照片 点击弹出输入标签窗口 点击添加标签,添加的标签进入到输入标签右边 4。3。3输入标签 页面序号逻辑: 常用标签:点击添加标签。常用标签是当前用户使用过的标签,按照用户使用次数由左到由排序,使用次数多靠前。最多显示10项。常用标签超过屏幕时,支持左右滑动。 推荐标签:编辑人工推荐的标签,支持左右滑动 添加的标签区域: 点击删除标签 键入字符后进行精准匹配,匹配项来源于已存在的标签,点击匹配项添加标签 支持键入字符后按空格或换行添加标签 关闭弹窗 4。4首页 首页默认tab为推荐 4。4。1首页推荐列表 首页推荐下包含6个模块内容:顶部banner、文字图博、图片图博、热门标签推荐、用户推荐、活动推荐、图虫编辑推荐。 页面说明: 内容排序:顶部banner3个图博1个标签推荐3个图博1个用户推荐活动推荐5个图博1个图虫编辑推荐(剩余均为图博) 默认显示10条推荐图博,顶部下拉更新10条推荐。底部上拉加载10条图博,加载的图博为之前默认的10条推荐图博(按之前的推荐次序展示) 最新更新的10条推荐图博显示标签分类(例如人像热门),其他底部上拉的图博显示图博发布时间 推荐规则:不详〔略〕 4。4。2顶部文字图博图片图博 页面序号逻辑: 用户名、头像:点击进入用户主页4。9 标签图博发布时间:顶部下拉最新更新的10条图博显示标签,点击进入图片标签主页4。4。14;其他显示发布时间。 发布时间5秒内显示刚刚 发布时间559秒显示XX秒前 发布时间159分钟显示XX分前 发布时间123小时显示XX小时前 发布时间19天显示XX天前 发布时间10天以上显示年月日,例如20170709 图片:最多显示图博详情中前两行图片。点击进入大图4。4。8。 图片排布规则:设有6张图,其宽高比分别为:a,b,c,d,e,f;系统设定宽高比例参数值介于K1和K2之间,下图为计算逻辑图,具体K1和K2值未知。 说明:后文中无特殊提及的地方图片排布都采用此方法 喜欢、评论、分享、打赏图标 评论:点击评论进入图博详情页(下)4。4。9 打赏:点击打赏进入打赏页面4。4。13 图博标题和图博内容:文字图博根据屏幕宽度显示3行图博内容,图片图博显示前2行 更多操作 照片数量:照片数量2行隐藏 活动:点击进入活动标签主页4。4。14,若无活动则隐藏 小头像:按时间次序最多显示最新点击喜欢的5人头像,点击进入用户主页4。9,无喜欢隐藏 标签:用户发布图博时所打标签,点击进入标签主页4。4。14,无标签则隐藏 喜欢人数:点击进入喜欢人列表页4。5,无喜欢隐藏 评论个数:点击进入评论详情页图博详情页(下)4。4。9,无评论隐藏 页面说明:点击图博内其他任何位置进入图博详情页(上)4。4。9 4。4。3热门标签推荐 页面序号逻辑: 图片:图片展示两行,图片为标签主页4。4。14中最热页签下置顶的前两行图片 页面说明:点击除订阅外任何位置进入标签主页4。4。14 4。4。4用户推荐 页面序号逻辑: 图片:显示3张图片,图片为该用户主页图博的前三张图 发现更多:点击进入热门摄影师页6。5 页面说明: 点击其他任何位置进入用户主页4。9 用户简介按屏幕宽度显示一行 默认显示5个推荐用户,支持左右滑动,滑动到最右显示发现更多 用户推荐规则:不详 4。4。5活动推荐 页面序号逻辑: 投稿数量200,显示已投稿XX;投稿数量200,显示火热报名中 页面说明: 背景图:背景图为活动海报 点击任何位置进入活动标签主页4。14 4。4。6首页关注列表 页面说明: 内容来源:用户所关注人的图博 默认显示20条图博,顶部下拉加载最新图博,底部上拉继续加载20条图博。。 排序规则:按照发布时间排序,新发布的在上 4。4。7图虫编辑推荐 页面说明:编辑推荐是图虫官方运营的用户账号,其属性为用户。点击除关注外任何区域进入用户主页。 页面序号逻辑: 图片:图片展示两行,图片为用户主页9中图博的前两行图片 4。4。8大图 页面名称:大图 页面逻辑: 支持左右滑动更换当前图博内图片 显示当前图片序号总图片数 大图上滑进入照片参数页 点击空白区域返回进入大图前的页面 页面名称:上滑后页面 页面逻辑: 举报:点击弹出actionsheet,按钮1:淫秽色情,按钮2:违法有害,按钮3:广告营销,按钮4:版权盗用。点击按钮后弹出toast举报成功,举报消息提交至编辑处审核。 点击空白区域返回进入大图前的页面 4。4。9图片图博详情页 页面:图博详情页(上) 特殊说明: 显示图博发布时间 显示全部图片 显示全部图博内容 喜欢和分享与写评论写死到页面底部,写评论逻辑见图博详情页(下) 页面序号逻辑: 文本显示规则 打赏人数0:还没人打赏,快来当第一个打赏的人吧 1打赏人数(N)3:用户A、用户B、用户C共3人打赏,点击用户名进入用户主页4。9 打赏人数(N)3:用户A、用户B、用户C等共N人打赏,点击用户名进入用户主页4。9 页面逻辑:除特殊说明外与4。4。2中图片图博页面逻辑相同 页面名称:图博详情页(下) 显示条件:评论数量0,显示图博详情页(下) 页面序号逻辑: 评论数量 评论排序分为最热和最新,默认显示最热排序 最热排序规则:首先按照点赞数量排序;若点赞数量相同,按照评论的回复数量排序;若评论回复数量相同,按照时间顺序排列 最新排序规则:按照时间顺序排列 回复层:点击用户名进入用户主页,点击其他区域进入回复详情弹框4。4。11;回复层评论按照时间次序排序,新发布的在下 点赞:点赞后显示数字1,图标变为红色;再次点击取消点赞,返回未点赞状态 评论:点击弹出评论框 其他说明 评论时间:年月日时:分:秒,例如2017080716:20:03 点击评论条的其他任何位置打开评论弹框,给该层用户发表评论回复。发表的评论回复进入回复层 支持图博发布者删除评论,支持评论者删除自己评论 无评论回复时隐藏回复层 4。4。10文字图博详情 页面说明: 图片:图片宽度自适应屏幕,点击进入大图4。4。8 图博内容为图片文字穿插排列,具体以发布者编辑为准 其他功能逻辑与4。9图片图博相同 4。4。11回复详情弹框 进入条件:回复数量0 页面序号逻辑: 回复数量:评论的回复数量 评论层 点击用户名、头像进入用户主页4。9 点击其他任何位置打开评论弹框,发表的回复进入回复层,回复者头像右边显示回复者用户名 回复层 点击用户名、头像进入用户主页4。9 点击其他任何位置打开评论弹框,发表的回复进入回复层,回复者头像右边显示xx回复xx,例如张三回复李四 写评论:点击打开评论弹框,发表的回复进入回复层,回复者头像右边显示回复者用户名 其他说明: 回复时间:与评论时间规则相同。年月日时:分:秒,例如2017080716:20:03 回复排序:按照回复时间排序,最新发布的在下 支持当前用户删除自己的回复 4。4。12用户列表页(关注粉丝喜欢人优秀讲师列表) 页面说明:使用此页面的有关注列表页、粉丝列表页、喜欢人列表页,优秀讲师页 页面序号逻辑: 标题名称 关注列表页:关注 粉丝列表页:粉丝 喜欢人列表页:N人喜欢,N为点击喜欢的人数 优秀讲师页:优秀讲师 信息条 简介:最多显示33个字符 点击其他任何位置进入用户主页 默认显示20个,滑动到底部每次加载20个 排序方式: a)优秀讲师:不详 b)关注、粉丝:按照用户名首字母排序 c)喜欢:按照点击喜欢时间排序,新点击在上 4。4。13打赏 页面序号逻辑: 打赏金额:默认为5元,点击其他金额选中 输入打赏金额:输入后中取消选中,输入金额限制到0。01 微信支付:未选择未输入时点击弹出toast,toast内容请选择或输入打赏金额,选择或输入后点击调出微信支付接口 文本规则:与图博详情页(上)4。4。9规则一致 4。4。14图片标签主页活动标签主页 页面序号逻辑: 图博数量活动剩余天数投稿数:每日24:00更新数量 摄影师: 默认显示10个用户,滑到底部每次加载10个 排序规则:不详 其他页面逻辑与4。4。12用户列表页相同 最热最新页签:排序规则见4。5 文字图博缩略图 显示图博标题,截取图博内容 点击进入图博列表页4。5并定位到该图博 图片图博缩略图 图片为图博中第一张图 左下角显示喜欢数量与评论数量 右上角显示图博内图片数量,图片数量1则不显示此项 点击进入图博列表4。5,并定位到该图博 点击打开发布图博4。3,标签中加入活动标签。 活动介绍:点击弹出活动介绍页(略) 4。5。图博列表页 以下页面采用图博列表页 页面 页面序号逻辑: 点击返回进入页面,并依照当前页面的图博定位到返回页的该图位置(见下图示) 页面名称:根据入口命名,名称见上表 4。6。发现页面 4。6。1发现页面 页面序号逻辑: 搜索:点击弹出搜索页4。6。2 焦点图 最多5张,支持左右滑动 焦点图分为2类。活动类:点击进入活动标签主页;图虫一周精选:点击进入图虫一周精选的图博列表页 摄影课堂:点击进入摄影课堂页;影像频道:点击进入影响频道页;摄影师:点击进入热门摄影师页4。6。5 热门活动 最多显示5个活动,支持左右滑动 滑到最右显示更多活动,点击进入活动列表页4。6。6 点击全部进入活动列表页 标签推荐 标签名称tab支持左右滑动显示隐藏标签 图片支持左右滑动更换标签 上滑后页签固定顶部(见下图) 点击图片进入图博列表页4。5 4。6。2搜索页 页面序号逻辑: 点击关闭搜索页 点击进入图片标签主页或活动标签主页4。4。14 点击进入用户主页4。9 搜索逻辑: 标签:根据输入内容进行精准搜索,匹配标签活动名,搜索结果右侧显示已有N组图或已有N投稿 用户:根据输入内容进行精准搜索,匹配用户名和简介 4。6。3摄影课堂页 页面序号逻辑: 点击进入我的课堂页〔略〕 点击进入用户列表页4。4。12 点击头像进入用户主页4。9 教程 点击头像进入用户主页4。9 点击其他任何位置进入文字图博详情页4。4。10 阅读数:显示点击进入图博详情页的人次 封面图:图博详情内第一张图 4。6。4影像频道 页面序号逻辑: 点击弹出更多操作 点击进入文字图博详情页,阅读数为点击进入详情页的人次 图片图博 点击进入图片图博详情 图片:图博内前三张图 阅读数为点击进入详情页的人次 4。6。5热门摄影师页 页面序号逻辑: 点击打开搜索页4。6。2 图片为用户主页图博中最新的三张图;点击其他任何位置进入用户主页。 页面说明: 默认加载10个用户,每次下拉到底加载10个 推荐规则:不详 4。6。6活动列表页 页面序号逻辑: 活动状态:距截稿N天评奖中已截稿,编辑可根据活动状况更改活动状态 4。7消息 4。7。1消息 页面序号逻辑: 点击进入通知列表页 点击进入粉丝列表页 消息条 a)头像:点击进入用户主页 b)图片:图博内第一张图 c)动态中点击进入图博详情页(上)4。4。10,评论中点击进入回复详情页4。4。11 d)时间显示规则: 5秒内显示刚刚 559秒显示XX秒前 159分钟显示XX分前 123小时显示XX小时前 19天显示XX天前 10天以上显示年月日,例如20170709 4。7。2通知列表页 页面逻辑: 时间显示规则:年月日,例如20170709 通知内容: a)打赏通知:【用户名】给你的作品【图博名称】(无名称显示无标题)打赏【XX】元 点击进入图博详情页 b)编辑人工通知:内容为人工自由编辑 根据通知链接到其他页面 4。8我 页面序号逻辑: 点击进入设置 点击弹出分享页 封面图:点击更换封面图,默认为登录首页封面图 点击更换头像,见4。8。6 点击进入个人信息4。8。6 点击关注进入关注列表页,点击粉丝进入粉丝列表页4。5 页面说明: 向上滑动:图博喜欢活动更多页签固定至顶部 4。8。1我图博 页面说明: 图博缩略图:与4。4。14图片标签活动标签主页中缩略图格式相同 排序规则:见4。5 点击图片进入图博列表页4。5 4。8。2我喜欢 页面说明: 此页面下图博为当前用户点击过喜欢的图博 图博缩略图:与4。4。14图片标签活动标签主页中缩略图格式相同 排序规则:见4。5 点击图片进入图博列表页4。5 4。8。3我活动 页面说明: 活动名称:点击进入活动标签主页4。4。14 图博:点击进入图博详情页 时间显示规则:年月日,例如20170709 去看看:点击进入活动列表页4。6。6 4。8。4我更多 页面序号逻辑: 点击进入我的打赏页 点击进入图片标签主页4。4。14 4。8。5设置 页面逻辑: 用户名:点击进入个人信息4。8。6 清除缓存: 点击弹出actionsheet,按钮1文本为清除缓存数据 点击按钮1清除缓存 推送设置:点击打开推送设置页 a)关注、喜欢、评论、图虫推荐默认为选中状态 b)取消选中后不为用户发送该项的推送 打赏功能:默认选中状态,取消选中后,当前用户的图博中隐藏打赏按钮 关注作为首页:默认未选中状态,选中状态:进入app后首页的页签默认为关注 Appstore评分:点击打开Appstore图虫评论页 分享给好友:点击弹出更多操作 意见反馈:点击打开意见反馈〔略〕 开屏视频:点击打开第一次启动app时视频 关于图虫:点击打开关于图虫页〔略〕 退出登录:点击退出当前账号并返回登录首页 4。8。6个人信息 页面逻辑: 头像:点击弹出actionsheet。按钮1:拍摄照片,点击打开设备相机;按钮2:相册上传,点击打开本地相册。 用户名:若1月内更新过用户名,点击弹出toast用户名一个月仅能修改一次;若用户1个月内未更新过用户名,点击进入修改页。 输入用户名后,若用户名重复,弹出toast用户名已被占用;若用户名可用,更新用户名,返回个人信息页,弹出toast更新成功,记录用户名更新时间。 简介:点击进入简介修改页,最多输入140字。点击完成更新简介并返回个人信息页,弹出toast更新成功 居住地:点击进入省市选择页,选择省市后进入市区选择页,选择完成后返回个人信息页,弹出tosat更新成功 个人封面主页:点击打开本地相册,选择照片后上传,上传时弹出toast正在上传,上传封面后跳转到4。5我 4。9。用户主页 页面说明:除特殊说明外,与4。8我页面逻辑相同 特殊说明:点击头像显示全屏;不可更换封面;关注操作;用户名不链接页面;更多打赏下不可提现。 最后,虽说想要尽可能的把产品的逻辑都写清楚写完善,但毕竟不是图虫真正的产品经理,很多对于功能上的把握不到位,对于逻辑的梳理会有遗漏,有些地方只是流露于表面,也希望能够得到更多专业产品人士的批评指正。