ProttのSketch Pluginがついにリリース!
新機能リリースのおしらせ
最新版のSketchプラグインは、こちらからダウンロードしてください。
こんにちは、いつもProttをお使いいただき誠にありがとうございます!この度ProttにSketch連携機能が追加されましたのでおしらせします。
Sketchとは?
![](https://images.prismic.io/prottblog/17ce1ad0ac8617b774f40ef138bd5cc7210f54ee_pic-2015-07-14-12.22.03.png?auto=compress,format)
Sketchは最近話題のWebとモバイルUIデザインに特化しているデザインツールです。Prottを開発するグッドパッチではデザイナーは全員Sketchを使用しています。
![](https://images.prismic.io/prottblog/fd0dd01c6f9f5e0af6823f3b1a3d7d78755e08e4_prottsketch.png?auto=compress,format)
先日、Prott Androidデザイナーが受けた、Sketch 3を使う3つの理由と10の魅力というインタビューも公開されたので是非ご覧ください。
Sketch連携するとできること
Sketchと連携することで、Sketchでデザインしたものをクリックひとつで自動的に同期することができるようになりました。スクリーンのデザイン変更もスムーズに反映が可能となりました。
まずはプラグインをインストール
Sketch連携用のプラグインをインストールする方法は2種類あるので、お好きな方をお試しください!
Zipファイルからインストールする方法
こちらからZipファイルをダウンロードし、インストールしてください
![](https://images.prismic.io/prottblog/7703b81e08b4ad9dc973caa82427c9c8fbeb9dfa_1.png?auto=compress,format)
無事にインストールが成功すると上記のような表示がされます!
Sketch Toolboxよりインストールする方法
Sketch ToolboxよりSketchプラグインがダウンロードできます。まだ入れていない方はさっそくこちらからダウンロード!
![](https://images.prismic.io/prottblog/3de7ce51561da732060acc7c673aeb7368d0f84b_pic-2015-07-22-17.27.11.png?auto=compress,format)
Sketch Toolboxで「Prott」と検索し、「Install」ボタンをクリックするとインストールが完了します。
![](https://images.prismic.io/prottblog/72e04e810a5dcd0c2e7efdb93229a885162671b9_snip20150725_3.png?auto=compress,format)
Sketch連携の使い方
1. Sketchを開く
![](https://images.prismic.io/prottblog/775160eedd4c87d2294ebb87b9c681e1b5c34c2f_pic-2015-07-14-13.37.39.png?auto=compress,format)
2. Sketchのメニューから「Plugins」→「Prott Sketch Plugin」→「Login to Prott」を選択
![](https://images.prismic.io/prottblog/dc88dc9aaebfa0b0a5afff5ca2c2afc610ca79cd_snip20150727_12.png?auto=compress,format)
3. Prottのアカウント情報を入力
![](https://images.prismic.io/prottblog/bbc1e264ec867a10206a1b902a97236e3036f2a8_snip20150726_2.png?auto=compress,format)
4. 同期したいプロジェクトを選択して閉じる ※後からOptionsから変更できます
![](https://images.prismic.io/prottblog/b0b5fb56c30ee7708f7c51e6d7ffe6a6707ff767_snip20150726_1.png?auto=compress,format)
5. Sketchのメニューから「Plugins」→「Prott Sketch Plugin」→「Sync All Artboards to Prott」をクリック(またはショットカットキー「⌥ + ⇧ + ⌘ + U」)
![](https://images.prismic.io/prottblog/5edb3ecc9ae0f704bb61e70394a40c556d3b9358_snip20150727_13.png?auto=compress,format)
6. Prottで同期完了
![](https://images.prismic.io/prottblog/30e9595492069e398639816abc969736f92111c2_pic-2015-07-24-15.47.47--pic-2015-07-24-15.47.49.png?auto=compress,format)
一部の画像を更新したい場合
Sketch上で更新したいアートボードを選択し、「Sync Selected Artboards to Prott」を選択することで一部画像のみ更新可能です。(またはショットカットキー「 ⇧ + ⌘ + U」)
同期前に戻したい場合
Web版にてSketchから同期したスクリーンの履歴を確認・過去の同期したスクリーンを復元することができます。※Starterプラン以上でお使いいただける機能となっております
備考
スクリーンの同期は、SketchのアートボードのIDを元に行われています。そのため、複数のアートボードを同じ名前に設定しても上書きして同期されることはありません。アートボードの名前を変更すると、変更を反映したものが同期されます。
また、複数人が同じプロジェクト・Sketchファイルに対し同時に作業・同期することも可能です。
以上です。是非お試しください。今後改善も進めていきますので、ご意見などございましたらお気軽にご連絡ください!どうぞよろしくお願いします!