Rabee UIを用いて開発したプロダクト「Formee」をリリースしました

Rabeeが提供中のSvelte × Tailwind CSSのUIコンポーネント集「Rabee UI」を全面的に活用し、プロダクトを開発。自社プロダクトでは初めてのRabee UIの実運用事例です。

株式会社Rabee

2025年12月24日 14時06分

株式会社Rabee（本社：東京都渋谷区、代表取締役：上松勇喜、以下「Rabee」）は、フォーム作成・公開・管理サービス「Formee」をリリースしました。Formeeは、Rabeeが提供中のSvelte × Tailwind CSSで構築したUIコンポーネント集「Rabee UI」を全面的に用いて開発されています。

「Formee」LPはこちら

■ Rabee UIとは

Rabee UIとは、2025年3月よりRabeeが開発・運用しているSvelte × Tailwind CSSで構築されたUIコンポーネント集です。一般的なUIライブラリとは異なり、カスタマイズを前提とした「コンポーネントの種」であることが特徴です。

現在、36種類のUIコンポーネントと3種類のサンプルを公開中です。ButtonやInputなどの基本的なコンポーネントに加えて、HeaderやSidebarなどの画面構築に役立つサンプルも提供しています。

■Rabee UIの特徴

・Svelte × Tailwind CSSで柔軟にカスタマイズできる

・コンポーネント単位でコピー＆ペーストして導入できる

・ダークモード・ライトモードに対応

・日本語利用を前提としたデザイン

・コードと一致したFigmaデータも公開中

■ Rabee UIを用いて開発したプロダクト「Formee」について

プロダクトの概要

Formeeは、フォームの作成・公開・回答管理を円滑にするフォーム作成サービスです。9種類の入力項目を自由に組み合わせることができ、要件に応じたフォームを、誰でも手軽に作成することができます。

開発にあたり、全面的にRabee UIを使用しました。自社プロダクトにおけるRabee UIの初の本格的な実運用事例です。

開発に至った背景

フォームは、企業活動において採用応募、問い合わせ、イベント申し込み、社内申請などさまざまなシーンで利用されます。Rabeeにおいても複数のフォームサービスを使い分けていましたが、運用フローが煩雑になりやすく、一元管理の必要性を感じていました。

複数のサービスを比較・検討するうちに「理想の要件をすべて満たすサービスを探すより、Rabee UIを活用して自分たちで作ったほうが速い。かつ楽しくなりそう」という考えに至り、Formeeの開発を開始しました。

Formeeの主な機能

Formeeでは以下の機能を実装しました。合計の画面数は、ステータスが異なる画面やモーダルも含めると60画面以上にのぼります。

■主な機能

・フォームの作成・編集・公開・削除

・フォームの下書き保存

・チーム作成

・チームメンバー招待

・回答のステータス管理

・回答へのメモ機能

■ Rabee UIで開発したことによるメリット

幅広い機能と多くの画面数を持つFormeeですが、Rabee UIを用いて開発したことで、以下のようなメリットがありました。

要件整理がスピーディーに完了できた

コードと一致したFigmaデータを完備しているRabee UIを用いることで、ワイヤーフレームの段階からほとんど実装と同じレベルのUIデザインを作りながら要件を決められました。

「この体験にはどんなUIが最適か」「MVP段階ではどんな機能までカバーするか」といったすり合わせも、早い段階から具体的に行うことができました。結果として、要件定義〜実装のフェーズにおいて、チーム全体の認識のずれを減らすことができました。

画面数が多くてもUIの一貫性を保つことができた

Rabee UIのコンポーネントを組み合わせて画面を構築することで、画面数が多いプロダクトであってもUIに統一感をもたせることができました。また、開発途中で機能を追加するときにも「UIを0から考える」時間はほとんど必要なく、一貫性のあるUIを素早く構築することができました。

実装のコストを大幅に抑えられた

基本的なUIコンポーネントが揃っているRabee UIを使うことで、多くのUIコンポーネントは0から実装する必要がなく、開発のコストを大きく削減できました。かわりに、プロダクトの品質向上に時間を費やすことができました。プロジェクト開始から実装完了まで6週間のスケジュールで、フォームの作成・公開・管理に関わる基本機能を一通り揃えたプロダクトをつくることができました。