FigmaからHubSpotへのテーマ

Figmaの​デザインを​HubSpotテーマに​変換する方法。

transjtは、Figmaファイルを数時間で、高速でSEOに対応したHubSpotテーマに変換します。デザインを一から作り直す必要はありません。

代理店、フリーランス、マーケティングチームに選ばれています

デザインからテーマへ

デザインと​開発の​溝は、​もうありません。

これまで、FigmaのデザインをHubSpotテーマにするといえば、80時間以上かけて手作業でコーディングするか、重いページビルダーを使うか、引き継ぎで細部が失われたデザインで妥協するかでした。transjt.aiはFigmaのオートレイアウトを読み取り、キャンバスどおりの見た目で、手書きのコードと同じように快適に動く、軽量なカスタムHubSpotテーマを生成します。

  • ワークフロー

    Figmaとのネイティブ連携

    transjtのプラグインはFigmaの中で動くので、キャンバスを離れずにデザインを送ってコードを生成できます。

  • 汎用性

    サイト全体、ブログ、フォームを構築

    ランディングページ、ブログ、フォームを含むWebサイト全体を、一度に変換できます。

  • 自動化

    AIによる自動レスポンシブレイアウト

    メディアクエリを書く必要はありません。AIがレイアウトをモバイル、タブレット、デスクトップに合わせます。

  • 拡張性

    カスタムテーマ

    デザインが、再利用できるコンポーネントを備えたHubSpotテーマになるので、チームが自分たちで新しいページを作れます。

  • 多用途

    ほかのツールにも対応

    Google Stitch、Relume、UX Pilotでデザインしている場合は、その結果をFigmaに取り込み、transjtでHubSpotへエクスポートします。

  • Figmaでプラグインを開く。

    Figmaの中でtransjtを実行し、フレームをワークスペースに送ります。

    Figmaで開く
計算してみる

計算してみましょう:​コンポーネントは​いくつ​ありますか?

transjtでサイトを公開

費用を節約
$8,100*
時間を節約
81時間*手作業で10.1作業日
すぐに結果が出る
1.5〜3時間*テーマ全体で
無料で始める

*手作業でFigmaからHubSpotへ構築する場合の時間をもとにした概算です。1コンポーネントあたり約4.5時間、時給$100、1日8時間で計算しています。transjtなら約1.5〜3時間でテーマを構築します。

お客様の声。

アーティストのアトリエで机に向かう男性お客様
“We’d seen plenty of tools promise magic for page and theme creation, but they always under-delivered. Transjt proved to be the exception.”
KevinThinkFuel
  • 95–99%完成コードの割合(構成の整ったファイルの場合)
  • ∞取り込めるAIビルダー(Figmaにも対応)
  • 2ネイティブ対応のCMS:HubSpotとWordPress
  • 1クリックでエクスポート。数分後にはテーマがアカウントに届きます
仕組み

Figmaから​HubSpotへ、​3ステップで。

  1. Figmaのコンポーネントを取り込む

    プラグインを使って、Figmaのプロジェクトから直接デザインのコンポーネントをtransjtに取り込みます。AIがコンポーネント、スタイル、レイアウトを解析し、実際に動くレスポンシブなコンポーネントに変換します。

  2. 結果を確認する

    transjtアプリのライブプレビューで、デザインがコードになったときの見た目を確認できます。気になる点があれば、オートレイアウトの設定を調整して再度変換します。

  3. HubSpotにエクスポート

    手作業でアップロードするファイルはありません。「エクスポート」をクリックすると、transjtがHubSpotアカウントに接続し、FigmaのレイヤーをHubSpotのコードに変換して、テーマをデザインマネージャーに配置します。ワークフロー全体についてはFigmaからHubSpotへをご覧ください。

transjtを選ぶ理由

なぜ​Figmaから​HubSpotへの​変換に​transjtを​使うのか?

  • 数週間ではなく数時間で公開

    Figmaのデザインを取り込むと、AIがテーマファイルを生成します。レイアウトを切り出したりコーディングしたりする人は要りません。2週間かかっていた作業が、半日で終わります。

  • ネイティブなロジックとの統合

    transjtがエクスポートするのは見た目だけではありません。FigmaのレイアウトをHubSpotネイティブのブログループに対応づけ、フォームのデザインを実際に動くフォームに変えます。手作業での設定は要りません。

  • カスタムHubSpotテーマ

    サイトビルダーを使うと、そのプラットフォームや重いプラグインに縛られます。transjtが生成するのは、それ単体で動くネイティブなHubSpotテーマです。完全なテーマフォルダーが手に入り、テーマもモジュールもお客様のものです。

  • 大幅な時間短縮

    手作業の引き継ぎがなくなるので、デザインをコードに置き換えるのに何時間も費やす人はいません。完成したFigmaファイルは、数時間で公開中のHubSpotサイトになります。80時間かかっていた作業が、3時間未満で終わります。

FAQ

Figmaから​HubSpotへの​テーマに関する​よくある質問。

要点だけをまとめた回答です。それ以外のことは、デモを予約してお尋ねください。

デモを予約
  • transjtは、デザインを本番対応のHubSpot CMSテーマとモジュールに変換する、AI搭載のFigmaプラグインです。手作業でコーディングする必要はありません。

  • いいえ。HubL、HTML、CSS、JavaScriptはtransjtが書きます。Figmaからデザインを書き出し、コードを1行も書かずにHubSpotポータルで公開できます。

  • できればFigmaのオートレイアウトを使ってください。整理されていないファイルでもAIは変換を試みますが、整ったデザインほどクリーンなコードになり、後の作業時間を大きく減らせます。

  • はい。同じFigmaプラグインで、PHPテンプレートとGutenbergブロックを備えたネイティブのWordPressテーマを、自社管理のホスティングへエクスポートできます。詳しくはFigmaからWordPressへのテーマ変換ツールをご覧ください。

今日​デザインして、​明日​公開。

transjtでは一秒一秒が大切です。だから私たちの使命はシンプル。あなたの時間を節約し、ワークフローの手間をなくすことです。