FigmaデザインをWebサイトに変換するプラグイン「Figma to Hirameki 7」公開
公開日:
トライベック株式会社は、中小企業向けDXプラットフォーム「Hirameki 7」で、Figmaのデザインデータを書き出すプラグイン「Figma to Hirameki 7」を正式リリースしました。これにより、Figmaで作ったデザインをコーディングなしでWebサイトに反映できます。デザインから公開・運用までを一つの流れで進められるため、制作会社やフリーランスの作業効率が高まります。プラグインはFigma Communityで無償公開されており、誰でも利用できます。
ポイント
- 1トライベックがFigma連携プラグインをFigma Communityで正式公開
- 2選択したレイヤーのノードデータをJSONファイルとして書き出し
- 3テキスト・画像・オートレイアウト・ベクターを統合エディタに反映
「Figma to Hirameki 7」は、Figmaで選択したレイヤーのノードデータをJSONファイルとして書き出すプラグインです。書き出したファイルを「Hirameki 7」側でインポートすると、Figmaのデザインが統合エディタに反映されます。デザインを見ながらゼロから組み直す工程を省き、制作の続きをスムーズに進められます。
主な対象と利用の流れ
主な対象は、Figmaを日常的に使うフリーランスや制作会社です。利用の流れは、まずFigmaでレイヤーを選択してプラグインを実行し、JSONファイルをダウンロードします。対応する要素はテキスト、画像、オートレイアウト、ベクターです。オートレイアウトで構成されたデザインほど再現度が高くなります。次に、そのファイルを「Hirameki 7」でインポートすると、デザインが統合エディタに反映されます。スマホデザインの同時インポートや自動レスポンシブ設定も利用できます。
ノーコードで仕上げから運用まで
反映されたデザインは、「Hirameki 7」の統合エディタでそのまま編集できます。テキストや配色の調整、パーツの追加、レスポンシブの確認まで、コードを書かずに仕上げられます。仕上げたページはそのまま公開でき、公開後の更新はCMSで運用します。フォーム、名刺管理、メール配信、ダッシュボードといった機能ともつながります。
制作プロセスの効率化
トライベック株式会社は、このプラグインによってデザインから実装への引き渡しにかかる手間を減らし、デザインデータを見ながら組み直す工程を圧縮できるとしています。その分の時間を提案やデザインの作り込みに充てられます。プラグインは2026年8月21日から提供されており、無償で利用できます。
Q&A
Q. 「Figma to Hirameki 7」とは何ですか？
A. FigmaのデザインをWebサイトに変換するプラグインです。選択したレイヤーをJSONに書き出し、Hirameki 7へ取り込めます。
Q. このプラグインを使うと、どんな作業が省けますか？
A. デザインを見ながら一からコーディングする工程を省けます。Figmaの内容をHirameki 7に反映し、そのまま編集できます。
Q. 利用するのに費用はかかりますか？
A. プラグイン自体は無料です。書き出したデータの反映にはHirameki 7の契約か、14日間の無料トライアルが必要です。
関連リンク
- https://www.hirameki7.io/function/marketing/site/lp-figma/
- https://www.hirameki7.io/lp-partner/site/
- https://www.hirameki7.io/
- https://www.tribeck.jp/
O!Productニュース編集部からのコメント
FigmaのデザインをJSON経由でそのままCMSに取り込めるのは、制作会社にとって引き渡しの手間が大きく減りそうですね。無償公開なのも嬉しいところです。
引用元：PR TIMES
この記事の著者
O!Productニュース編集部
