Inbox分栏式设计的思考

无论是网页端,还是app端,还是其他产品形态,我们都尝试在有限的页面空间上尽可能并且简洁的增加页面的内容容量。但当我们真正开始去设计产品的时候,就要开始考虑这种设计是否符合用户场景,这种设计的交互在这种用户场景下是否是最佳的。往单个页面里增加内容,最简单的做法就是两栏式设计,左侧菜单栏,右侧展示内容。

像收件箱这样子的分栏式设计,在哪种用户场景下更适用?


inbox.jpg

如上图就是传统的收件箱的设计,主体内容模块使用的是两竖栏设计。

从用户场景来说起。在用户收取邮件这个场景下,用户收取到的邮件是有状态区分的。比如未读与有读。在内容有各类型的状态区分的情况下。来看一下传统收件箱设计下用户的操作轨迹。用户点击收件箱后,右侧页面跳出内容列表。在内容列表的上方有状态的区分,点击不同的状态展示不一样的内容。点击某个标题,邮件详细内容页面覆盖右侧的列表页。

这里为什么把内容状态选取按钮放到第二栏?直接放到收件箱的第二级,操作不是更扁平吗?因为在这个用户场景下,红旗邮件、代办邮件的对于用户来说优先级更高。而且与收件箱同级的菜单内容也很多,所以收件箱这里把其他的较为次级的状态放到第二栏。减小左侧的菜单内容,就能增加需要用户关注的内容模块的点击率。毕竟收件箱对于公司来说不仅仅只是收件箱,他需要提供的内容来帮助公司获益,所以新闻中心,文件中心这些额外的、跟收件不相关的才入放到菜单模块。这是从收益上对于产品的考虑。用户场景和收益是做产品时需要平衡的。

但传统的收件箱哪里做得还不好?我觉得是用户回复邮件的操作非常不扁平。从上文的用户的操作轨迹的分析,就可以看到传统的收件箱点击标题弹出的内容会覆盖原先的列表页。如果用户一天在工作当中有很多邮件要回复,那这个用户就必须在回复邮件后再倒退到原先的列表页,再次继续原先的操作流程。这样子的操作就非常不扁平,就非常不便捷。

为了让用户回复邮件场景的操作更加极致,我觉得如此设计是最好的。

u手绘图.jpg

三栏式的设计,把列表页作为一个单独的模块,最右侧的第三栏作为内容回复区。这样子,用户处于回复邮件的场景时,操作就非常便利了。不用再重复点击再后退再点击的蛋疼过程,只有在第二栏的列表页轻轻点击,右侧就能够展示出回复的页面。这酸爽,真任性。

如果想更全的展示内容,还可以提供任意拉伸的功能,用户可以把左侧菜单缩小面积等等。

再来想想三栏式设计在满足简洁的页面效果的同时,还能够做什么?

比如突出主要功能。

简书分栏.jpg

那双栏式设计有什么优点,在哪种场景比较适合使用?

我觉得双栏式设计比较适合于操作简单的用户场景,用户在左侧点击,右侧直接出现要展现的内容。双栏式设计的优点就是突出主要展示的内容。

而三栏式设计可以满足一种平衡,当操作较多时,三栏式设计能够较好的平衡操作的扁平问题和内容的展现。

关于分栏式设计可应用的场景应该还有很多。分栏式设计是互联网和移动互联网产品当中基本元素。值得我们思考的东西还有很多,只能一步步来,随着体验的产品增多,不断总结,才会逐渐构建起自己的方法论。

PS:允许非商业性转载,转载请注明出处,谢谢.

=================================

这里只求真,没有真理。

个人独立博客:PMFuner.com

微信公众号:PM范儿

记录一个不惧撞南墙的野路子产品经理的故事.

期待分享和交流~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 195,898评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,401评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 143,058评论 0 325
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,539评论 1 267
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,382评论 5 358
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,319评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,706评论 3 386
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,370评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,664评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,715评论 2 312
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,476评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,326评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,730评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,003评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,275评论 1 251
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,683评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,877评论 2 335

推荐阅读更多精彩内容