Sketch.appがメジャーアップデートでSketch 3になりましたよ。

sketch3-cover

インターフェイスのリファインや細かな機能のブラッシュアップ、そして待望のシンボルを搭載してのメジャーアップデートになりました。

Sketchの基本。というSketch(Sketch 3)の基本操作にフォーカスした電子書籍をリリースしました。詳しくはこちらの「Sketchの基本。」のページをご覧ください。

サイト
Bohemian Coding – Sketch 3

Sketch 3 11,800円(2015/6/30時点) カテゴリ: グラフィック&デザイン, 仕事効率化

ついに搭載されたシンボル

プラグインでシンボルを擬似的に再現するものはありましたが、ついに標準機能として搭載されました。

オブジェクトを選択して、ツールバーの「Create Symbol」またはメニューの[Layer]→[Create Symbol]で簡単にシンボル化ができます。シンボル化したオブジェクトは、他のオブジェクトとまったく同じように扱うことができ、「ダブルクリックして編集モードに…」という煩わしさはゼロです。そして1つのシンボルを変更すれば、他のシンボルにも変更が即座に反映されます。

スクリーンキャスト: シンボルを編集すると他のシンボルも変更される様子

ただ、Adobe系で見られるシンボルからインスタンスが作られているわけではないため、大きさを変更すれば全て同じように変更されてしまいます。したがって、1つのシンボルから異なる大きさのオブジェクトを作成する…ということはできません。

進化したスライス

アセットの設定

Sketch 2では、任意の範囲にスライスを設定するか、選択範囲からスライスを作成するかのどちらかでした。これが大幅に進化し、Sketch 3ではオブジェクトそのものに書き出し設定ができるようになりました。

オブジェクトを選択し、インスペクタの右下にある「Make Exportable」を設定すると、解像度と接尾辞・ファイルフォーマットを選択できるようになります。+マークでExportの設定を追加できるので、@1xや@2xをはじめ@1.5なども追加することができます。

s3-export-setting

ちょっと分かりづらかった書き出しも、[File]→[Export…](ショートカット:CommandShiftE)で表示されるダイアログで、小さいながらもプレビューで確認しながら書き出す画像を選択できるようになっています。

s3-export-dialogue

残念なのは「Make Exportable」がメニューになく、ショートカットが設定できないことでしょうか。

スライス設定の変更

Sketch 2ではオブジェクトとスライスの扱いが分かれており、オブジェクトとスライスを同時に動かすことができませんでした。Sketch 3ではスライスをレイヤーして扱えるようになったため、グループ化することで同時に動かすことができます。

s3-slice-layer

また先ほども書きましたが、書き出すファイルフォーマットをスライス設定できるようになりました。相変わらずPNGは32bitでの書き出しになりますが…

シェアードスタイルの管理機能が強化

Sketch 2では「リンク」と呼ばれていた機能ですが、これの管理機能が強化され、管理パネルの導入とスタイルに名前を付けることができるようになりました。

s3-shared-style-panel

レイヤースタイルはともかく、以前からテキストスタイルには名前を付けることができたんですが、使い勝手はあまりよろしくなかったのでかなりの改善だと思います。

またシンボルとテキストスタイルは、メニューから挿入できるようになっています。

インスペクタのレイアウト変更

起動するとウィンドウが若干変わっているのが分かります。下は起動した時のスクリーンショットですが、ツールバーのアイコンサイズが小さく、インスペクタ周りがスッキリしながら余白が少なくなり、プロパティをたくさん表示できるようになっています。

s3-window

また地味なところなんですが、Sketch 2で微妙に散らばっていたツール類がインスペクタにまとまりました。整列や水平・垂直の反転、パスのコーナーポイントの設定などもインスペクタの領域に表示されるので、ポインタをあちこち移動させることが少なくなりました。

少しだけ強化されたビットマップ編集

Sketch 2では矩形の選択範囲をつくって削除ぐらいしかできませんでしたが、矩形選択に加えてマジックワンドで同じ色を選択できるようになりました。さらに、選択範囲の反転・選択範囲でのクロップ・塗りつぶし・選択範囲からのベクトル化ができるようになっています。

s3-bitmap-edit

まぁ正直使い勝手は「?」ですが。画像のちょっとした色補正などは、やはり他のアプリに頼らざるを得ない感じです。(塗りを重ねて無理矢理色補正する方法もありますけどね…)

地味だけど便利になったアップデート

テキストのリスト化

テキストの行頭にブレットまたは数字を付けるオプションが加わりました。

s3-listed

塗りの無制限化

あまり塗りを重ねることも少ないとは思いますが、Sketch 2では4つまでだった塗りを無制限に設定できるようになりました。これで微妙なニュアンスも表現できますねっ!

背景色の設定

これも地味すぎる機能ですが、アートボード設定で背景色を設定できるようになりました。これで背景用の塗りを準備しなくてよくなりますね。背景色は書き出しに含めるかどうかも選択できます。

アップグレードの注意点

ファイル拡張子は変わらず「.sketch」ですが、2のファイルを3で開いて保存すると2で開けなくなります。事故が怖い人は、ファイルを複製してから開いた方が安全でしょう。

また、2で設定しているリンク関連はすべて無効になるという悲しい現実が待っているので、どうしても3を使いたい場合はその覚悟が必要になります。

あと、微妙なバグは健在で、とりあえずガイドラインの無限増殖は確認しました。(Sketch.appあるあるはこちら Sketchisbest

3/1以降にSketch 2を購入された方は、Bohemian CodingへAppStoreで購入した証明を連絡すると、アップグレードライセンスが貰えるようです。詳しくはFrom Sketch 2 to Sketch 3(英語)をご確認ください。


メニュー構成やパネルのレイアウト変更で「あれ?どこに行った?」という状況はまだありますが、2と大きく操作が変わることもなく、違和感はほとんどありません。

リリースされたばかりでザックリとしか使っていない状況ですが、着実にバージョンアップしている印象です。Sketch.appで全ての状況に対応できるわけではありませんが、個人的には大概のことならこれで何とかなるかなぁと思います(日本語の扱いはやはりプアーですが…)。

トライアルがありますので、まずはご自身に合うかどうかじっくり試してみてください。

サイト
Bohemian Coding – Sketch 3

Sketch 3 11,800円(2015/6/30時点) カテゴリ: グラフィック&デザイン, 仕事効率化

tags