この記事はSketch Advent Calendar 2016向けに書いた記事です。
Sketchはデザインツールとして一般的に広まっていますが実はデザイナーよりも他の職種の人もSketchを導入する事でその恩恵を受ける事ができます。
Sketchを使ってデザイナー以外の職種の人がどんなメリットがあるか紹介したいと思います。
Sketchの特徴
Sketchは名前から想像できるようにデザイン系のソフトです。
比較されるツールとしてはadobe社のPhotoshopやIllustratorが多いです。
それぞれのツール特徴としてはこんな感じでしょうか（個人の見解です。）
- Adobe Photoshop：写真加工とデジタルペインティングに最適
- Adobe Illustrator：アイコンのデザインと印刷系のグラフィックデザイン、ベクター素材
- Sketch：全てのUI/UXのデザインとフラットなアイコンのデザイン
残念ながらSketchは現在はMac版しか出ていませんでのWindowsをお使いの人はmacをご購入ください。
Sketchは海外ではすでに絶大な支持を得ています。
なぜか日本ではいまいち利用者は増えていません。
みんなadobeから離れるのにリスクがあると思って一歩踏み切れないのですかね。
利用者の支持を得ているポイントは、動作が軽く、低スペックなPCでもサクサク動く事と、UI/UXを設計するためのツールに特化していて無駄な機能が削ぎ落とされているため学習コストが低い事です。
有料のツールですが、年間＄99で利用が出来るのも人気の理由です。
adobeのCCを使うために、みんなが契約してたら結構コストかかりますもんね…
他にも下記のような理由があるかと思います。
- ベクターデータによる制作のため、解像度の変化に強い
- アートボードとページによって画面管理がしやすく、サービスのページをすぐに把握できる
- 手元のデバイスですぐにデザインを確認できる（Sketch Mirror）
- 作業効率が格段に向上するシンボル機能
- InVisionやsympliなどさまざまなサービスとの連携
営業/ディレクターから見たSketch
Sketchはデザインツールと紹介しましたが、実は営業/ディレクターさんでも十分メリットがある使い方ができますので紹介します。
スライド作成に便利
営業やディレクターさんというとパワポとかで資料を作ったりする事があるかと思います。
その時デザインをもっときれいにしたいと思った事はあるでしょう。
そんな時Sketchを使う事でデザイナーと連携が取れて自分が伝えたいスライドの資料を作る事ができます。
デザイナーからすると、普段使わないツールで作業するって結構時間がかかるのですが普段使ってるツールであればSketchであればデザイナーは瞬時に作ってくれます。
また、デザイナーと一緒に提案資料を作るケースもあるかと思いますがそんなときも連携が取りやすくて良いですね。
他の方も同じような意見を持ってる方がいますので紹介しますね。
デザイナーだけでなく、ディレクターや営業職におすすめしたいSketch
ワイヤーが作りやすい
Sketchは軽快な動作で使うことができます。
Android・iOSのデフォルトのUIもツールの中に含まれているのでワイヤーフレームが簡単につくれます。
またSketchで作られたワイヤーのカンプデータも無料公開されていたりしますので簡単にかつキレイなワイヤーを作る事ができます。
打ち合わせが楽になる
普段やディレクターとなると客先でのコミニュケーションが重要になってくると思います。
デザイナーに作ってもらった画面をPCを見せながら話していても伝わらないケースがあると思います。
でもSketchを使えば大丈夫です。
Sketchは手元の端末と同期することが出来るのでスマートフォンで画面を見せながらクライアントに説明することができます。
また、invisionやprottのようなプロトタイピングツールを使えば画面遷移も見やすくできます。
別にこれはphotoshopでも出来るのですが、Sketchは軽快な動作のためか上記のようなサービスにたいしての同期も早いです。
プロトタイピングツールを使えばクライアントとの情報共有もし易いですし、修正の連絡も的確に共有できますので最近多くの現場で使われてます。
軽快なSketchを使えると、打ち合わせの中で「こんな感じですかね？」とすぐに修正したものを見せる事ができて打ち合わせもスムーズに合意を得ることがきます。
「持ち帰って検討します」じゃ効率悪いですもんね。
プログラマー/コーダーから見たSketch
プログラマー/コーダーさんのようにデザインを画面に反映する人はデザイナからもらったデータを元にコーディングをしますので様々なデザインツールを使い分けてると思いますがSketchはデザインデータを開ける必要もありません。
デザイン情報をブラウザで確認できる
InVisionやsympliを使えばデザインデータを開けなくてもブラウザ上でCSSなどの情報を得ることができます。
※inVitionを使ってます
情報を得るだけでなく画像の書き出しもブラウザ上で出来るので、書き出しのためにデザインデータを触る必要もないのでデザイナーが使ってるデザインデータとのバージョンの差異もなくなります。
書き出しのためにフォルダ名直すとか不便極まりないですもんね。
そんなの作ったデザイナに全部おまかせしちゃいましょう。
クソ重いデザインツールは開かずにコーディングに集中できるのはそれだけでメリットですね。
もちろんSketchは軽いので開いていても全然気になりませんよ。
コーディングの設計が楽
Sketchにはデザインデータ内で使われている色やフォントを一覧化する機能（plugin）があります。
それを使えば、どんなmixinが必要か瞬時に判別できとても効率的にコーディングができます。
似た色があればデザイナーに相談もできて効率的なCSSの設計がデザイナーを交えて可能になりますね。
現場を連携させるSketch
Sketchはデザインツールなのでデザイナーが使っていればいいやと思っている方もいると思いますが、少しSketchへの印象が変わったでしょうか。
現場のみんながSketchを使うことで効率的な開発ができます。
最近はディレクター・デザイナー・プログラマなど職域で区切る事が難しくなってきてるので職種間の連携がものすごく重要になってきてるように感じます。
少なくとも私の現場ではSketchは必要不可欠です。
Sketchがコミュニケーションの言語になってます。
デザイナーがSketchを使わないから使えていないという現場があるのでしたら、是非営業・ディレクター・プログラマ・コーダーの皆さんからデザイナーに対してSketchの魅力を伝えて下さい。
Sketchはいいぞ(*ゝω・*)