Sketch3ハジメマシタ

こんちわ、無職のt32kさんだよ。今日は職を失ってお金もないのでAdobe Creative Suiteに代わるソフトを探そうって話だ。そうゆうことで、いま世間を騒がしているSketch.appを触ってみたよ。

Sketchってどんなソフトかはこもりさんの紹介動画を見てみるとよい。ついでに、こもりさんが書いている『Sketch 3 Book for Beginner』電子書籍も買っておくとスタートダッシュが決めれると思う。

電子書籍ならではというか、Sketch.app自体の更新も速いので、電子書籍も随時アップデートされているし、説明動画もついているので分かりやすい。

そうゆうわけで、5/13にこけむさズで行われたSketch3勉強会にも行ってきた。勉強会は最初こもりさんからSketch.appの概要を説明してもらって、後半はこもりさんの画面操作を見ながら自分でも動かしてみるってスタイルだった。なにせ、Content-generator-sketch-pluginハンパない！

そうゆうわけで、やはりこれは来る！というSublime Textが出てきた頃のような感覚を得た。特に僕が気に入ったのは以下の2つの点だ。

  • Keynote.appっぽい
  • エコシステムができてる

Keynote.appっぽい

普段一番使用しているソフトといえばSublime Textだろうか。まぁテキストエディタは使うよね、ってことで次に使うソフトはプレゼンなどで重宝しているKeynote.app。プレゼンだけでなく簡単な企画書的なものを作成するのにも使っているので、このインターフェイスに僕は慣れている。

たいして、Sketch.appはどうだろう。UIはクリソツである。それもそのはずで、SKetch.appはQuartzであったりCocoaであったりMacの技術に強く依存しているので、Mac標準ソフトとUIが同じである。

Is Sketch available for Windows or Linux
Sketch relies on a lot of technology that is exclusive to OS X and the fact that no other OS provide a clear business model for software development, we’re not considering supporting it.

こんなこと言ってるくらいなのでWindows用とか当分出てこないよね。。。

まぁKeynote.appはあくまでプレゼンソフトなのでレイアウト機能が弱かったりするが、Sketch.appはそこを上手くカバーしている。Make Gridであったり、Show Layoutなどは欠かせない機能といえるだろう。SymbolとかShared Style、Shared Textみたいなスタイルが共有されるシステムも有していてすごく便利である。

世間的には、Illustratorの代替であったりFireworksの代替と表されるSketch.appであるが、個人的にはKeynote.appの延長線上だと認識するのが一番しっくりきている。

Fireworksは使ったことないから分かんないけど、やっぱりパスのコントロールとかは細かいとこでは現時点ではIllustoratorのほうが使いやすかったりする。けどもKeynote.appの延長だと考えれば上出来な結果と言える（お値段もほどほどだし）、さらにWebサイト制作に便利な機能も豊富だし満足している。最近のフラットデザインっぽいシンプルなデザインのサイト・アプリならSketch3の機能で十分まかなえるじゃないかな。

エコシステムができてる

足りない機能、IllustratorでできるのにSketch3でできないの？って機能はプラグインを探してみるといいだろう。

GitHubにいっぱいまとめてある（レジストリも最近できた！）。

ちなみにこもりさんお墨付きのプラグインリストは上記。プラグインだけじゃなくて、自分たちが作ったテンプレートであったりUIコンポーネントも投稿できるサイトがある。

オープンソースとまで言わないが、比較的安価なソフトなのでいろんな人が使って便利なものやクールなものを共有していて、エンジニアっぽい文化が好きだ。

こんなのもある（ショートカットバンバン使いこなしたい）。

あとは、SketchToolというコマンドラインからエクスポートできるツールがあって、これとかpsd.rbみたいにSketchファイルのデータを将来的に読み込めれるようになったら面白いよなーと勝手に妄想している。

grunt/gulpのプラグインもある！

ちなみに、Pluginの開発に関してはJSTalkっていう（v3.0.2からはCocoaScriptで開発するとのこと）JSからCocoaライブリにアクセスできるやつを使うらしい。ちょっと慣れないけど、JSなら作れないこともない！やるっきゃない！

あと、現時点ではPhotoshopしか正式対応してないけど、Framer.jsってのを使うと、PSDとかsketchファイルからビューファイルを作ってくれるのもあったりするので今後に期待したい。

というわけで、Sketch.app使うとデザイナーだけでなくエンジニアの方も、みんながハッピーになれる可能性を持っているソフトなんじゃないかなと思うのでした。

[追記]

Sketchプラグインつくりました。