おはよー!
デザイナーとして駆け出して2年目の管理人みっぽこです。
本記事では、figmaでのUIトレースのスピードを加速させる便利なプラグイン7選を紹介します。
こんな人におすすめ
- UIトレースをもっと効率よくやりたい
- 時間をかけなくていいところにかけすぎてしまう、、
- UIトレースのハードルをできるだけ下げて継続させたい
UIトレースは、丁寧にやればやるほど時間はいくらあっても足りません。そんなときはfigmaのプラグインを利用して作業効率をどんどんUPさせちゃいましょう!
UIトレースを継続してがんばってる読者の方へ、苦痛な思いではなくワクワク楽しいでほしい!そんな気持ちでお届けします!
実用的なものをピックアップして紹介しているので、ぜひ参考にしてみてください。
要素間の大きさを知りたい!Redlines
Redlinesは、要素感のサイズを測って大きさを自動で入力してくれるプラグインです。
このプラグインを使って全体のマージンの大きさを把握した上で、UIをトレースすることで「大きさを測ってマージンの幅を記録して…」といった手間が省けます。
視覚的にも見やすくなるので、分析で見返すときにも重宝します!
アイコンを埋め込みたい!Material Design Icons
Googleフォントチームが公開しているアイコンアセットです。Googleマテリアルデザインのガイドラインに沿った2,000を超えるアイコンを使用することができます。
アイコンを探すのがめんどくさい!そんなときはIconify
先程ご紹介したMaterial Design Icons、FontAwesome、Jam Icons、EmojiOne、Twitter 絵文字、その他多くのアイコン (100,000 を超えるアイコンを含む 100 を超えるアイコン セット) を使用することができるプラグインです。
このプラグインのいいところは、欲しいアイコンを大量のアセットの中からピンポイントで探せること。
例えば、検索マークのアイコンが欲しいけどいろんなアイコン集を横断して探すのは時間がかかる…
そんなときは、iconifyで「search」と検索すれば、いろんな種類の検索アイコンが一覧で見ることが可能です。
UIを忠実に再現したい!iOS 16 UI Kit for Figma
iOS 16のUIのパーツが揃っているプラグインです。
iPhoneの画面トップのバーやホームインディケーター(画面したにある細長い線)など、UIトレースで画面を忠実に再現したいときに、使うと便利!
プラグインとして公開されているアイコンやUIキットは数多くあるので、自分で作ろうとする前にアセットとして公開されていないかな?と調べることも、UIトレース時短への近道です。
まとめ
いかがでしたか?本記事では、UIトレースをするときに便利なプラグインをご紹介しました。
なにより大事なことは、プラグインをうまく活用してトレースのハードルを下げ時短をすること。
作らなくていいところは、プラグインを探して時短をする!
UIトレースは継続が大事です。
意気込んで全部そっくりそのままトレースするぞ!と取り組むとすぐに息切れしてしまいます。
楽できそうな箇所は楽をして、楽しくUIトレースの勉強を続けてみてください!
UIトレースを初めてみたけど、やり方がいまいちわからない。そんな方は、こちらの記事も合わせてご覧ください!
UIトレースを3ステップに分けてやり方を説明しています。
実際にUIトレースをしてみた記事もあるのでぜひこちらもご参考までに!
それではまた次回!
コメント