APP原型设计案例--产品喵

作者: 初代皮神 | 来源:发表于2016-03-08 20:00 被阅读9380次

    成为一名产品经理是我职业规划心之所向。除了发自内心的热爱以外不要忘了不断地思考,实践。

    上周末在APP里闲逛找关于产品经理的APP时发现并没有几个,找到一个“产品经理”一个“PMCAFF”两个。前者是大家都熟悉的拥有PC端的woshipm.com,后者是个类似产品经理的问答社区。然后自己脑洞小开了一下:我能不能也原创个APP,基于帮助想从事于互联网产品岗位的新人和半新人更进一步的了解产品经理这个职业(目标用户)?

    索性就当是设计这一块练练手先。体验一下这个过程,又不会让我少块肉啊~于是说干就干,这次和以往自己模仿的几个原型,不太一样,基本每一个模块、颜色和字体规范等都进行了标准化和手工添加,部分页面精确到像素级。所以认认真真的当做自己真的在开发一个关于分享产品经理知识的APP。

    先来过个眼瘾:

    原型

    对了,这里用了罗小黑作为本APP的代表logo,当然我考虑到了版权问题,若是真的产品我一定会与作者联系申请到使用许可。我还是挺关注版权的。

    那么,开始吧。

    一、产品简介与应用平台选择

    1.产品名称:产品喵

    2.产品简介:产品喵是一款免费的产品经理学习交流,帮助喜欢产品岗位的新人小白快速了解行业动态,职业特征,经验分享的APP移动端学习平台。在这里精选业界互联网资讯推送给每一位喜欢互联网行业的新人,实时关注圈内动向;在这里和各路产品高手交流工作心得,跟随大牛体验产品岗位的工作流程;在这里有很多好玩新奇的主题交流圈,就让我们用敏锐的眼光捕捉每一处亮点,或许下一款改变我们生活方式的APP就出自你的手中~【提供的功能特质:资讯+交流+主题】

    3.应用移动端:iPhone ios7以上

    4.盈利模式:目前确立的营销模式是公开免费,暂无合理性盈利模式,待研究。

    二、简单用户调研

    1.目标用户:热爱互联网的人,想从事互联网产品岗的新人,产品经理/专员/助理/运营,UE/UI等设计师,程序员(万一转型)。目标使用APP年龄段:小白(18~24) 历练(25~30) 大牛(31~40)

    2.用户研究:问卷调查--省略}   (结论)

                      用户访谈--省略}   (结论)

    三、需求分析与产品方向确定(简化)

    需求分析:

    1.简介:(若有)

    1.1编写目的:确立本APP需求范围,功能实现过程,适用于研发组,业务,并作为APP研发需求范围的依据。

    1.2名词解释:(若有)


    2.概述:(若有)

    2.1项目背景:在线教育平台正迈向新的台阶,移动互联网时代人们在手机端的学习应用平台使用越发广泛,老大看好行业发展趋势,为培养互联网产品岗位从业人员,决定研发一款新的社区型移动端职业教育应用产品。


    3.界面设计需求:

    风格整体一览--简约轻量;

    字体统一使用--PingFang

                          颜色规范

    4.可兼容平台需求:ios (Android另外开发)

    5.安全分析需求:(若有)

    6.功能详细描述:(详见之后设计过程)

    7.其他约束:开发语言ios,数据库mysql,服务器--(某云)

    产品方向确定:

    1.产品定位:以提升用户产品岗位能力为目标,帮助目标用户成为互联网行业人才。

    2.产品策划:产品分析--市场分析--消费者分析(年龄;学历;家庭;收入;习惯;文化等)()--价格分析--媒体投入策略--广告创意--执行时间表--涉及人员--策划费用(请求支援~内容太多,都可以分开独立再写一篇文档了~这里不再赘述,话说有很多我也不会。但我们要知道在项目推进的过程中有这些工作项要做)

    3.数据收集:(不赘述)

    4.竞品分析报告:(IOS移动端目前关于产品经理相关的APP不是很多,直接竞品能确定的有"产品经理(woshipm.com)" --"PMCAFF " 次级竞品"网易云课堂"--"百度传课"--"腾讯课堂";关于竞品分析报告,也是一篇长文,这里不赘述,以后会补上这份作业)

    5.核心痛点解决:高效有针对性的个人职业培养。(五字描述痛点:免费学知识)

    (方法:用户建模;数据分析,把找不到资源的痛苦解决并让目标用户从痛苦状态改为痛快状态,切实解决提供目标用户学习产品岗相关的有效信息和方法)

    四、原型设计阶段

    1.思维导图:

    思维导图

    2.原型低保真首页

    低保真

    3.原型中保真交互流程(首页起始):

    几个模块流程图

    因为做的比较全,全部贴出来有点费劲,有些也是重复工作,为了简单直观点,挑几个重点模块演示一下。图片清晰度不高,因为是先用了Axure做了流程,再放到PPT缩略到一张PPT上,所以难免降低了清晰度。


    4.PPT演示部分:

    1 2 3 4 5 6 7 8 9 10

    11

    11

    五、登录注册流程图

    登录与注册/文章流程

    六、高保真与逻辑交互

    1.关于高保真:

    1.1从现阶段来看,我最多做到了中保真状态,因为目前很多交互逻辑还没有写上,比如登录和注册的判断,还有提供的测试用户用的的全局变量与局部变量都没有写,因为每一个细节要想的透彻确实要花费一段时间,而且在软件的选择上,为了更快的赶稿选择了最简单的草图原型软件mockplus,局限于该软件的交互逻辑判断几乎没有,所以也就没有设置这些数据了。有时间再挪到Axure上做逻辑交互,Axure7.0版本对于移动端页面的跳转有点麻烦,要一直用框架在内部进行跳,不知道8.0特性对于移动端设计增加了多少支持,有机会在研究一下。

    2. Axure端谈谈登录与注册的交互逻辑。

    2.1设置一个全局变量,里面存入用户名与密码,格式[[xiaoming@qq.com:123456]],在设置一个局部变量用来获取当前用户输入的字符串,去与全局变量存的数据匹配,若对则成功登录,若错误出提示信息。此时在用户登录时,可能遇到的情况包含:

    未输入用户名只输入密码,提示错误信息,聚焦用户名框;

    输入用户名,未输入密码,提示错误信息,聚焦密码框;

    都输入但其中一个输错了,提示错误信息或忘记密码请修改,聚焦用户名;

    输入用户名为无效字符,(不论密码框是否有密码),提示错误信息,聚焦用户名框;

    输入的格式不对(邮箱为例,没有@符或不是以@xx.com格式的),提示错误信息,聚焦用户名框;

    当都正确输入却无法登陆时,提示检查网络或因APP本身问题给出"出错了"信息页;

    什么都没输入直接点登陆时,提示请先登陆或没有账号,请先注册;

    选择第三方登录判断是否允许打开链接;

    选择第三方登录确认是否获取用户第三方信息;

    注册时(以邮箱为例),若已存在,提示错误信息该邮箱已注册,若忘记密码?请登录邮箱重置;

    注册时邮箱格式不符,提示错误信息更改;

    注册时邮箱对了,昵称重名,提示错误信息更改用户名;

    注册时邮箱对了,昵称对了,密码少于6位或多于30位,提示错误信息;

    注册时邮箱对了,昵称对了,密码对了却没注册成功,提示“出错了”或检查网络;

    注册时什么都没输入,或只输入其中两项或一项,提示错误信息“您还没有输入xxx”;

    成功注册转入个人页进行重新登录。

    七、小结

    产品经理的工作是繁忙的,因为我们要学的东西真的太多了,但正因为无时无刻不断更新着自己的知识库,我们才不断地走向成熟。所以希望有一天我们能真正的做出一款受用户所喜爱的产品。

    谢谢浏览,也请给些建议,个人公众号:NightAlumniPM    分享与产品经理相关的好文章。

    八、工具

    原型低中保真:mockplus

    图片流程:Axure 7.0

    文字流程(登录注册):visio

    演示:PPT

    需求文档:word

    参考资料:花瓣网,lofter,虎嗅,慕课网,豆瓣,文库,人人都是产品经理,互联网的壹些事,站酷,简书,新浪微博

    相关文章

      网友评论

      本文标题:APP原型设计案例--产品喵

      本文链接:https://www.haomeiwen.com/subject/sgqzkttx.html