奇妙清单 Mac 版重设计

在 Behance 上查看设计细节

作为奇妙清单的深度用户,这款曾经拿下苹果 2013 年度评选最佳的 App 帮我提高了不少效率。我用奇妙清单来记录我的生活灵感、购物清单,管理我的工作项目。不仅在手机上,在 Mac 上我也经常使用奇妙清单,它的自动同步功能很方便。

相比手机,Mac 拥有更大的屏幕和不一样的交互方式。而我想让奇妙清单 Mac 版变得更棒,原因是 Mac 作为生产力工具,奇妙清单能在上面做得更多。如果一个用户在 Mac 上使用奇妙清单的频率很高,我想他一定会用奇妙清单来管理自己工作项目,并与别人交流得更频繁。

我希望奇妙清单 Mac 版能够:

• 充分利用 Mac 的显示空间和交互习惯。

• 更方便地对任务进行交流、管理。

• 回顾已完成的任务,令我能快速整理出工作周报。

基于上面的几点想法,我开始了奇妙清单 Mac 版重设计的构思。


更简洁清晰的外观

奇妙清单提供了不少精美的壁纸让用户选择,在手机上,这些个性化的背景确实能令应用添色不少。而在 Mac 上,我们往往已经设有桌面壁纸,或许是风景照、或许是一张跑车照片,但奇妙清单的个性化背景,这时候看上去并不和谐。

改进前后的 Minified View 对比

因此,我首先把壁纸的概念去掉,改为 Yosemite 中更为常见的毛玻璃效果,意在帮助用户更专注于清单内容,注意力不会被壁纸分散。而任务的基本样式被保留下来,使用户不会在手机和 Mac 的切换中感到错愕。

由于显示空间受限,在 Minified Mode 中并不能将清单列表展示出来,旧有的奇妙清单 Mac 版直接沿用了 Mac 传统的菜单进行切换——点击清单名、清单列表被显示出来、点击切换到另一个清单——将手机上点选的交互方式移植到 Mac 上太直白了。

改进后的 Minified View 当鼠标悬停在左上方,项目界面下移,显示出清单列表与操作

滑动鼠标是 Mac 上更自然的交互习惯,在显示这些隐藏内容时,我打算通过鼠标悬停的形式实现——当鼠标移动到 Minified Mode 左上方的区域,清单列表就会被展示出来。同时,原先下方四个功能按钮的使用频率并不高,因此也被隐藏到了此处。

Minified View 总览

通过对界面背景的修改、元素的重新整理等,我希望这个重设计在外观上就先能引导到一个新的方向——它更专注于内容、没有多余的元素影响眼球,并且在获取信息上更高效。

但我认为,这与奇妙清单一贯的个性化风格是不冲突的。通过对界面颜色的选择,用户依然可以设置出个性化的界面。

个性化界面颜色选择


重新思考信息的展示

奇妙清单的内容可以分为三个层级——清单 > 任务 > 任务详情,每条清单中包含了多个任务,每个任务中又可以添加子任务、笔记、评论、附件等。由于交互方式和使用场景的差异,在手机上我们更关注于前两项——清单和任务——手机生产力的限制也只让我们方便地处理这两项。而在 Mac 上不同,我们能够快速地输入内容、处理信息、添加各种类型的附件,所以这时候我们更关注于后两项——任务和任务详情。

奇妙清单的内容层级

因此,能够快速地在列表间切换显得并不重要,在 Mac 上高频使用奇妙清单的用户想必关注于任务、子任务、评论等。

Normal View 效果图

此外,在使用中我发现,奇妙清单拥有很多贴心的小功能,比如以电子邮件发送清单、打印清单、快速设置到期日为今天或明天等,但这些功能的入口存在重复并层级错乱的问题。如果我想将一个任务以电子邮件发送给我的朋友,我原先可以有两个方法实现:1、选中这个任务,在清单功能中的「更多」菜单里选择「邮件发送该项目」;2、用鼠标右键对任务单击,在显示出来的菜单中找到「邮件发送该项目」。

改进前的功能操作

一方面,「更多」原本属于清单下的功能、对清单进行操作,而出现了其它层级的功能会让人困扰;另一方面,功能的重复和堆叠会增加用户在操作时需要考虑的时间

我重新梳理了功能的逻辑:

改进前的功能逻辑


改进后的功能逻辑

从右键单击展开出来的菜单中找到想要的功能变得更清晰,使用频率较低的功能用右键单击实现、使用频率较高的功能则直接显示出来。这有利进一步提高奇妙清单的工作效率。

改进后的功能操作


进一步提高工作效率

上文提到,为使用户在 Normal View 能更专注于任务和任务详情,进一步弱化了清单列表,让清单列表以标签的形式展现。这样做更重要的原因,是改进原有的奇妙清单 Mac 版在不同窗口大小时的显示模式问题。

Normal View 切换清单操作演示

原有的奇妙清单 Mac 版拥有 Minified View、Collapsed View、Normal View 三种显示模式,随着窗口大小变化而变化,也可以通过「Command+1/2/3」的快捷组合键切换。不知道大家会不会像我一样感觉三种显示模式显得多余,Minified View、Collapsed View 的差别很少,仅是在显示任务详情时,前者不能直接选择任务而后者可以罢了。

改进前的三种显示模式

由于遵循手机客户端的原则,原有的奇妙清单 Mac 版依旧把「任务」作为重心,导致不显示任务详情时任务卡片的宽度占满应用,空白的部分很大。但我们知道,任务的名称是有限的,而任务详情中的子任务、笔记、评论、附件拓展性更高

在 Collapsed View 显示任务详情时可以直接选择任务,而 Minified View 不行,这是两者的唯一差别

因此我认为,在奇妙清单 Mac 版中应该以任务详情为重心,任务卡片的宽度是固定的,由任务详情框去适应窗口大小,这样更有利于任务详情的展示。并且,原有的三种显示模式也顺应精简为两种,去掉中间的 Collapsed View。

改进后的两种显示模式

此外还有一个容易被忽略却能发挥不少作用的功能点——回顾已完成的任务。对于办公人士,回顾已完成的任务是时常需要做的事情。虽然奇妙清单一直有这样的功能,但仅限于对已完成的任务隐藏和展示,并没有应用于实际场景。

奇妙清单其实是一个非常好的任务载体,我们未完成的、已完成的任务都会记录在这里。如果能够对已完成的任务进行整理、筛选,其实已经能够满足一个很常见的场景——整理工作日报或周报——通过翻阅已完成任务我们就可以方便地回顾这周或指定某一天所完成的任务清单。

回顾已完成的任务

Click here to see the English version.)

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

推荐阅读更多精彩内容