Projekt
Projekt · 画像 · コーディング
Projektは、AIコーディングエージェントで開発する人のためのビジュアルワークスペースだ。Claude Code、Codex、Gemini CLI、Opencodeといったツールを、ライブプレビューと編集可能なDOMを備えた一つのインターフェースにまとめる。作りたいものを平易な言葉で説明し、エージェントがコードを書くそばからページが更新されるのを見て、あとは任意の要素をクリックして手作業で調整する。売りはシンプルだ。プロンプト中心の開発スピードを保ちつつ、結果への直接的なコントロールを手放さない。

Projekt について
Projektとは
Projektは、プレビュー、編集可能なDOM、そして選んだコーディングエージェントを同じウィンドウに置く、デスクトップ型のAIコーディングワークスペースだ。すでに料金を払っているエージェントを接続し、Projektをプロジェクトフォルダに向けて、自然言語で変更を説明し始める。それだけだ。
解決する問題は単純だ。「エージェントがコードを書いた」と「ページが正しく見える」の間には隔たりがある。ほとんどのAIコーディングツールはターミナルやエディタで止まる。Projektは会話の隣で動くブラウザプレビューを保つ。変更は即座に現れるので、diffを読む代わりに目で判断できる。
最大の制約は、Projekt自体がコーディングエージェントではないことだ。独自のモデルを持たない。まったく持たない。自分のエージェントと自分のAPIキー、あるいはサブスクリプションを持ち込む。Claude CodeやCodexのような環境がすでになければ、Projektは単体ではあまり役に立たない。また、まずWebフロントエンドを対象にしたワークスペースだ。作業の中心がバックエンドやモバイルなら、プレビューの恩恵は小さくなる。
はじめかた
- Projektをインストールし、使いたいAIコーディングエージェント(Claude Code、Codex、Gemini CLI、Opencodeなど)を追加する。
- それらのエージェント用に、自分のAPIキーまたはサブスクリプションを接続する。
- Projektを既存のフォルダに向けるか、プロンプトから新しいプロジェクトを始める。設定も定型コードも要らない。
- 望む変更を説明し、エージェントがコードを書くそばからライブプレビューが更新されるのを見る。
- 任意の要素を選び、インラインで編集するかスタイルを視覚的に調整し、コミットしてデプロイする。
AIツール情報
Projektの料金、対応プラットフォーム、性能を簡単に確認できます。
こんな人におすすめ
このツールが最も力を発揮するユーザー、タスク、シーン。
ユーザー
- プロンプトは書けるがコードエディタに住みたくないプロダクトデザイナー:Projektなら結果を視覚的に形作れるので、余白や書体、レイアウトをページ上で直接判断できる。
- すでにコーディングエージェントに課金しているフロントエンド開発者:既存のClaude CodeやCodexの環境をそのまま使い、その上にライブプレビューを載せられる。
- ランディングページを出す創業者や個人開発者:プロンプト中心の流れで使えるページを素早く立ち上げ、面倒な細部は編集可能なDOMが引き受ける。
タスク
- Web UIを作って反復する:セクションを説明し、描画されるのを見て、見栄えが整うまで要素を動かす。
- 既存サイトを手直しする:フォルダを開き、エージェントに変更を頼み、コミット前にプレビューで確認する。
- ざっくりした案からレイアウトを試作する:まずワイヤーフレームを描く代わりに、プロンプトから始めてブラウザで詰める。
シーン
- ランディングページをローンチへ押し進め、デプロイ前に細かな見た目を直す。同じウィンドウでインライン編集してコミットできるからだ。
- 今日中にクリックできるものが要る、急ぎの顧客デモ。完全なデザイン仕様ではない。
- 引き継いだコードベースの整理。自分が書いていないdiffを読むより、各変更をライブで見るほうが勝る。
主な機能
自分のエージェントを持ち込む
Projektはモデルを同梱しない。ログインして、すでに使っているコーディングエージェント(Claude Code、Codex、Gemini CLI、Opencodeなど)をインストールし、自分のキーを接続する。後でエージェントを替えてもワークスペースは同じままだ。そこが要点だ。
リアルタイムプレビュー
エージェントの変更は、コードが書かれるそばからライブプレビューに現れる。ビルドを待つ必要はない。ブラウザを更新する必要もない。ページが一歩ずつ形になるのを見られるので、エージェントが要求を取り違えたときにすぐ気づける。
編集可能なDOM
プレビュー中のページで任意の要素を選び、直接編集したり、スタイルを手作業で調整したりできる。純粋なチャット・トゥ・コードのツールに勝る点はここだ。エージェントがほぼ最後まで連れて行く。残りは別のプロンプトを書くのではなく、視覚的に仕上げる。
プロンプト中心のインターフェース
主な作業のしかたは、欲しいものを説明することだ。そして眺める。インターフェースはあなたのプロンプトとエージェントの動きを並べるので、プロジェクトを分析し、コンポーネントを作り、スタイルを書く各段階が進行するままに見える。
設定も定型コードも不要
Projektを任意のフォルダに向けてすぐ作業を始められるし、プロンプトから新規プロジェクトを立ち上げてもいい。足場作りの手順はない。先に埋める設定ファイルもない。既存のコードベースに入るハードルを下げる。
内蔵のGitとデプロイ
結果が見栄えよく整ったら、Projektが変更ファイルを表示し、同じウィンドウからコミットできる。そのままデプロイへ進むのが狙いだ。バージョン管理をプレビューの隣に置くことで、「これで良さそう、出そう」という瞬間をコンテキストスイッチで失わない。
メリットとデメリット
メリット
- ライブプレビューと編集可能なDOMが、プロンプト中心の流れと最後の見た目調整の両方を一か所でまかなう。
- すでに使い料金を払っているエージェントで動くので、モデル層に新しいサブスクリプションは要らない。
- 設定も定型コードもなくどのプロジェクトフォルダでも開けるので、実務で試しやすい。
- Gitの変更がワークスペースで見えるので、プレビューを承認した直後にコミットできる。
デメリット
- 内蔵モデルがないため、別のコーディングエージェントとそのキーなしではまったく使えない。初心者には設定の手間が増える。
- プレビュー駆動の流れはWebフロントエンド向けなので、バックエンド寄りやモバイルのプロジェクトでは得るものが少ない。
- ツールは登場したばかりで公開されている料金の詳細が不明瞭だ。契約前に公式サイトで現在のプランと対応プラットフォームを確認すべきだ。
よくある質問
Projektは、AIコーディングエージェントでWebフロントエンドを作るためのビジュアルワークスペースだ。エージェントに変更を頼み、ライブプレビューを見て、要素を直接編集してページを詰める。
関連コンテンツ
Projektに関連するツール、スキル、記事を探す。
Projektの代替ツール
X Ray Interpreter
X-ray Interpreter · 画像X Ray Interpreter は、X 線、CT、MRI、超音波、PET の画像を平易な言葉のレポートに変えるウェブベースの AI 放射線ツールだ。スキャン画像をアップロードすると、X 線の予備的な読影結果がすぐに返ってくる。説明が必要な箇所があれば、その後で追加の質問もできる。位置づけはセカンドオピニオンと学習の補助であり、医療診断ではない。
Aieasypic
AIEasyPic · 画像AIEasyPicは、単純なテキストプロンプトを数秒で完成したアート作品に変えるAI画像生成ツールだ。自分の写真でカスタムモデルを訓練したり、既存の画像の顔を交換したり、テキストから短い動画クリップを作ったりもできる。すべてブラウザだけで完結する。手早くビジュアルが欲しい気軽なクリエイターにも、コードを一切触らずに個人モデルを作りたい趣味の人にも向く。
Chargen
Chargen · 画像ChargenはDungeons & Dragonsやその他のテーブルトークRPG向けに作られたAIキャラクター生成ツール兼ワールドビルディングツールキットだ。一行のアイデアを描き上げたキャラクター肖像に変え、同じセッションでNPC、モンスター、マップ、遭遇を生み出し、すべてのクリーチャーの詳細を手元に置く。テーブルトークRPGアートの部分はGoldと呼ばれるクレジット制で動き、テキスト生成ツールは誰でも無料のまま使える。
