✨📱 sketch Plugin ⏳🔧

[haseoyeon]

• Sketchショートカット (https://owls-inc.com/322)

---

• 👍 : 超おすすめ
• 💜 : おすすめ
• 🤔 : あると便利

---

[haseoyeon]

デザインするとき便利

👍Rename it

• 一つ一つ変えるのはマジで大変なのでこれはおすすめ
• レイヤー/アートボード名の管理プラグイン
• https://rodi01.github.io/RenameIt/

👍Paddy

• 余白調整が便利！自動にレイヤー間を指定した数値を保つことができる!
• Butterよりも自由度が高く、レイヤーの間の距離を調整する時間をかなり短縮できる
• https://github.com/DWilliames/paddy-sketch-plugin

👍Butter

• 指定した数値のマージンを複数のアートボードやレイヤーに一瞬に適用できるプラグイン
• https://github.com/pberrecloth/butter-sketch-plugin

👍craft

• 設計プロセスに革命をもたらすSketchとPhotoshopのプラグイン
• Libraryは、Craftの中でInVisionのプラットフォームにデザインライブラリを作成、共有できる
• シンボル、色スタイル、テキストスタイルをライブラリファイルに保存し、Dropbox/Google Driveチームメンバーと共有も可能
• https://www.invisionapp.com/craft

💜Swatches

Googleマテリアルデザイン
Apple iOS
マイクロソフトウィンドウズ
Antデザインの色
Shopify Polaris Design
アトラシアンデザイン
オープンカラー
IBM Design Colors
名前付きWebカラー
Webセーフカラー
フラットUI色

• https://github.com/Ashung/Sketch_Swatches

Pixel Perfecter:Library

• ピクセルの不完全なレイヤー調整
• https://github.com/swiadek/pixel-perfecter-sketch-plugin

👍Clipboard Fill

• クリップボードにコピーした画像を(ctrl + alt + v)でclipboard fillとしてSketchに入れることが可能
• https://github.com/ScottSavarie/Clipboard-Fill

---

レスポンシブ

🤔Auto layout

• レスポンシブデザインの制作に役に立つ
• https://animaapp.github.io/Auto-Layout/
• https://docs.animaapp.com

[haseoyeon]

Symbol

💜Symbol Browser

• シンボルライブラリの一覧でシンボル確認可能・検索・挿入もOK!
• http://symbol-browser.pratikshah.website/

🤔QuickTextOverride

• シンボルのテキストを、別UIで変更OK!
• https://github.com/dbilyk/QuickTextOverride

🤔Symbol Organizer

• シンボルレイヤーを自動に整理してくれる
• https://github.com/sonburn/symbol-organizer?ref=thesketchapphub
• できること　https://blog.nscreates.com/symbol-organizer/

[haseoyeon]

Artboard

Artboard Tricks

• アートボード配置
• https://github.com/romannurik/Sketch-ArtboardTricks

Artboard Manager

• アートボードを自動に整列してくれる
• 沢山のアートボードがあるとき便利
• https://github.com/bomberstudios/artboard-manager

Sort Me

• アートボードを名前で整列してくれる
• レイヤーを名前で整列してくれる
• https://github.com/romashamin/sort-me-sketch

[haseoyeon]

デザイン指示

▶︎ガイドライン

💜Measure

• デザイン指示するときやガイドラインを作成便利
• http://utom.design/measure/
• https://github.com/utom/sketch-measure

▶︎アニメーション

Diya

• http://diyahq.com
• タイムラインアニメーション

▶︎モックアップ

MagicMirror

• アートボードからモックアップを作成
• https://magicsketch.io/mirror/

[haseoyeon]

もろもろ

🤔Sketch Runner

• 迅速なアクセス・履歴ナビゲーター・ジャンプバー・アクションバー
• https://sketchrunner.com

[haseoyeon]

シェア

Shared Text Styles

• テキストスタイルを書き出す/読み込む
• https://github.com/nilshoenson/shared-text-styles

Sketch Palettes

• fillプリセットをエクスポートおよびインポート可能
• colors, gradients, and Pattern fills
• https://github.com/andrewfiorillo/sketch-palettes

🤔Sketch Styles Generator

• 簡単にUIキット作れる
• https://github.com/lucaorio/sketch-styles-generator

[haseoyeon]

Illustrator機能

Blender

• https://github.com/bunnieabc/Blender

chart

• https://pavelkuligin.ru/chart/
• https://github.com/pavelkuligin/chart

[haseoyeon]

Runner

• プラグインをインストール便利
• https://bagelee.com/design/sketch/using_alfred_in_sketch_sketch_runner/
• https://sketchrunner.com

ImageOptim

• Sketchからエクスポートした画像を自動的に最適化してくれるプラグイン
• https://imageoptim.com/sketch

[haseoyeon]

ちょっと楽にになる

Sketch Split Shape

• https://github.com/kupe517/sketch-split-shape
• Sketchにはwidthやheightに数式を入れるとそれを自動で計算してくれる
• nav とか　余白決めて並べるとき便利

Font Finder Sketch Plugin

• font 何使っている？まとめて選択したいとき
• Sketchのページの中で使われているフォントを一覧化し、指定したフォントを選択状態にします。特定のフォントを一括変換したり、いらないけどどこにあるか分からないフォントを探すのに便利
• https://github.com/ukn530/FontFinder

Move Half Pixel

• 0.5pxずつ移動できるようになる
• https://github.com/canisminor1990/sketch-move-half-pixel

Sketch Search Everywhere

• [Option ＋ Command ＋ F]でPagesの中の全範囲でレイヤーやテキストを探してくれる
• https://github.com/MrPeak/sketch-search-everywhere

Cleanup Useless Groups

• 空のフォルダーを一斉削除
• https://github.com/bomberstudios/Cleanup-Useless-Groups

Find and Replace

• 選択したオブジェクト内に含まれるテキストを一括変換できる (VS)Rename It はアートボードやレイヤーの名称を一括変換してくれる
• https://github.com/thierryc/Sketch-Find-And-Replace