如果我是PM|改造墨刀官网

作者: 菜鸟依依 | 来源:发表于2017-05-30 09:28 被阅读0次

    以前一直都是用Axure做原型图,最近因为工作需要,接触了墨刀这款产品。这里无意对比两款软件到底哪个好用,只想吐槽一下,墨刀的官网实在是有些混乱,讨论区实在是太难用了。

    在我浏览这个网站的过程中,充斥着:“这个到哪里去了?我怎么跑这里来了?怎么又回去了”这样的疑问。

    其实墨刀这个软件还是非常好用的,但是不成体系的学习教程和讨论区,以及较为混乱的布局无形之中增大了墨刀的学习成本。

    本文按照我自己的理解对墨刀官网进行一定的改版和整理。

    顶部导航区域改版(未登录状态)
    墨刀首页(未登录状态)
    改动一:去掉左上角的中英文切换功能

    一般来说,选择语言时在使用软件一开始就确定下来的,之后很少会修改它。因此这个功能没有必要放到这么明显的位置。

    改动二:去掉功能导览

    在非首页的其他页面,功能导览这个导航菜单都是没有的。而唯独出现在首页的功能导航,点击进去之后竟然还是首页,实在是一个多余的设置。

    改动三:去掉博客

    从博客的内容来看,这实在是一个比较鸡肋的功能。
    首先是内容非常杂乱,有新功能介绍,操作答疑,线下活动推荐,产品经理知识……
    其次从文章发布时间来看,最新的文章是两个月之前,再往前,有一个月连发好几篇的,有一个月一篇也没的。感觉墨刀官方也没有很用心的经营这个版块,说是官方精品文章,但是文章内容和讨论区中墨刀官方发布的文章看不出来明显区别,且有重合之处。
    还有一个最大的问题是,当用户登录墨刀进入工作区之后,这个版块就不见了!
    因此,在墨刀官方不是很能保证文章质量和更新频率的情况下,完全可以将这些文章整合到讨论区中,而无需独立出一个版块增加运营负担。

    改动四:增加“套餐介绍”版块

    我在一开始注册墨刀的时候,墨刀赠送了我十几天的创业版账号使用权限。然而墨刀官网中有关收费项目的介绍不是混杂在入门教程和讨论区中的,就是隐藏在个人设置中。由于墨刀没有在注册流程中给予引导性的说明,因此一开始我并不知道创业版和免费版有什么区别,这就导致即使后来我对创业版这个词产生了兴趣,也无法快速找到关于不同套餐区别的全面介绍。
    这就好像有一个商品,你想要卖给我,但是你不告诉我这个商品是干嘛的,其实是不利于销售的。

    改动五:将页面导航与登录注册按钮分开

    目前的登录按钮采取了和其他导航菜单一致的样式,这个页面上唯一的登录入口太不明显,容易导致用户登录流程出现问题。具体请看第三部分:注册和登录流程的改版。

    改动六:增加导航菜单选中样式

    以讨论区这个导航菜单为例,目前当切换到讨论区的页面时,采取的是特大标题加一句话描述的形式,告知用户当前所在位置。
    但是这样的形式会占据太大区域,压缩正式内容显示空间。让当前页面对应的导航菜单显示不同的样式,则可解决这个问题。


    讨论区页面(未登录状态)

    综合以上,顶部导航区改版如下:


    改版后顶部导航区
    入门教程页面改版

    除顶部导航区和底部区域外,这个页面一共分为两个大版块:视频和文档,同时提供电子书下载和搜索的功能。


    入门教程页面--视频部分

    在墨刀网站的视频版块中,加入了免费电子书和搜索文档的按钮。但是从逻辑上来看,免费电子书和视频应该属于平级的内容,不应混杂在视频版块。同样的搜索文档功能,与视频功能是没有关系的,也不应该放在这里。


    入门教程页面--文档部分
    查看文档中的内容,会发现这些文章都是讨论区的帖子。使用搜索功能搜索文档,更是会直接跳转到讨论区。
    另外,当我们从入门教程中通过预览文章或搜索进入讨论区后,并没有回到入门教程的路径,导致用户只能通过非正常路径(点击导航菜单重新进入)回到入门教程板块,影响用户体验。

    我改版的原则是:精简用户获取学习教程的方式和内容,以一种学习方式为主,构建从入门到进阶的学习体系。




    1,改变原来选项卡的展示形式,将入门视频和进阶视频分为两个独立的区域。
    2,对于已经登录的用户,视频左上角记录学习进度,标记已学状态。
    3,当用户学完后,引导用户点击页面底部的完成图标,显示出其余学习方式和内容。如下图:
    注册登录流程相关改进

    墨刀的首页除了内容展示,还提供一个注册的功能。点击第一屏的“立即体验”,会定位到倒数第二屏,也就是下图。


    首页立即体验部分

    看到这个页面,你认为他是一个注册的页面还是登录的页面呢?
    站在产品经理的角度,我们会认真的分析一下,这里应该是个注册的页面,点击立即体验后会创建一个新的账号。
    但是在不仔细分析的情况下,如果我将这个页面理解为登录页面,其实也是合理的。毕竟这个页面的标题和提交按钮上的文字,是完全可以适用于已有账号的登录者的。而且墨刀官网唯一的登录入口实在是太不显眼了,被忽略掉也是有可能的。
    我尝试着输入了一个已经注册的账号,点击立即体验按钮后,页面跳转到了如下图:



    提示我邮箱已经被占用。这里存在两个问题:
    如果邮箱已经被占用,其实应该设置登录页面为跳转链接才对。

    如果默认用户输入错误导致的邮箱被占用,还是需要引导用户继续注册,那么只需要在输入邮箱的时候在本页面给出提示,而不用跳转到专门的注册页面,否则用户不仅要重新输入邮箱信息,还要重复输入本来已经输入正确的姓名和密码。
    针对以上问题,对这一块的改进有如下几点:

    突出显示登录按钮

    将顶部导航中登入按钮与其他导航区分开(在顶部导航改版部分已经说过),让登录入口明显一些。

    调整表单顺序

    让用户先输入邮箱地址。用户输入完成光标离开之后,程序在当前页面检测,如邮箱已注册,则给出提示。

    加入登录引导

    加入“已有账号,立即登录”的提示,让用户明确理解此处的表单是注册行为,如果需要登录,用户可以通过这里的登录入口进入。
    综合以上,此处的改版如下图所示:


    改版后立即体验部分
    讨论区列表页改版
    墨刀讨论区

    讨论区是整个墨刀网站最重要的部分,因为墨刀的很多功能都是直接链接的讨论区文章,包括:
    1,入门教程的文档部分;
    2,网站底部导航中的“功能更新”;
    3,网站底部导航中的“常见问题”;
    但是这里的逻辑其实是非常混乱的,具体表现在以下几方面:
    1,版块区分混乱。
    从导航来看,墨刀将讨论区分为了:精选,分享,书单,功能请求和功能答疑五个小版块。
    但是实际上,当你从功能更新导航进入讨论区的时候,你会发现一个叫做“系统更新”的标签,意味着系统更新其实也是讨论区的一个版块,但是你无法在讨论区的导航中找到它。



    然后,当你点击发布帖子的按钮进入帖子编辑界面的时候。你会发现多出了一个招聘的板块。而讨论区列表的书单板块,这里并没有出现了。



    2,各版块内容混乱
    各版块之间的界定没有非常清楚,不仅用户没有按照既定规则发帖,墨刀官方团队也没有很好的执行内容分区规则,导致讨论区各版块一度非常混乱,给想在讨论区获取信息的用户造成很大困扰。
    比如说分享版块,理论上来说应该是用户分享自己墨刀作品的地方,但仅仅从第一页来看,这里就不仅有:新手指南,用户吐槽,还有墨刀官方发言人发布的墨刀相关新闻……


    再拿书单这个版块来说,官方对于书单版块的介绍是这样的:
    Paste_Image.png
    然而这个版块的文章和其他版块的文章并没有什么差别,没有投票功能,也不能提交新书。这个版块的帖子不多,基本都是墨刀官方自己发的,从时间来看也很久没有运营了。

    在改版过程中,我将讨论区重新整合为六个板块,如下图:


    改版后讨论区分区

    作品分享与现有分享版块一致,鼓励用户分享优质作品。
    墨刀动态用于墨刀官方团队发布系统更新动态,活动,以及新闻。普通用户不可在此版块发布内容
    使用教程用来放:入门教程文档及常见使用问题。鼓励用户主动发布功能使用教程,互相交流使用方法和技巧。
    PM这事儿:属于书单的进阶版,在不额外设计功能的情况下,为产品经理提供交流的平台。
    意见建议:原来的“功能请求”虽然能让用户主动反馈新功能,但定义过于狭义,比如说我发现一个bug,那这又不属于没有的功能,此时我应该发在哪个版块呢?
    还有一个版块就是精选,但这个版块不在讨论区导航中出现。当用户点击讨论区进入或刷新时,默认属于精选版块。当用户选中指定版块时,该版块样式改变,标记用户当前位置。

    3,讨论区列表页布局排版问题



    这个属于个人看法。
    列表页中展示的内容有:标题,发帖用户,浏览评论点赞人数,还有发布日期。
    可以看到当前的列表页布局中,发帖用户和发送时间,帖子标签和帖子标题,浏览评论点赞情况三块内容各占列表项的的三分之一,没有信息层级之分。
    这就导致一条内容占据过大的空间,在普通的笔记本电脑屏幕上面,一页最多显示三条内容。
    而在以内容为主的讨论区中,快速获取有效信息是非常重要的事情,这样的布局导致用户在浏览时受到其他非重要因素的影响,很难获取到有效信息。
    因此对此处内容的改版如下:


    改版后帖子列表
    区分信息层级,标题最为重要,因此字体大小和颜色均突出显示。其次是发帖用户,浏览评论点赞情况属于描述性信息,因此缩小字体,减淡颜色。最后是发布日期,除系统更新外,工具类的交流帖子时效性不强,因此放到右侧更不显眼的地方,作为参考信息。

    4,搜索按钮和发帖按钮布局问题



    图中可以看出,搜索框和发布按钮离的很近,比较容易造成歧义。因此在改版的时候,我将搜索和发帖分别放到两个区域中,明晰各自功能。搜索放在讨论区分区处,如下图:



    点击搜索后,搜索输入框会延长出来,供用户输入内容。

    发帖则被放入用户主页中,具体见下部分内容。

    5,用户个人主页入口改版
    点击某个用户头像或姓名,可以进入这个用户的墨刀主页。但是在整个墨刀布局中,没有进入自己主页的入口。因此导致:
    如果你不发帖,那么你将无法进入自己的主页。
    如果你发过贴,那么你需要按照进入别人主页的方式,首先找到自己的帖子,然后点击自己的头像,才能进入自己的主页。
    这样的入口对用户来说无疑是很不友好的。因此在改版中,我在讨论区列表页增加了个人中心板块,点击可进入我自己的个人中心。发布帖子的按钮也被放到这一板块。具体改版如下:


    改版后讨论区布局:已登录

    点击右侧头像或姓名,可进入我的个人主页。点击发布新贴,可进入帖子编辑界面。
    如果用户没有登录,那么这里显示如下内容,引导用户登录


    改版后讨论区布局:未登录情况
    讨论区内容页改版
    讨论区内容页
    返回上一页改版

    首先要强烈吐槽,这个返回上一页功能是多么的坑爹!因为你一旦点击了返回上一页,它给你返回的,是讨论区的主页!!!并且会默认帮你选中“精选”分类!!!这和我点击顶部导航“讨论区”返回有什么区别?
    你可以想象,一旦你浏览的不是讨论区主页的内容,你就需要不停的返回,翻页,滚动鼠标定位。特别是当你浏览的是其他版块的内容的时候,你还需要在翻页之前切换版块!
    我不知道有多少人有耐性做这样的事情,反正我当时看到第三页就放弃了。最后的结果是我花了半个小时学习了一下爬虫插件,然后把讨论区的文章爬下来,在本地挑选阅读。
    其实这个的改版主要是功能逻辑的改版:点击后会退到刚才进入的页面,而不是统一跳转到讨论区主页。
    我在此处将他的位置放到了右侧,且相对屏幕固定,方便用户鼠标点击。

    文章布局:头部改版

    原来的内容页,用户姓名头像,标题,标签,发布时间和预览人数各占一行,导致整个头部区域占据了整个屏幕的一半,重要的文章正文迟迟没有到来。



    因此在改版时,将发帖用户相关的信息独立出来,放在右侧。将文章标签和发布时间统一作为描述信息,放到标题下方,浏览量则放到文章末尾和点赞评论数一起显示。具体如下:


    改版后内容页:头部
    文章布局:底部改版
    改版前

    改版时,将点赞按钮提出来,放到底部中央,方便用户反馈。左下角是阅读点赞和评论数,点赞或者评论后这里的数据动态改变。右下角是分享功能,鼠标放到对于图标上面出现二维码,引导用户扫描。


    改版后

    评论区同样对信息做了整合梳理,并增加了点赞功能。

    原型预览样式改版

    目前,墨刀原型是被嵌入文章中的,但在预览的时候经常会出现由于屏幕太小,导致墨刀原型显示不全的情况。



    为了解决这样的问题,做出如下改变:
    当用户点击播放按钮时,出现全屏遮罩层。遮罩层上显示具体的原型。
    如果是手机原型,让手机原型的高度和屏幕高度保持一致。如果是web原型,让web原型的宽度为屏幕宽度的80%。右上角固定一个关闭图标,点击可退出预览模式。


    改版后原型预览模式
    墨刀网站底部导航

    这里有两个小问题。
    一是将我在改版顶部导航时去掉的中英文切换放到这里。
    二是,改变微信、QQ二维码出现的方式。目前二维码的出现会导致整个网页被撑高,多出来一块空白无效区域,影响用户体验。因此更改二维码出现的位置为对应图标的正上方。
    其实可以看到,这里的很多功能是重复的,而且放到底部,用户使用的频率也不高,因此我这里做出了一个简化的版本,只保留必要内容。如下图所示:


    登录后顶部导航改版

    登录墨刀后,会进入工作区。此时墨刀的版式是这样的:


    Paste_Image.png

    但是,在某些情况下,墨刀会默认你登录了但是没有进入工作区,于是会显示出下面的样式,你需要点击“进入工作区”才能进入。非工作区的样式和未登录时的样式基本一致。



    这里存在的问题有:
    1,登录后的工作区和非工作区不能互相切换。可以进入工作区,但是在工作区,没有退出工作区的功能。因此如果用户需要在非工作区操作,就不清楚到底该如何退出工作区,只能选择退出登录。

    2,工作区没有博客功能(当然这个在前面的讨论中被我删掉了),下载应用的功能也被隐藏的很深。需要先切换到讨论区,然后滚动到页面底部,才有下载入口。对于墨刀用户来说,下载功能并不是一个用完一次就不会再用到的功能,下载了电脑端之后,也许用户还有下载手机端和插件的需求,因此这算是一个比较重要的功能。隐藏层级过深会给用户带来困扰。
    因此这里,我的改进方法是:
    1,去掉非工作区的登录后样式。因为非工作区的内容工作区都有,因此这样非工作区存在的意义并不大。
    2,在工作区右上角弹出菜单中“功能更新”替换成“下载应用”,点击后跳转到下载应用的界面。
    (此处没有大的变动,就不放图了)
    登录后讨论区,入门教程,底部导航版块改动和上文中相关内容一致。

    总结

    以上是基于我对墨刀半个月的学习和使用,对墨刀官网,尤其是“讨论区”版块的一些改进想法。
    其实墨刀这款软件是比较好用的,但对比墨刀软件和墨刀其他附加功能,让我不敢相信这是一个团队做出来的产品。
    感觉墨刀对自己的社区和内容还是非常重视,无论是讨论区还是官方博客,都布局颇大。但是也许是大量人力投入到软件本身,导致这里的功能设计很不细致,又或许是在内容方面没有合适的人负责,导致整个讨论区的内容给我一种杂乱无章的感觉。
    墨刀对于这里的运营也断断续续,比如之前我很看好的原型精选版块,好像只做了一期就没了。比如最近的新版上线,墨刀的功能更新版块竟然完全没有动静!
    在我看来,一个不好用的功能比没有这个功能更减分。如果暂时没有精力,是不是可以考虑精简一些呢?

    附上改造过后的墨刀官网低保真原型:https://v3.modao.cc/app/XyHE0eb9caEWjLC5yDWSyvaT6G9zD1t

    相关文章

      网友评论

        本文标题:如果我是PM|改造墨刀官网

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