骑猪兜风

从一到五:一个Mac OS X应用从概念到上线的全过程

骑猪兜风 2015-12-04 16:29:16    200932 次浏览

从一到五:一个Mac OS X应用从概念到上线的全过程

  美丽的 Flume 应用开发者的故事,期望能给正在开发 Mac 应用的大家带来帮助

  在 iOSUp,我们总是喜欢深度挖掘网站和应用开发背后的故事。它们如何被提出,如何开始,如何完成,以及上述过程中的所有故事。在设计中,哪怕是最微小的细节,也会有着不为人知的故事,我们要发掘出这一切。因此,我们采访了开发了 Flume(一个优秀的 Mac 应用)的两位小伙。Flume 能在桌面上使用 Instagram 的功能。

  简介

  Rafif Yalda 和 Peter Amende 在柏林开发了 Flume。

从一到五:一个Mac OS X应用从概念到上线的全过程

  Rafif 有点像一个世界公民,充满好奇心(问题:究竟是好奇心让他环游了世界,还是环游世界让他变得好奇呢?)。他来自伊拉克。他环游过世界。他还是一位先驱。「我一直对计算机感兴趣,」他说,「我曾经为杂志写过程序,那个时候我也不过六七岁吧。我在 1995 年第一次接触网络之后,它就一直吸引着我。我最终取得了软件工程学位,从此之后成为一名专业的程序员。」最好的学习场所?「能接触到成功产品的创造过程,即使是一个小团队,有时只有我和一个设计师。」

从一到五:一个Mac OS X应用从概念到上线的全过程

  Peter 是一位高级产品设计师,来自德国。他曾有过一段有趣的旅行,向我们证明了机智的人不一定只有企业家。「我在德国的时候,尝试在任何地方学习视觉设计,但都被拒绝了。自学了建站之后,我身无分文的去了柏林。我依旧想要学习,不过还是找了一份工作作为起步,几年内换了好几份工作,也做了很多的项目。在这之后,我已经可以掌握整个项目从开发到完成的整个过程,但我现在只做有趣的项目。」

  接下来,让我们探索 Peter 和 Rafif 创造 Flume 背后的故事。

  1. 创意

  iOSUp:你在 Instagram 上发了很多美丽的照片。你是怎么想到开发 Flume 的呢?那个时候有可供替代的产品吗?

  Rafif:谢谢!开发 Flume 其实经历了很长时间,第一次提出这个想法可能是在 2013 年年中吧。我旅行过很多地方。在旅行的时候,我每天都会拍很多照片上传到 Instagram 上,回复照片的评论,然后寻找新的目的地。当我回来工作的时候(坐在桌子前),我发现我不得不切换到手机来更新 Instagram 上的状态,这让我觉得无比麻烦。当时有一个软件叫做「iPhoto for Instagram」可以用,但是它的功能并不完善,你还是不得不把注意力从你手头的事情上转移开来关注一下 Instagram。

  除此之外,我在手机上用 VSCO Cam 编辑照片,他们的图片库视图非常棒。我用的另一个 Instagram 辅助软件,Carousel,让我有了开发一个好看的应用程序的想法,让人们专注于照片内容的本身,免受外界打扰。

  2. 浏览器插件

  iOSUp:不过,你首先做的是浏览器的插件——为什么你一开始开发了一个插件而不是直接开发一个应用程序呢?

  Rafif:在发布 Flume New Tab 这个插件的时候,Flume for Mac 其实已经完成了差不多 75%。出于市场的需要,在发布 Mac 版本之前要有必要的宣传,让人们知道我需要一些时间来完成这个应用程序。同时,也能测试人们对这个产品感兴趣的程度。为 Safari 开发标签插件是前无古人的(我不确定现在是否有了后来者),但这在 Chrome 是很常见的。因此,我把它看做一个挑战——我花了整整一个周末来尝试它能否成功。当我发现这可行的时候,我就搁置了 Mac 版本的开发,全力投入到插件的开发中去了。而将插件移植到 Chrome 只花了我四个小时!

从一到五:一个Mac OS X应用从概念到上线的全过程

随之而来的想法是,如果当你点击链接的时候已经安装了 Mac APP,这个插件会呼起它。这是在用户忘记软件时,让他们重新用起 APP 来的一个好点子。

  网站(和不久上线的订阅功能)和插件同时上线。我当时被用户的反映震惊了。一天之内,我们就收到了超过 2000 的订阅,被 The Next Web 推到首页,在 Product Hunt 上收到超过 400 的赞后登顶了。

  iOSUp:这一切都是你一个人完成的吗?你用过什么特殊的框架吗?

  Rafif:所有的编码工作都是由我完成的,当然也使用了很多第三方的开源代码,这些我都在软件的版权中申明了。当时 Swift 还没出现,所以我是用 Objective-C 写完这个程序的。我完成的第一个部分是 API 和数据库交流层。Paw 和 Base 帮了我很大忙。

从一到五:一个Mac OS X应用从概念到上线的全过程

  我当时(现在也是)还用了 TwUI framework。当时做一个导航层,和一个好看的下拉刷新界面真的很难。现在也还是,不过已经好多了。

  TwUI 已经很久没有维护过,我根据自己的需求为这个框架打了很多补丁。也许将来我会放弃它,重写很多内容,但是使用 TwUI 为加速当时的开发进度贡献很大,我不后悔用了它。

  iOSUp:这个程序是有一个后台功能,还是通过 OAuth 协议直接和 Instagram 直接通讯呢?

  Rafif:所以的通讯都是直接通过 Instagram 处理的,不过在登陆网站的时候,使用了 OAuth 协议的一个回调函数。

  3. Mac 程序开发

  iOSUp:这个有着好看界面又有着许多实用功能的软件已经在 Mac 应用商店上线了。你能说说,如何把一个有创意的想法成为现实的过程吗?

  Rafif:谢谢!我第一次提交 Flume 是在 2014 年 1 月 4 号。我用晚上和空余时间断断续续花了一整年来完成它。工作和旅行的时候,我觉得我没有给它足够的重视。2014 年底,我通过 SteamCloud 认识了 Phillip Brechler 和 Peter Amende。我是 SoundCloud 的重度用户,但是他们的网站实在是太慢了。我联系到了 Peter,后来我们就在一起设计了。

从一到五:一个Mac OS X应用从概念到上线的全过程

  我们一起改善原有的「模型」。他从那个时候开始处理设计,最终我们改良了它。在 Peter 加入之前,Flume 的设计只停留在我的脑子里,我从未把它们放到 Sketch 或者 Photoshop 中实现。Peter 来的正是时候,如我所说,实现了这些设计。

  我从来没有独立的完成过一个原型,不过在很早的时候,我用 HockeyApp 在我们之间发布 Beta 版本。一般来说,屏幕录像就能让他知道设计的 UI 元素看起来如何,或者我们讨论的功能怎么样。

我们远程处理了所有事情,我们无法当面讨论设计或者功能。Screeny,iMessage 和 Dropbox 给我们带来很多帮助。当然还有 Wunderlist.。

从一到五:一个Mac OS X应用从概念到上线的全过程

  早期,我说服 Peter 把他的设计从 PSD 换成 Sketch 文件,我很感谢他这么做了!这使得导出变得非常容易,所以我可以轻松的改变 Slice 的名字,使它和 Xcode 工程里一致。然后就可以通过 Dropbox 同步给 Peter。

  iOSUp:你是如何处理 Instagram 的 API 请求频率限制的呢?你对那些能够从 Mac 直接上传图片的的应用程序怎么看呢?你是不是添加了一些在 API 文档中没有的东西呢?

  Rafif:如果让我的服务器处理请求,确实能提供比 Instagram 更高的频率限制。但我不希望这成为任何用户的瓶颈,也不想去处理这带来的安全问题。

  Instagram 不希望第三方应用使用它的 API,限制的手法也也来越像 Twitter,尽量把第三方应用全部驱除。现在,任何第三方应用都不能点赞,评论或者关注,除非得到允许。很幸运,我在这些改变实施之前可以使用一个现在已经被去除的 API。

  iOSUp:你支持这个决定吗?或者说你尊重这个决定?

  Rafif:我不认为 Instagram 会开放上传权限,并且他们的理由也可以理解。

  Instagram 随时可以关闭我的 API 接口,这可能非常可怕。不过我认为 Flume 中已经有足够的代码能使用附加组件,并且支持更少的限制 API 的照片分享服务,比如 EyeEm 或者500px

  4. 图标设计从一到五:一个Mac OS X应用从概念到上线的全过程

  iOSUp:Peter,我们都知道你很擅长扁平化设计。你能告诉我们一些创造 Flume 图标过程中的故事吗?比如你用了什么工具?

  Peter:很高兴你了解了我的一些作品。这个图标使用 Photoshop 做的,我有一个轻松导出的模板。

  这个快速灵巧的模板能让我看到显示效果,并在应用中测试。这比 Photoshop/Sketch 可以提供的模拟效果好太多。

图片的颜色很明显是为了和 Instagram 协调,背景里的波浪暗示了 Flume 这个词的意思。同时也有流动的意思在里面。

从一到五:一个Mac OS X应用从概念到上线的全过程

  只有在美工的时候才会用到 Photoshop。去年最开始的时候,我用 Photoshop 设计了第一个界面,但后来换成了 Sketch。后来,我渐渐把所有的工作全部转移到了 Sketch 上。

  iOSUp:Apple 有图像设计的相关规范吗,比如扁平化设计?

  Peter:当然,Apple 的 OS X Human Interface Guidelines 非常好的介绍了设计应用程序的细节。

  但真正困难的是,你什么时候要打破束缚。

  Flume 被设计为一个圆形。它和 iTunes 或者 iBooks 一样是一个圆形,并有着银色的边界。

从一到五:一个Mac OS X应用从概念到上线的全过程

  对那些想要入门 OS X 图标设计的人来说,Ollin 的博客也很好的描述了图标之间的不同。

  iOSUp:你最喜欢的 Mac 应用图标是什么呢?

  Peter:嗯,我最喜欢的是 OpenEmu 的图标,是一个的游戏控制杆,是一个游戏仿真的开源程序。

从一到五:一个Mac OS X应用从概念到上线的全过程

  我想,没有什么标志能比以前学校里的红色游戏控制杆更好的表现这个应用了。

  同时,即使在 Finder 的小尺寸视图中,他也是一个与众不同的风格。我很喜欢这样。

   5.向 App Store 提交

  iOSUp:在 App Store 提交应用程序的过程是怎样的呢?和 Chrome 应用商店相比呢?

  Rafif:我不是第一次往 App Store 提交应用。所以我早就做好了准备,来接受缓慢审核的煎熬。同时,在 OS X 和沙盒模式的应用,你必须有充分的理由被授予永久的安全权限,比如读取用户的位置,摄像头,或者读写文件的权限等等。大多数时间这不是问题,如果你有充分清晰的权限要求的理由。不过这个程序被拒绝了两次,大概是因为我在应用名字和截图中使用了 Mac 这个词。最终花了我十二天的时间,我不得不两次推迟上线时间,简直令人抓狂。

  Chrome 网上商店就好多了,我想 Google Play 也是这样。现在有一个 Safari 插件评估团队,Flume 的新版插件已经等待了数周,也没有可见的进度。与此相反,我的更新在 Chrome Web Store 中 15 分钟内就上线了。

  我不得不特别提一下 iTunes Connect。这是用来上传和提交你的二进制文件和营销材料的。前几天它做了一个很大的变更,结果就是,我花了整整四天时间来不断上传所有内容!

往 iOS 和 Mac App Store 提交应用非常考验你的耐心——你不得不继续耐心等待,即使你已经在这个应用上花了整整两年!

从一到五:一个Mac OS X应用从概念到上线的全过程

  一些其他问题...

  iOSUp:你在开发应用的过程中遇到最烦和最开心的事情是什么呢?

  Rafif:我在 2014 年放弃了旅行来完成 Flume,我一个人在做,没有人反馈,没有人鼓励我。遇到 Peter 减轻了我很多负担,也让我有机会能够交流想法。

开发的过程很少有开心的事情,但上线绝对是最开心的事情。我很享受和支持者、测试版用户和公测用户交流。我很喜欢,当他们发现我在下一个测试版本中就加上了他们想要的功能时候,那种震惊的感觉!

  iOSUp:Mac 应用中你最喜欢的设计和应用方面的程序是什么?

  Rafif:好问题。我猜是 Dash。我是一个重度的快捷键用户(因此 Flume 中添加了所有的快捷键功能),Dash 也从没让我失望。我可以很轻松的打开它,通过关键词搜索我想要的信息,在几秒之内关掉它。整个过程不需要让我的手离开键盘!

从一到五:一个Mac OS X应用从概念到上线的全过程

  当然,还有 Alfred,我每天都用的另一个键盘友好应用。

  超爱 Alfred,我们也整天用它!

内容加载中