中川 小雪
中川 小雪

necco note

Figmaでテキストスタイルを早く登録する方法「Register Text Styles Super Duper Fast !!!」をFigma Communityに公開しました。

  • Design

デザイナーの中川です。

neccoではいつもFigmaでデザイン作成にとりかかる前にテキストスタイルを登録して利用しています。事前に登録しておくと、後でまとめてフォントやウェイトを変更できるし、統一したルールでつくることができるので便利です。

しかし毎回テキストスタイル登録するの、意外と時間や手間がかかって大変!

そこで、プラグインを利用して速く登録する方法を思いついたのでブログとコミュニティに公開しました。

Register Text Styles Super Duper Fast !!!



必要なプラグイン

今回テキストスタイルを速く登録する際に必要なプラグインは以下のこちらになります。

「Styler」

選択したテキストやカラーを、一括でスタイルに登録してくれます。

「Batch Styler」

テキストやカラーのスタイルを一覧でみることができます。一括で名前を変えたり設定を変えることができてとても便利です。

テキストスタイルを早く登録する方法

1.上記で紹介したプラグインをインストールする
2.Register Text Styles Super Duper Fast !!!」ファイルを複製
3.登録したい文字スタイルを複製して選択、「Styler」>Generate Styles でテキストスタイルをまとめて登録

4.「Batch Styler」を起動し、テキストスタイルが登録されていることを確認

上部の検索バーで名前で絞り込みができます。

5.フォントやウェイトを一括で変更

6.スタイル名を置き換えることも可能です

7.左下のUpdate stylesのボタンを押して適用完了!

「Batch Styler」を使いこなすと、フォントやウェイトなどの変更が簡単にできます!

neccoでは文字スタイルを日本語と英語のフォントで分けて登録することが多いです。
フォント名、ウェイト名、見出しの大きさなど好きな階層でつくってみてください。

最後に

Figma Community公開までのフローは下記のふゆなさんの記事を参考にしました!

Figma Communityにファイルを公開する方法

デザイナーのふゆなさんがFigmaでのコミュニケーションをスムーズにするため、昨年に「necco memo」を作成してFigma Communityに公開しました。こちらも良かったらみてみてください。

他にいい方法があれば、ぜひぜひ教えていただけると嬉しいです。

ご感想や改善案をいただける場合は、Twitterアカウント @necco_nakagawa にDMを送っていただくか、メンションをつけてツイートしてくださいませ!

neccoのFigma Communityページ

中川 小雪

中川 小雪

Koyuki Nakagawa

神奈川県生まれ。三兄弟の末っ子。中央大学で社会学を学び、2019年10月からneccoでインターンを始める。 2020年4月にアシスタントデザイナーとして入社。一人前のデザイナー目指して修行中。 好きなものはアイドル、可愛いもの、可愛い人、ご飯、布団、こたつ、小説、旅行。好きな食べ物は、小籠包、餃子、牛乳寒天、ちくわぶ。早起きが人生の課題。

SHARE

TwitterFacebook

Other Posts

necco note

Figma Communityにファイルを公開する方法