新しくリリースされたSketchプラグインを紹介します(2020.04版)
前回の記事から3ヶ月ほど経ったため、あらためプラグインを棚卸しました(半年だとチェックする数が多いので少し短くした)。前回から2020/3/31までに、Plugin Directoryへマージされたものから、「インストールしたプラグイン」「候補に上がったプラグイン」「今回チェックしたその他のプラグイン」の順でお届けします。
インストールした新しいプラグイン
Arrange Artboards Hierarchically
https://github.com/oodesign/arrange-artboards-hierarchically
スラッシュベースの名前に応じてアートボードを並び替えてくれるプラグイン。A
・A/A
・A/B
・A/A/A
とあれば、A
先頭に階層的に並び替えてくれます。
アートボードを自動で整頓してくれるArtboard Managerを使ってますが、こちらは完全なグリッドとして整列してしまい、階層的な並びにはできないって悩みがあったので、期待を込めてインストール。これで自動的に並び替えてくれたらいいのですが……
ちなみに併用すると大変なことになりました。
Light Switch Sketch Plugin
https://github.com/TheBerriman/lightswitch-sketch
シンボル・レイヤースタイル・テキストスタイルをキーワードに応じてLightモードとDarkモードで切り替えるプラグイン。
Swap Itと迷いましたが、レイヤースタイル・テキストスタイルにも対応しているので、こちらに。
候補に上がったプラグイン(使いそうだけど、多分使わなくなりそうなやつ)
Helpify
https://github.com/Luckyfoxdesign/helpify
ランダムな数字を生成するプラグイン。最小・最大・丸め・単位を設定可能。
Sketch Inter Letter Spacing
https://github.com/giliamverheide/sketch-inter-letter-spacing
Inter Dynamic MetricsによるLetter Spacingをいい感じに調整してくれるプラグイン。
Copycat
https://github.com/azhsetiawan/sketch-copycat
アートボードのスナップショットをPattern Fillとして適用し、レイヤースタイルを作成・更新するプラグイン。「アートボードをシンボル化したい」みたいな用途で使えそう。
CSS box-shadow to Layer Style
https://github.com/oliverpitsch/CSS-Shadow-to-Sketch-Style-Plugin
CSSのbox-shadowプロパティを、SketchのDropshadowに変換してくれるプラグイン。
Playful Design Tools
https://wavetogether.github.io/wave_design/sketch-plugins/
選択したアートボードを.ttf
ファイルとして書き出すプラグイン。
TogglePixelFitting
+ https://github.com/KevinGutowski/PixelFit
パスの編集中にしか表示されない、ピクセルスナップの設定変更にショートカットを設定するためのプラグイン。
Swap It
+ https://github.com/shantsis/swap-it-sketch
LightとDarkなど、特定のシンボルグループに応じてシンボルを入れ替えてくれるプラグイン。Light / Dark以外が指定できるものの、入れ替えはシンボルのみのため、今後に期待。
Snap to 8pt Grid
https://github.com/mheesakkers/sketch-plugin-snap-to-8pt-grid
幅や高さ・座標などをグリッドにスナップさせるプラグイン。スナップ幅は2・4・8・10・12・16から設定可能。
今回チェックしたその他のプラグイン
sketch-color-manager
https://github.com/hecflores/sketch-color-manager
ドキュメント中の色を表形式で一覧できるプラグイン。カラーコードなどは表示されないので、あくまでどのような色を使っているかを確認できるのみ。
sketch-twilio-ipsum
https://github.com/twilio-labs/sketch-twilio-ipsum
Twillio製のダミーテキスト生成できるDataプラグイン。25%の確率で英語以外のダミーテキストが生成される。レイヤー名に接尾辞をつければ特定の言語も強制可能。
XD2Sketch [未検証]
XDファイルをSketchファイルにコンバートするプラグイン(有料)。有事の際に覚えておきたい。
Paste to Fill
https://github.com/tgfjt/sketch-paste-to-fill#readme
コピーした画像をPattern Fillとしてペーストするプラグイン。
Sketch Export Preferences
https://github.com/KevinGutowski/Sketch-Export-Preferences
書き出し設定をJSONで読み書きできるプラグイン。他者に設定を共有するときなどに利用できる。
SR Measure
https://github.com/endswithak/sketch-measure-react
デザインスペックをブラウザで確認できるようにエクスポートするプラグイン。
Sketch Dark Side Plugin
https://github.com/receptiryaki/darkside
Lightモード用とDarkモード用のレイヤースタイルを事前に作成しておくことで、切り替えができるプラグイン。
axure [未検証]
プロトタイピングツールaxureへエクスポートするプラグイン。
Name My Color
https://github.com/carlosflrg/name-my-color
カラーコードに応じた色の名前をつけてくれるプラグイン。名前の元になったのはこちらのサイト: http://chir.ag/projects/name-that-color/
efficient-images-export
https://github.com/BinLia/efficient-image-export
画像を最適化して書き出すためのプラグイン。TinyPNGなどで圧縮できる。
Sketch Times
https://github.com/xaddict/sketch-times
時間のダミーデータを生成するDataプラグイン。最大値(分)を入力してその範囲でランダム生成する。
Potrace Plugin for Sketch
https://github.com/perrysmotors/sketch-potrace
ビットマップをモノクロのベクターへ変換してくれるプラグイン。イラストとかの簡易トレースに。
Attention Insight Sketch plugin [未検証]
https://github.com/attentioninsight/attention-insight-sketch-plugin
デザインをAIで分析しヒートマップを生成するプラグイン。元のサービスのアカウントが必要。
bankingdata
https://github.com/nktx/banking-data-supplier
中国の銀行口座などのダミーデータを生成するDataプラグイン。
UI-House
https://www.ui.house/sketch-plugin
UI HouseにあるSketchリソースをインポートするためのプラグイン。サイトのプレビューにある「Import to Sketch」から直接インポートできるようになります。
https://www.ui.house/sketch-resources
Search Sketch
https://github.com/candy02058912/search-sketch
文字列を検索してフォーカスするプラグイン。マルチバイト対応版。[動作してない?]
ICONICON
https://github.com/Sugarcode-Team/icanicon-sketch-plugin
iconicon.ioへの書き出しや更新ができるプラグイン。[未検証]
Merge duplicate symbols
https://github.com/oodesign/merge-duplicate-symbols
重複しているシンボルをマージするプラグイン。[未検証]
DatesFromNow
https://github.com/LeipeLeon/Sketch_DatesFormNow
現在の日付をテキストレイヤーへ生成するDataプラグイン(ただしオランダ語)。
Copy Optimized SVG Code
https://github.com/chenxsan/copy-optimized-svg-code
選択しているオブジェクトのSVGコードを最適化し、クリップボードへコピーしてくれるプラグイン。
Sketch Map
https://github.com/she1991/Sketch-Map
プロトタイピングをHTMLとして書き出してくれるプラグイン。ただし全体の繋がりを確認できるだけで、プレビューモードでインタラクティブに確認できるわけではないので注意。
Trim Artboard
https://github.com/franklymrshankly/Trim-Artboard
指定した余白分をプラスして「Resize to fit content」してくれるプラグイン。
Dark Mode Plugin
https://sketch-dark-mode.eduardogomez.io/
あらかじめLightモードとDarkモードのカラーを設定しておき、それを入れ替えるプラグイン。
sketchdesignops [未検証]
https://github.com/genexuslabs/sketchdesignops
Design Opsを内部的に簡素化するプラグイン。試そうと思ったのですが、説明にSambaでサーバーへ接続せよとあったため、ちょっと怖くて未検証です。
おそらくこれ関連のプラグイン? https://www.genexus.com/
Greyscale
https://github.com/KevinGutowski/ToggleGreyscale
アードボードの内容をグレースケールに切り替えて表示してくれるプラグイン。
Find Dirty Styles
https://github.com/KevinGutowski/FindDirtyStyles
テキストスタイルと同期していないレイヤーを見つけるためのプラグイン。
Tiled for Sketch plugin
https://github.com/TiledCo/tiled-sketch-plugin
Tiledへエクスポートするためのプラグイン。
Sketch WebGL
https://github.com/endswithak/sketch-webgl
SketchのデザインをHTML CanvasのWebGLでレンダリングするプラグイン。
sketch-ignore [未検証]
https://github.com/theboi/sketch-ignore
.gitignoreのようにSketch Cloudへアップしないアートボードやレイヤーを指定するプラグイン。
ChemFill
https://github.com/ahadik/chemfill
ChEMBL APIから分子構造を取得して画像(PNG)をPattern Fillとして適用するDataプラグイン。
現在のインストール済みのプラグイン
たまにしか使わないものも含めて次の通りです。
- AEUX
- Arrange Artboards Hierarchically
- Automate Sketch
- Cluse
- Collapse All Artboards And Groups
- Contrast
- Craft
- Data from clipboard
- Find and Replace
- Light Switch
- Line-Height Fixer
- Lottie export
- Magic-Aligner
- PinIt
- Rename-It
- Resize Commands
- Retain Text Color
- SVGO Compressor
- Sketch Image Compressor
- Sketch Measure
- SketchCleaner
- Switch Text Spacing
- Symbol Browser
- Symbol Name Autocomplete
- Symbol Organizer
- SymbolNameSync
- Tin Drum
- Unsplash
- sketch-dev-tools
- Runner
では楽しいSketchライフを。