Goodpatchのデザイナーが仕事で使っているデスクトップアプリ・Webサービスまとめ

みなさんはお仕事をされているときに、どのようなツールを用いて作業をしているでしょうか。

何かいいものがないかと探している方、まず何を使ったらいいのかわからないという方など、様々な方がいるかと思います。

先日Goodpatchのメンバーページ(⇒ABOUT)ができたので、今回は、Goodpatchのデザイナーに仕事でどのようなツールやアプリを使っているのか、またなぜ使っているかという理由を聞いてみました。

これらがみなさんの参考になれば嬉しいです！

UIデザイナー(小林幸弘さん)

コバさんは、新しいツールやサービスが出たときにはとりあえず新規登録してみて、インタラクションであったり、見た目であったりを確認するようにしているそうです。その中でUIが細かいところまで考えられているものや、個人的に好きな見た目だったら使い続けるのだとか。

4コマノート、Notepod

アプリ、スマートフォンサイトのデザインをする前に、イメージを可視化させるために使っている手書きツール。1つ目は無印で販売されていた4コマノート。UIの動きのイメージを練るのに使いやすいのが特徴なのだそう。もう1つは、オーストラリア製のNotepod。iPhone4の形・サイズそのままのメモ帳で、方眼が入っていることもあって、レイアウトやラフスケッチに重宝しているそうです。

残念ながら両方とも同じ形のものは販売終了になってしまいましたが、4コマノートの類似品は同じ無印より再販されています。リンクはこちら 。

xScope

MacでiPhoneやiPadの画面をつくっているときに、その画面が実機においてどのように表示されるのかを確認するために使っているアプリ。MacアプリのxScopeとiOSアプリのxScope Mirrorと同期させることで、つくっている画面をiOSデバイスの画面にそのまま映すことができます。このアプリによって、書き出した画像をメールやDropboxなどに転送して確認する手間が省けたそうです。

Frank DeLoupe

メニューバーに常駐するカラーピッカーアプリ。画面に表示されている色をピックすると、Photoshopのカラーパネルにその色が反映される連携機能が便利なため、使っているそうです。

LittleSnapper

https://www.macupdate.com/app/mac/29991/littlesnapper

参考になるデザインやサイトを、ひたすら保存することができるキャプチャアプリ。コバさんは日課として参考になりそうなデザインを収集するために使っているそうです。現在は開発が終了していますが、LittleSnapperを制作したRealmac Software社が「Ember」(下記にて紹介)というアプリを新しくリリースしています。

LittleSnapperのアプリ内ブラウザーの中で開いているWebサイトなら、画像などの素材をキャプチャして保存することができます。そしてアプリ内ブラウザーで部分保存すると、サイトのURLを残してくれることがよく使っている理由だそうです。

ディレクター／デザイナー／フロントエンドエンジニア(樋口剛さん)

樋口さんの場合、多くのアプリやツールを使うというよりは、必要最小限のアプリとAdobe IllustratorやPhotoshop があれば、ほとんどが事足りているのだそうです。

Brackets

http://brackets.io/

Adobeがオープンソースで公開しているテキストエディター。直感的で軽くシンプルな操作ができることと、編集中のHTMLファイルを保存するとLive Previewできることが使っている理由だそうです。また作業中のファイルリストが保存できることで、何を作業していたかわかることもポイントだとか。

QuickSilver

http://qsapp.com/

アプリケーション、コンタクト、ミュージックなどを横断的に探すことができるランチャーアプリ。動作が早く、記憶が曖昧でもキーワードや関連事項から探してくれます。このアプリを使っている理由は、OS10.2くらいからあり今でも使い勝手が良いため、使っているのだそうです。

フロントエンドデザイナー(笹山健志さん)

ササさんは新しいものを触ってみたりしますが、「自分にとって使いやすく馴染むかどうか」を大事にしていているそうです。

Coda 2

コーディングに使うエディター。これを使っている理由は3つあるそう。1つ目はエディターとしての機能や、サイト管理、検索など、業務で不満なく使えるレベルで備わっていて、Dreamweaverに引けを取っていないから。2つ目は、画面分割できてHTMLとCSSなどの複数ファイルを同時に開きながらの作業がしやすいから。3つ目は、Coda 2のアイコンが自分好みだからなのだそうです。

Espresso

http://macrabbit.com/espresso/

これもコーディングに使うテキストエディター。Espresso 2.0からCSSEditという別アプリだったものが統合されたことで、主にCSSエディターの機能を使っているそう。ナビゲーションバーでclassやidなどをグルーピングできるなど、CSSの管理がしやすいことがポイントだそうです。

Chrome Canary

https://www.google.com/intl/en/chrome/browser/canary.html

Googleが提供している、開発者や新機能に興味のある人向けのブラウザー。ほぼ毎日アップデートしており、常に新しい新機能を試すことができます。開発用のツールを含めた新機能が充実しているために、開発のときに使っているそうです。

インタラクションデザイナー(松本慶一郎さん)

松本さんは不満に感じていることや問題を解決してくれそうなもの、面白そうなものがあれば積極的に試してみるのだそうです。

Ember

前述の「LittleSnapper」の後継となるデジタルスクラップブック。Dribbble や Fubiz など、気になるサイトのRSSを登録しておくと、画像を集めてきてくれます。気に入ったものをすぐに保存できたり、自動的にカテゴリー分けしてくれたりするところがいいのだそうです。できるだけたくさんのものを見てからいったん忘れて、あとでふと思い出したときなどに見返す習慣にマッチしているため気に入っているのだとか。

Dash

80以上のプログラム言語やフレームワークなどのドキュメントをオフラインで高速に検索できるアプリ。エディターとの連携ができるため、調べたい項目にたどり着くまでのステップ数の少なさが気に入っているそう。要素が何を意味しているのかなど、わからないことがあったときに随時使うそうです。

Kippt

https://kippt.com/

自分のお気に入りのサイトや記事をブックマークできるWebサービス。気になる人のブックマークをフォローすることもできます。日々たくさんのサイトを見てブックマークに保存しておいたサイトの中で、心に残っているものを時々見返すためのツールとして使っているんだそう。

Iceber.gs

https://iceber.gs/site

Emberと機能が似ているWebサービス。こちらは画像だけでなく、気に入ったテキストも保存することができます。そのため、サイトの中で文章の一部分を残しておきたいときに使っているそうです。

気に入ったフレーズなどの一部分を保存する場合はIceber.gsに、記事丸ごとの場合はPocketに、サイト丸ごとはKippt、画像だったらEmber、という使い分けをしているそうです。

 

以上です！

今回聞いたデザイナーさんのなかでも、新しいもの・いいもののがあったら使ってみる方や、できるだけ馴染んだものを使いつづけたり、必要最小限のものを使うなど、それぞれ自分なりの考え方を持ってツールを選んでいるようでした。

自分はどういうことを求めてツールやサービスを使うのか。それを今一度、振り返って考えてみるのもいいかもしれません。