floors.js
floors.jsは、訪問者がアバターとして表示され、ページ間を歩き回り、摩擦なくリアルタイムでチャットできる、あらゆるウェブサイトをインタラクティブな3Dソーシャルスペースに変えます。
floors.jsとは?
floors.js — あなたのウェブサイトをハボホテルに変える
floors.jsとは?
floors.jsは、単一のJavaScriptコードを挿入するだけで、リアルタイムで永続的なソーシャルインタラクションを既存のウェブサイトに直接注入する革新的なスクリプトです。静的なウェブページを、クラシックなソーシャルゲーム「ハボホテル」を彷彿とさせる、探索可能なアイソメトリック3Dルームに変換します。訪問者はコンテンツを一方的に消費するのではなく、実体のある3Dアバターとなり、お互いの姿を見たり、ページ(ルーム)間を移動したり、ドメイン上で直接ライブ会話に参加したりできます。これにより、ウェブサイトのエンゲージメントは一方的なブロードキャストから、永続的で共有されたデジタルスペースへと根本的に変わります。
このツールは、高い直帰率と取りこぼされた訪問者の意図という重大な問題を解決します。あなたのサイトを単なるドキュメントではなく「場所」にすることで、floors.jsはあなたがその場に存在し、即座のサポートを提供し、自発的なフィードバックを収集し、真のコミュニティの雰囲気を作り上げることを可能にします。バックエンドの設定、SDKの統合、複雑な設定は一切不要です。スクリプトタグをドロップするだけで、あなたのサイトは瞬時に存在感で活気づきます。
主な特徴
- 瞬時の3Dプレゼンス: 訪問者は到着するとすぐに、ランダムな名前を持つブロック状の3Dアバターとして表示され、サインアップの手間を排除します。他の訪問者をリアルタイムで確認できます。
- アイソメトリックルームマッピング: サイトの各ページは、床と壁を備えたユニークで探索可能なアイソメトリックな部屋のレイアウトとして自動的にマッピングされます。
- リアルタイムナビゲーション: アバターはクリックした場所まで床を歩きます。ルーム間の遷移はシームレスで、ナビゲーションの変更(React、Next.js、VueなどのSPAに対応)によって自動的に検出されます。
- 摩擦のないチャット: メッセージはアバターの上に浮かぶ吹き出しとして表示されます。訪問者がコンテンツを積極的に閲覧している間に、直接チャットで会話できます。
- ゼロコンフィグレーションセットアップ: スクリプトはナビゲーションリンク(
<nav>)を自動的にスキャンしてルームを定義します。静的サイト、WordPress、Shopify、最新のJavaScriptフレームワークで普遍的に機能します。 - プライバシー重視: クッキーやIPアドレスのロギングは行わず、ローカルに保存されるランダムな仮名のみを使用します。デフォルトでGDPRに準拠するように設計されています。
- カスタマイズオプション: 豊富なデータ属性により、アクセントカラー、表示名、ルームごとの固定ウェルカムメッセージ、オーナーアバターの指定などをカスタマイズできます。
floors.jsの使い方
floors.jsの開始は、基本的な実装のために1つのステップしか必要としないため、信じられないほど迅速かつ簡単になるように設計されています。
- キーの取得: サインアップし、固有の
data-keyを取得します。 - スクリプトの貼り付け: 提供された
<script>タグをウェブサイトのHTML、通常は閉じタグ</body>の直前に挿入します。<script src="https://floorsjs.com/embed.js" data-key="flr_..." ></script> - 自動ルーム作成: スクリプトはすぐにサイトのナビゲーション構造をスキャンし始め、異なるページを個別のチャットルームとして定義します。
- エンゲージメント: ロードされると、あなたと訪問者はアバターが表示されるのを確認できます。ウィジェットアイコン(通常は右下)をクリックしてチャットパネルを開き、同時にサイトの異なる部分を閲覧しているユーザーとの対話を始めることができます。
高度な制御のためには、スクリプトタグにdata-accent(ブランディングに合わせるため)やdata-pinned-message(ルーム固有のアナウンスを設定するため)などのオプションの属性を追加できます。
ユースケース
- Eコマースのサポートとセールス: 静的なライブチャットポップアップに頼る代わりに、営業担当者は「商品ページルーム」を歩き回り、滞在している買い物客に積極的に挨拶し、即座のコンテキストに応じたアドバイスやアップセールの機会を提供できます。
- SaaS/ソフトウェアのドキュメントハブ: テクニカルライターやサポート担当者はドキュメントページを監視できます。ユーザーが複雑なガイドで行き詰まった場合、専門家のアバターが即座に隣に現れて説明を提供し、サポートチケットを削減できます。
- バーチャルイベントとカンファレンス: floors.jsを使用して、標準的なウェブサイトで開催されるバーチャルイベントの永続的なロビーエリアやブレイクアウトルームを作成し、参加者がセッションの合間に視覚的に交流し、ネットワーキングできるようにします。
- ブログ/フォーラムでのコミュニティ構築: トラフィックの多いブログ記事を永続的な集いの場に変え、読者が記事の内容についてリアルタイムで議論できるようにし、コンテンツを中心としたより強いコミュニティ意識を育みます。
- リアルタイムフィードバックの収集: 新しい機能やランディングページを公開し、訪問者が3Dでどのようにやり取りするかを観察します。新しいデザインや機能を初めて体験するユーザーとチャットすることで、即座の定性的なフィードバックを収集できます。
FAQ
Q: 同時接続訪問者とは具体的に何を指しますか? A: 同時接続訪問者とは、同じ瞬間にあなたのサイトにアクティブに接続しているすべてのユーザーを指します。訪問者がタブを閉じるか、ドメインから完全に離脱すると、そのスロットは解放されます。生涯利用プランでは、サイトごとに最大100人の同時接続訪問者をサポートします。
Q: Next.jsやShopifyのような最新フレームワークに対応するには複雑な統合が必要ですか?
A: いいえ。Shopifyや静的サイトの場合、スクリプトタグをテーマのフッターに貼り付けるだけです。Next.jsなどのシングルページアプリケーション(SPA)の場合、floors.jsはルーティングシステム(pushState/popstate)に自動的にフックし、ユーザーが内部でナビゲートする際にルームの変更がシームレスに行われるようにします。
Q: 同時接続訪問者数の上限を超えた場合はどうなりますか? A: 新しい訪問者は待機キューに入れられます。既存の訪問者が離脱すると、すぐに3Dスペースに参加できるようになり、すでに存在しているユーザーが切断されることはありません。
Q: GDPRに準拠していますか? A: はい、floors.jsはプライバシーファーストで設計されています。クッキーを使用せず、IPアドレスを記録せず、一時的なランダムな仮名のみをlocalStorageに保存します。基本的な機能のために明示的な同意プロンプトは必要ありません。
Q: 製品がニーズに合わなかった場合の保証はありますか? A: floors.jsは7日間の返金保証を提供しています。サービスを試用してから最初の1週間で満足いただけなかった場合は、チームにメールで連絡すれば全額返金いたします。
Alternatives
Prompty Town
Prompty Townは、ユーザーがリンクを仮想の建物に変換し、コンテンツを共有し、対話するためのユニークで魅力的な方法を創造する革新的なプラットフォームです。
Make Real
tldraw SDKを使用してUIを描き、実現します。
beehiiv
beehiivは、メール配信、ノーコードウェブサイト構築、オーディエンス拡大、収益化のための統合ツールを提供するオールインワンのニュースレタープラットフォームです。クリエイターやブランド向けに設計されています。
Actor Builder
Actor Builderは、あなたを瞬時に俳優に変え、どんな設定でもどんなキャラクターにもなれるようにします。
Mixels.ai
Mixels.ai は、ユーザーが画像をピクセルアートに変換し、完璧なグリッド整列の 8 ビットスタイルのアバターを作成できる AI 駆動のピクセルアートジェネレーターです。
Fronty
Frontyは、ユーザーが画像からHTMLおよびCSSコードを迅速に生成できるAI駆動の画像からHTML CSSへの変換ツールです。