请选择 进入手机版 | 继续访问电脑版

产品设计

    今日:288| 主题:18241
收藏本版 (1)
软件产品、PC、移动、网站、平台的开发、策划等内容。

[其他] iMark vs Annotable,最强图片标记工具之间的对决

[复制链接]
人干事 发表于 2016-12-2 07:32:05
251 0

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
今年五月,墨客的开发者推出了Annotable,打破了图片标注 app 多而不精的局面,一度成为了名副其实的 「 终极图片标注工具 」。
   现在,Clover 四叶草推出了一款全新的图片标注应用: iMark 。你可能没有听说过这家开发商,但你很大概率上一定用过他家出品的 app。从 iOS 上的老牌应用Days Matter,到今年的天气新秀 我的天气,都出自于 Clover 四叶草之手。成立六年之际,凭借着一款又一款 iOS 平台上实用、精美的小工具,Clover 已经拥有了五千万用户。
  这一次推出的 iMark,虽然才刚刚发布,但继承了 Clover 系列应用一贯的品质,在功能和设计之间找到了一个巧妙的平衡点,并针对图片标注这个需求,结合了不少实际的应用场景,做出了一些功能上的创新。
  iMark vs Annotable,谁是你的菜

  同样作为图片标注类工具,要介绍 iMark,肯定绕不过今年一推出便广受国内外好评的 Annotable。要实际对比这两款应用,让我们从功能性、交互易用性和价格这三个方面来做一番对比。
  不过,需要注意的是,考虑到 iMark 才刚刚推出,Annotable 也不过才迭代了几个版本,两者都还有不少改进的空间,在这个时间点上,很难说已经能分出任何胜负。这次对比,更像是两位成绩优异者,现在有了旗鼓相当的竞争者,给了双方更多的动力去超越现在的自己。
   考虑到 Annotable 已经推出一段时间,且少数派做过详细的介绍,本文在一些细节上的笔墨,将更倾向于刚刚上架的 iMark,也建议你可以把两个 app 都下载回来,对着文章实际把玩一番。
  功能:iMark 胜在特色,Annotable 胜在细节

  iMark 和 Annotable 两者都能够完全胜任基本的图片标注上。不要小看这一点,在这两者之前,图片标注类 app 多而不精,每款都有些自己的特色功能,如放大镜、文字高亮等等,却没有一款 app 集众家之所长。
  基础功能:各有千秋

  稍早几个月推出的 Annotable,让「终极图片标注工具」不仅仅是一个口号,它汇聚了图片标注中所有必不可少的工具,终于让图片标注这件事情,一个 app 就够了。这次的 iMark,在基础功能上虽然有部分缺失,但作为第一个版本,总的来说已经非常丰富了。
  如果我们比较一下目前两者提供的基础标注工具,可以看到:
   

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
  iMark 在基础工具上,相比于 Annotable,缺少了「文字高亮」和图片局部「高亮」这两个功能,并且不支持画直线。所以,如果你想实现如下图中所示的图片标注效果,目前还只能使用 Annotable 来完成。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
        但是,iMark 在一些基础工具上,也提供了更丰富的样式和选择,像箭头便提供了五种不同的形式,箭头中间的线段部分还可以直接添加文字 (左图) 。同时,文字工具也额外支持加上黑底或白底的透明阴影,使得文字在图片上的展现更为美观 (右图) 。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
        除此之外,iMark 在对元素的属性控制上,也更加精细。相比于 Annotable (左图) 只提供了默认几种固定的颜色、笔触粗细,iMark (右图) 则还可以添加自定义颜色,滑块调节笔触粗细,并可以控制是否带有阴影。与此同时,为了实现和 Annotable 一样的所见即所得,iMark 在修改元素属性时,屏幕中央还会出现实时的预览效果。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
       Annotable:胜在细节

  而在一些操作细节上,最新版本的 Annotable 引入了两个新的特性,还是非常实用的:透视和标注贴边。
   前者当你在图片上标注时,常常手会遮挡图片的内容,这时候只要保持手指半秒钟不动,Annotable 会将手指下的内容,以放大镜的形式悬浮展示,有助于精准标注 (左图) 。而自动贴边特性,则是为了解决这样一个痛点:有时候想标注图片边缘角落上的内容,由于手机屏幕边缘的触摸问题,在画矩形框时不能完全贴边,Annotable 会自动帮你贴边 (右图) 。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
       不过,在功能细节上,iMark 也有一个非常贴心的创新:支持标注图层的管理。当你在图片上打得标记非常多时,常常会有彼此之间覆盖的情况,这时候想要拖拉位置、改变上下关系时,往往操作并不方便。iMark 引入了类似 Photoshop 中的图层管理,你可以直观地改变图层中各个元素的上下层级,很方便地做出类似弹幕的效果。另外,还可以在这里对图层进行单个或批量全部删除的操作。
   

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
  
  iMark:基于场景的特色功能

  iMark 基于常用的图片标注场景,设计了一些有特色的功能:网页标注、地图标注以及空白标注。
  在我们实际使用图片标注工具的场景中,经常是需要给对方截屏网页,标明网页上的重点信息;或者是传达地理位置,标明路线等等。以往,我们不得不先打开 Safari 或地图 app,截图后再回到图片标注工具中,多少有些麻烦。现在,你可以在 iMark 中直接完成。
  
       
  • 网页标注: 在 iMark 中直接输入网址访问,可以选择截图当前可前区域,或整个网页,然后开始标注截图;   
  • 地图标注: iMark 可以自动定位你当前的地址,或者也支持手动输入地名搜索,截图后,可以方便地在图片上用箭头标示路线,圈出关键位置等;   
  • 空白标注: iMark 相当于变身为一个画板,提供了四种规格的空白页面比例,你可以直接在这里涂鸦;  
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
       总的来说,Annotable 在细节之处,经过几个版本的迭代,已经更加完善。同时还提供了文字高亮和区域高亮这两个标注工具,也非常有用。iMark 则在标注这件事情上,基于场景进行了更多思考,提供了一些差异化的特色功能,让人眼前一亮。
  交互:iMark 更易上手,Annotable 更清爽

  在对比了 iMark 和 Annotable 的功能之后,另一个不可忽视的差异,就是两者的交互设计。
  在使用过程中,你可以发现两者有着迥然不同的设计理念:iMark 更关注易用性和降低上手难度,而 Annotable 则希望保持以图片为主体的清爽界面,尽可能地弱化了工具等界面元素的存在感。
  每一个设计选择,都是理念的现实投射

  这种差异有三处最明显的体现:1)两者选择标注工具方式的不同;2)两者在应用层级结构上的不同;3)导出图片的方式不同;
  1)两者选择标注工具方式的不同

   先来说说最常用的标注工具的选择。iMark (左图) 分为了三层结构:工具 - 样式 - 属性设置,通过底部 Tab 栏的形式,一级一级地堆叠起来。换言之,你随时可以看到所有可用的标注工具和样式。
   而 Annotable (右图) 则和之前印象笔记出品的圈点很像,它基本上将 iMark 中的工具和样式合并为一个区域,放在右上角,而属性设置则放在左下角,两者之间的层级关系,并不像 iMark 那么直观。Annotable 默认只展示当前正在使用的工具和属性设置,尽可能多地留出区域来展示图片。但相对应的,如果你需要切换不同的标注工具,需要额外点开左下角或右下角切换,增加了操作的繁琐程度。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
       2)两者在应用层级结构上的不同
  除了标注工具的展示和交互方式不同外,iMark 和 Annotable 两者在整个应用的层级结构也有着很大的一个区别。iMark 为了易用性,并没有将选图与标注图片分为两个界面。最下方工具栏的第一个图标,就是可供标注的图库,或相机的入口。Annotable 则为了保证以图片为主体的设计理念,尽可能地隐藏界面多余元素,将选图和标注图片分为了前后两个界面。进入应用后,仿佛就打开了手机相册,你必须选完一张图或拍照,然后才会跳转进入标注的界面。
  3)导出图片的方式不同

   在导出图片这件事上,你也可以看到 iMark 针对易用性做了更多的优化。在 Annotable (左图) 中,导出图片是直接点出右上角,会调用系统的 Action Sheet。而 iMark (右图) 则在导出图片这一步,切换到了单独的一个新界面。这时候不需要你额外进行任何操作,iMark 已经自动将当前标注的图片保存到了相册,并在这个界面上,还提供了快速分享到各个社交平台的按钮,你也可以点击「更多」,来调出系统级的 Action Sheet。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
       另外,相信你也看到了,iMark 还额外提供了两个小功能:尺寸和边框。在尺寸中,你可以选择导出图片的质量、尺寸,甚至可以自定义画布大小。而边框则提供了三种样式,你也可以理解为给图片加上水印的一种方式。
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
         

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
       没有绝对的完美

  不过,两者目前的设计,也都存在着一些值得改进的地方。iMark 在 iPhone Plus 这样 5.5 寸的机型上,可以一次性将底栏所有的工具全部露出,但屏幕再小一些,则需要左右滑动来选择工具。
  而 Annotable 的问题则在于有一部分设计过于强调了最小化理念。比如每次切换标注工具,被选中的工具会从可选项中消失,导致整个列表项好像一直在变动,让人感到困惑。切换同类型工具的不同样式,也需要额外操作,尽管新版本中在设置选项中允许显示所有工具,但却又走入了另一个极端:暴露了许多选项,同样让人感到无所适从。
   

iMark vs Annotable,最强图片标记工具之间的对决

iMark vs Annotable,最强图片标记工具之间的对决
  
  两者交互方式的不同,本质上是其设计理念和追求目标的不同。iMark 通过减少界面跳转、露出各种操作元素,尽可能减少操作步骤等措施来降低上手难度,在易用性方面有更好的体验,但界面显得相对复杂了。Annotable 则为了保证在图片标注过程中沉浸式的体验,在保持整洁的同时,还是牺牲了一部分便捷性的。
  价格:iMark 完全免费,Annotable 内购解锁

  谈到价格,iMark 和 Annotable 之间的差异,比交互理念还要大。
  Annotable 中,基础功能是免费的,而高级功能则需要付费解锁。那么哪些是高级功能呢?包括放大镜、区域高亮、文字高亮、涂抹效果、更多马赛克效果、更多颜色,分别需要 12 元解锁内购。或者你也可以选择一次性支付 68 元,解锁所有高级功能。高级功能并非完全不可用,Annotable 提供了免费试用,你完全可以在图片上使用各类高级功能,只不过需要解锁购买后,才能够保存图片。
  iMark 则没有这么复杂,它是完全免费的。唯一存在的内购,是你自愿捐赠开发者,但捐赠与否,对你使用的功能,毫无影响。
  再次注意,定价的不同,本质上是两者商业模式的不同。Clover 四叶草本质上是一家媒体公司,这些小公司其实是品牌和引流的入口,本身不需要靠 iMark 来直接盈利。而 Annotable 是独立开发者的作品,它的盈利模式就是 app 的高级功能内购。
  当然,iMark 的完全免费,除了吸引更多的用户群体之外,势必还是会对 Annotable 造成一定的影响。但是,app 的定价只是影响因素之一,决定工具类应用的价值,还是要看它对我们生产力效率的提升,最后依旧需要靠品质胜出。
  未来的计划:Annotable 的专注,与 iMark 的拥抱需求

  在谈到 app 本身的定位和未来的发展计划时,Annotable 和 iMark 也有一些明显的区别。
   Annotable 的开发者  an00na   对 Annotable 有很清晰的界定:
  Annotable 是一款图片标标注工具。它是的用途是让图片上的某些东西更明显或隐晦。
   因此,早在 Annotable 推出之际,我们在评测中便提到过, Annotable 不会提供图片美化、长图拼接、截图管理、表情贴纸这些事情。几个版本的迭代,Annotable 都是专注于将图片标注这件事情做到极致,因此才有了上文中提到的自动贴边和透视功能。
  而 iMark 的态度则开放得多,本质上来说,他们想打造一款受用户喜爱的标注工具,这意味着,只要有这个需求的用户足够多,都可以进入到 iMark 的计划中。据开发者透露,接下来 iMark 还会推出边框、拼图,甚至图片外标注的专业功能。
  总的来说,无论是 Annotable 还是刚刚推出的 iMark,都是非常优秀的图片标注工具。我们也期待接下来的日子里,两者能提供更多差异化的特色功能,把图片标注这件事情,做得更加极致。
   你可以根据自己的需求和个人爱好,选择下载 Annotable 或者 iMark 。



上一篇:6 objects of web design wonder this December
下一篇:移动应用设计的最佳实践
*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读

扫码访问 @iTTTTT瑞翔 的微博
回页顶回复上一篇下一篇回列表
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )

© 2001-2017 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表