世界を動かす技術を、日本語で。

Show HN: Rails UI の紹介

概要

Rails UI はデザイン経験がなくても美しいUIコンポーネントを簡単に利用可能。 コピペで使えるフォームやレイアウト でビジネスロジックに集中できる環境を提供。 テーマ機能 によりCSS作業を大幅に短縮。 ユーザーや投資家から高評価を得ている実績。 ニュースレター登録で最新情報を受け取れる案内。

デザイン未経験でも安心のUIコンポーネント

  • Railsに最適化された 美しいフォーム、ボタン、レイアウトの提供
  • コピペだけで導入可能 なUIコンポーネント
  • デザイン作業不要 でビジネスロジックに集中
  • プロ品質の見た目 を即座に実現
  • 豊富なコンポーネント で柔軟な画面構成

テーマ機能でプロフェッショナルな外観

  • CSS作業を省略できる テーマセット
  • Railsアプリにそのまま使える レイアウト
  • ユーザーから高評価 を得やすいデザイン
  • デザインチーム不要 で見栄えの良いアプリを作成
  • 全テーマ一覧ページ で好みのデザインを選択可能

利用者の声

  • 「数ヶ月分の工数削減」 Ruby on Rails初挑戦の経験豊富な開発者 もフロントエンドに悩まず開発可能
  • 「2週間でMVPリリース」 スタートアップ創業者 が投資家にデザインチーム並みの評価を獲得
  • 「納品スピードが大幅向上」 フリーランス開発者 が初案件で元が取れる利便性

ニュースレター登録案内

  • 最新アップデートをメールで配信
  • スパムなし・いつでも解除可能
  • 簡単な登録フォーム で手間なく情報取得

Hackerたちの意見

約1年前に短いRailsのフェーズでこれを使ったんだけど、フレームワーク全体がバッテリー込みなのに、Rails特化のUIライブラリがもっとないのにちょっと驚いた。あの時はtailwindもあんまり理解できてなかったし。今はもうRailsのフェーズじゃないけど、ライブラリの作成お疲れ様!

使ってみてくれてありがとう!UIの面では同意するよ。フレームワークの中で一番「型破り」な部分だと思う。なんか変だなって思ってたけど、アプリがブランドやオーディエンス、市場に合わせて適応する必要があるから、仕方ないのかな。

UIフレームワークを見せるなら、モバイルやiPhoneでページを左右にスクロールしちゃうのは避けたいよね。コンポーネントを見るためにページを下にスクロールしようとしたら、うっかり横スクロールが発動しちゃって面倒だった。

これ直すね、ありがとう!

iPhoneのSafariで壊れてる。例えば:- テーブルを横にスクロールすると背景が左に移動する - テーブルやドロップダウンのアクションがタップしても何も起こらない - ボタンのテキストが選択できる(マジで?)

Safariはほんとに好きだわ。指摘してくれてありがとう。

AIじゃない世界での作業が見れて嬉しいし、Railsにも感謝!ランディングページには、コンポーネントがデモ用であることを明確にするために「例えば」みたいなタイトルを追加した方がいいと思う。ファーストビューがちょっと詰まって見えるから、ユーザーが右上を押すまでログインボックスは外しておいた方がいいんじゃないかな。

同意だね。特にログインボックスの例があって、そのスクリーンショットがデザインの他の部分よりも目立ってるから。デモがランディングページを圧倒するべきじゃないと思う。それにテーマにすぐ入っちゃうし。Railsの開発者ならテーマを見てるんじゃなくて、Railsに合う従来のUIシステムを探してるはずだよ。StimulusやHotwireとかね。私の知る限り、このサイトは特定のユースケースに特化したスキャフォールドの集まりに過ぎないけど、Rails自体はずっとそれができてたから。

コメントありがとう!ログインボックスはちょっと混乱するかもね、もしくは俺が勘違いしてるかも。実際にはログインボックスのUIであって、ログインする場所じゃないんだよね。この部分はもうちょっと整理できると思う。

これは確かにRailsの隙間を埋めてるね。使うのは好きだけど、マジで見た目のいいフロントエンドを作るのが苦手なんだ。Tailwind UIをたくさん使ったけど、ちょっとしたクラスの調整が必要になるから、あんまり気を抜けないんだよね。

最近Open Propsをちょっといじってみたけど、いい中間地点だね!色やフォント、スペーシングなどがうまく組み合わさってるけど、結局は自分で使うかどうかは自分次第なんだよね。(それにCSSを書くことになるから、Tailwindのその部分が好きならちょっと厳しいかも…でも最近のCSSは結構いい感じだよ。)[0] https://open-props.style/

見た目はいいけど、正直言って299ドルとか799ドルを考えるのは難しいな。ThemeForestみたいなところで20ドルか30ドルで美しいテーマを買って、LLMにファイルを解析させてコンポーネントやテンプレートにする方が簡単だし。

もうそんなことする必要もないよ。あのサイトにアクセスして、コンポーネントの見た目をコピーすることができるから。試してみて。見つけたテーマに基づいてテンプレートを作るように頼んで、デモのリンクを見せれば、バン!似たようなものができるよ。

世界のクリエイターたちには悲しいことだね。AIの恩恵は享受してるけど、@justaleverみたいなクリエイティブな人たちには辛いと思う。私たち(開発者)は、数年前にテクノロジーやソフトウェアが未来になるって約束されたんだ。それが急速に変わってきて、もう戻れないね。

それは理解できる。たぶん、あなたには合わないかもね。このプロジェクトではできるだけ人間の要素を残したかったし、AIが私たちの仕事を奪う可能性が高いのは知ってるから、仕方ないよね。アイデアを素早く構築する必要を解決してくれるから、他の人にも役立つかもしれないと思ったんだ。昼間はプロダクトデザイナーで、フロントエンドを作るのが大好きだから、これは情熱的なプロジェクトでもあるんだ。

正直、これらはゼロから作るのはそんなに難しくないよ。

この6ヶ月で3つのRails SaaSプロダクトを立ち上げたけど、全部利益出てるよ。LLMの世界では、こういうのはあんまり価値がない気がする。Claude Codeのプロンプトを使えば、1時間でRailsコンポーネントを使った decentなデザインシステムが作れるし。これからはAIファーストで考えないといけないかもね。これは人間向けに作られてる感じがする。

ここに来た理由はこれだよ:誰か彼に教える人いる?「待って…エージェント使えばすぐにできるじゃん」って思ってるのは俺だけじゃなくてよかった。実際、Context7を使えば、Claudeはこのビジネスモデルを1日で再現できるよ。

もしかして、これを作るのにAIを使ったのかな?でも本当にそうじゃないことを願ってる、自分たちでデザインした部分もあるといいな…新しい人間のデザインが出てこない、2025年以前のデザインをただ再生産する世界に近づいてるのが心配だよ。

個人的には、もしあなたが自分のSaaSを「バイブコーディング」してる感じがしたら、たぶんお金払わないと思う。プロジェクトの見た目や変なバグ、ひどいドキュメントを見れば、すぐにわかるよね。ちゃんと機能して、目立つ見た目のUIには需要があると思う。アーティザナルなコーンフェッドUIって感じかな。

あなたに連絡するチャンスはありますか?そのSaaSについていくつか質問したいんです(悪い意味じゃなくて、ただ学びたいだけです)。

それは理解できる。たぶん、AIにすべてを生成させたくない人もいる未来があると思う。前に別のコメントに返信したけど、これはほとんどAIなしで、基盤となるRuby gemのアーキテクチャの方向性だけだね。

ちょっと検索してみたけど、a11y/カラー/コントラストについて誰も指摘してないみたい。ブランドカラーのアニメーション効果は、コントラストがだいたい1.0くらいだったことが多いね。

うん、効果のためにあまり気にしてなかったね。それは大きなノーだってわかってる。ウェブサイトはあまり焦点じゃなくて、Ruby gemの中身がもっと重要なんだ。railsui.comは、ビルボードみたいなもんだと思ってもらえれば。

うーん、Railsか。UIがちゃんと動くか気になるな。https://railsui.com/componentsを開いてみた。いろんなコンポーネントをクリックしたら、しばらくしたらランダムなコンポーネントに切り替わった。RailsのUIに対する自信は、変わらずって感じ :)

8秒ごとにコンポーネントが切り替わる、まるでカルーセルみたいだね。これでRailsのUIを判断するのはちょっと不公平かもしれないけど、最初の印象としては良くないね。

どうしたらいいかな?カルーセルをやめる?アイデア募集中!

わお、Webcrunchチャンネルの裏にいるのはあなただったんだ!Railsにはあまり詳しくないけど、昔のAffinityの動画は大好きだったよ。あなたはYTでの機能的CSS/Tailwindの初期導入者の一人でもあるし。2018年にTWを知ったのもあなたの動画だったと思う。それはRefactoring UIの本や動画、TWの最初の公式バージョンが出る前だったね。

いやー、昔の話だね!コメントありがとう。長い道のりだったよ :)