Teleporthq

Teleporthqとは何ですか？

TeleportHQは、AI支援のローコード環境で静的WebサイトやUIコンポーネントを構築・公開できるプラットフォームです。デザイナーや開発者が視覚的なドラッグ&ドロップ操作とリアルタイムプレビューを活用し、迅速にプロトタイプから本番用コードへ移行できます。

Teleporthqの特徴は何ですか？

• AIによるレイアウト生成

  プロンプト入力により、目標やスタイルに基づいたサイトの構造と複数のデザインバリエーションを自動生成します。
• Figmaからのコード変換

  Figmaプラグインを通じてデザインをエクスポートし、TeleportHQ上で直接コードに変換して実装を開始できます。
• HTML/CSS/JSへの無料エクスポート

  5つのJavaScriptフレームワーク向けに、本番利用可能なソースコードを無料でダウンロードし、他社ホスティングへ移行可能です。
• ヘッドレスCMS統合

  UI作成とビジネスロジックを分離し、外部のヘッドレスCMSからデータをインポートしてコンテンツ駆動型のデザインを実現します。
• Vercel経由のワンクリックデプロイ

  カスタムドメインの設定後、グローバルなパーソナライズされたコンテンツ配信に対応した即座のデプロイが可能です。

Teleporthqの使用例は何ですか？

• フロントエンドチームの設計〜開発連携

  デザイナーと開発者が同一プラットフォームで作業し、GitHubとのバージョン管理統合を通じて、設計から機能するプロトタイプへのハンドオフ時間を短縮します。
• マーケティングチームによる高速なページ修正

  マーケティング担当者がコードを書かずに、既存のデザインシステム内のコンポーネントライブラリを用いて、コピーや配色などのコンテンツ変更を即時反映できます。

Teleporthqの使い方は？

1. プロジェクト開始

   Webエディタ内で、サイト構築の目標やスタイル設定を含むプロンプトを入力し、AIが生成したレイアウトを選択します。
2. デザイン調整

   ドラッグ&ドロップツールを使用し、セクション、フォント、色、UI要素を視覚的に微調整します。
3. データ接続

   ヘッドレスCMSからコンテンツをインポートするか、フォームを作成して訪問者からのリード収集を設定します。
4. プレビュー確認

   リアルタイムプレビュー機能で、異なるデバイスにおけるレスポンシブな表示結果を確認します。
5. 公開または出力

   ワンクリックでVercel等のカスタムドメインへデプロイするか、HTML/CSS/JS形式でコードをエクスポートします。

Teleporthqの価格情報：

• Freeプラン

  基本機能の利用が可能であり、フォーム数は制限されます。
• Proプラン

  フォームを最大10個まで作成でき、月間2,000件のサブミッション（送信）上限が付与されます。