無料で登録
Builder.ioからHubSpotへ

Builder.ioから​HubSpotへ：​ネイティブモジュールで、​SDK不要。

Builder.ioでデザインしましたか？transjtはBuilder.ioからHubSpotへの変換を自動で行います。ビジュアルで作ったものが、ベンダーのSDK経由で取得するコンテンツではなく、HubSpot自身がレンダリングするネイティブなHubLモジュールになります。

無料で始めるデモを予約

プレビュー後にお支払い

transjtのテーマで作ったホームページを表示したHubSpotのページエディターと、その横に並ぶモジュール

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

変換すべきとき

Builder.ioを​HubSpotへ​変換すべき​とき

Builder.ioのデザインを、HubSpotの横ではなく中に置くべき6つの状況。

  • 2つのコンテンツシステムに、1つのマーケティングチーム

    キャンペーン、メール、コンタクトをHubSpotで運用しているなら、ページを別のビジュアルCMSに置いておくと、チームは2つのシステムで作業し、レポートも2つに分かれます。変換すれば、デザインは、ファネルのほかの部分がすでにあるHubSpotへ移ります。

  • パーソナライズに必要なのはAPIではなくCRM

    HubSpotは、ライフサイクルステージやコンタクトプロパティに応じて、標準機能でコンテンツを変えられます。それ以外の場所では、連携のための作業が必要です。変換したテーマでは、ページがHubSpotのコンテンツなので、最初からその動作が得られます。

  • シート単位の料金が、編集できる人を決める

    シート単位の料金では、費用によって、サイトに触れられる同僚の数が限られます。デザインがHubSpotテーマになれば、すでに料金を払っているHubSpotのシートを持つ人なら誰でも、モジュールからページを作れます。

  • 難しい部分はVisual Copilotがすでに済ませた

    Builder.ioは、FigmaファイルをクリーンなReactにするのが非常に得意です。transjtはそのReact出力をHubLモジュールに変換するので、コードは、それを生成したプラットフォームに縛られなくなります。

  • アトリビューションをページまで届かせたい

    どのページがどの取引に影響したかをレポートするには、ページがHubSpotのコンテンツである必要があります。HubSpotの外でレンダリングされるデザインでは、そのために追加の計測が必要です。変換したテーマなら、最初の訪問から標準でレポートされます。

  • 移行のためにHubLを学びたい人はいない

    HubSpotのテンプレート言語は、チームが今の場所にとどまるよくある理由です。transjtがその層を書くので、移行は専門家による作り直しではなくエクスポートの1ステップで済み、とどまる理由はなくなります。

計算してみる

builder.ioで​いくつの​コンポーネントを​作りましたか？

transjtでサイトを公開

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

*ReactからHubSpotへの手作業での移行時間に基づく概算です。コンポーネントあたり約4.5時間、1時間あたり$100、1日8時間で計算しています。transjtは、リポジトリから約1.5〜3時間でテーマを構築します。

仕組み

Builder.ioを​HubSpotへ、​4つの​ステップで​変換。

Builder.ioのプロジェクトから、GitHubを経由してネイティブなHubSpotテーマへ。

  1. Builder.ioでデザインして生成

    ビジュアルで作るか、Visual Copilot経由でFigmaファイルを取り込みます。サーバーサイドレンダリングなしのReactとViteのエクスポートを選んでください。HubSpotはHubLを自社のサーバーでレンダリングするため、クライアントレンダリングのフロントエンドが最もきれいに変換されます。

  2. 生成されたコードをGitHubにプッシュ

    Builder.ioのReact出力をリポジトリに移します。transjtはそこから読み取り、コミット履歴を見れば、どのデザインからどのバージョンのテーマが作られたかがわかります。

  3. リポジトリをtransjtに接続

    transjtのプロジェクトでGitHubを認証し、リポジトリを選びます。transjtはコンポーネントツリーを読み取り、どの部分をHubLテンプレートにし、どの部分をマーケターが管理するモジュールフィールドにするかを判断します。

  4. HubSpotにエクスポート

    HubSpotを選び、プレビューを確認します。確定すると、transjtが、デザインマネージャーからアップロードできるネイティブテーマを作成します。アップロード後、モジュールはページエディターに表示され、ページにSDKは含まれません。

無料で始めるデモを予約
Builder.io以外にも

ほかの​コーディングツールも​接続できます。

すべてのAIビルダーを1ページにまとめています：AIからHubSpotへ。

お客様の声

お客様の声。

アーティストのアトリエで机に向かう男性お客様
“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クリックでエクスポート。数分後にはテーマがアカウントに届きます
得られるもの

Builder.ioの​デザインを、​HubSpotへ​移しませんか？

Builder.ioから作ったHubSpotテーマに実際に含まれるもの

HubSpotのCMSは、マーケターがコードを開かずにページの構成を変え、CRMデータに合わせてパーソナライズできるように、そしてレポートが標準ですべてのページに届くように作られています。ビジュアルで生成したReactフロントエンドでは、HubSpotの外からそれを実現できません。まずコンポーネントを、編集可能なフィールドを持つHubLモジュールにする必要があります。transjtはその変換を自動化し、Builder.ioのデザインをネイティブテーマにするので、何も埋め込む必要はありません。

無料で始めるデモを予約
対象

企業、​代理店、​フリーランスの​ために。

明るいオフィスのロビーでタブレットを持って微笑むビジネスウーマン企業社内チームでWebサイトのリニューアルを進められます。長い木のテーブルを囲んで打ち合わせをするチーム代理店チームを増やさずに、クライアントのサイトを完璧に仕上げます。共有スタジオでノートパソコンに向かう、眼鏡に赤いニット帽のデザイナーフリーランスtransjtがプロジェクトを作っている間、チャイラテでもどうぞ。
FAQ

Builder.ioから​HubSpotへの​よくある質問。

Builder.ioのデザインをHubSpotテーマに変換するときに知っておきたいこと。

デモを予約

  • Builder.ioは、ビジュアルデザインやFigmaファイルからReactを生成します。transjtはそのコードをGitHubから読み取り、ネイティブなHubLモジュールに変換するので、デザインは通常のテーマファイルとしてHubSpotの中に収まります。

  • いいえ。変換されたテーマはHubSpotがレンダリングし、実行時にBuilder.ioに依存しないため、SDKもAPI呼び出しもありません。Builder.ioは、リクエストの経路に入ることなく、デザインツールとして引き続き役立ちます。

  • はい。Visual Copilotはデザインから構造化されたReactを生成し、それがまさにtransjtが想定する入力です。最もきれいな結果を得るには、サーバーサイドレンダリングなしのReactとViteでエクスポートしてください。

  • はい。だからこそ、transjtはデザインを埋め込むのではなく変換します。transjtは編集可能なフィールドを持つモジュールを出力するので、文章、画像、セクションの順序はすべて、HubSpotのドラッグ＆ドロップエディターで変更できます。

  • transjtが変換するのはフロントエンドだけで、コンテンツのレコードには触れません。デザイン内のテキストや画像は移行されますが、Builder.ioのデータとしてモデル化されているものは、別途HubSpotへ移行する必要があります。通常はページまたはCRMオブジェクトとして移行します。

  • 生成されたコードがGitHubに入れば、ページ数にもよりますが、transjtは通常数時間で、公開できるHubSpotテーマを用意します。

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

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

無料で始めるデモを予約