fireworksの開発が終了し、WEB制作に便利なドローイングソフトとして脚光を浴びているSketch。

最初はfireworksの代替品程度の認識でしたが、シンボル機能、スライスを切らなくてもシンボルがスライス化される機能などなど、非常に便利な機能が揃っています。

IllustratorやPhotoshopはまだまだ必要なポイント、機能があるとは思いますが、きれい目なワイヤーフレームにパーツを乗せてカンプ化、そのまま切り出しなどという基本的なデザインワークフローを実現するのに便利な機能が盛りだくさんの注目アプリケーションです。

先日のgulp勉強会で、sketchで作っているデザインを編集、保存するだけで画像やフォントが書き出され、gulp経由でブラウザもリロード!みたいな便利な機能紹介もあり、思わず買ってしまったため、日本語でsketchについて解説しているページや記事を自分用のメモとしてまとめてみました!

 

sketch機能紹介・レビューなど

とりあえずこれを読めばなんとかなる系

Read Sketch 3 Book for Beginner | Leanpub
もはや基本といっても過言ではないのかも。簡単な取扱説明書。

Sketchを買ったら読んでおきたい!基本的なことからちょっとした小技、ショートカットまとめ | MEMOPATCH
ツールバーのカスタマイズはここを参考にしました!

勉強会をきっかけに、話題の「Sketch 3」を1週間使ってみた話 | Webデザイン | 4kaku design
Sketchの紹介と簡単な使い方。

チュートリアルと実例

Sketch買ったので取り急ぎ水着美女描きました | デザイナーのイラストノート
Sketchでイラストを描く。サンプルデータのDLも可。

デザイナーとコーダーの連携に便利なSketch3機能紹介 | Webデザイン | 4kaku design
カンプ作成から画像の書き出しまでに使える便利な機能の解説。

Sketch.appのスライスを解説するよ。 – Sketch.app Advent Calendar 2013 | creative tweet.
Sketchでのスライス書き出しまわりの設定と挙動あれこれ。

Fireworksの代わりになるか?Sketchでできること、できないこと | できることからコツコツと
fireworksとの機能比較、シンボル、スライス、スタイル、マスクの解説。

さらに便利に!

Sketch 3を使いこなすためリンクやメモ | 何者にもなれないWebデベロッパーのメモ – whiskers
充実のショートカット集。

gulpでWebFont作成を自動化 | Web雑記帳
sketchとgulpでフォントを自動書き出し。

Installed Sketch Plugins
Sketch3の動作確認済みプラグインリスト。一言コメント付き。

 

と、いうわけであとは使うだけ!

sketch、まだまるまるサイト1個やったよー!とかというレベルではないものの、可能性をすごく感じています。

1案件をsketchベースで回してみて、実際どんなもんか見て見なきゃですね。

そもそもの問題は、これが快適だったとしても、デザイナーさんがIllustratorかPhotoshopでデータを入れるパターンがまだまだ多いので、結局起動しなきゃいけないのかなあといった感じ。

なんにせよ、イマドキなツールはとりあえず試してみるべきだと思うので、ハマったらきっとまた記事を書くとおもいます!

Sketch 3
カテゴリ: グラフィック&デザイン
現在の価格: ¥9,800