ToolMage
ログイン

Shapeは、デザイナーとプログラマーのためのAgentic IDEです。デザイン・コード・Git・AIエージェントチャットを1つのデスクトップワークスペースに統合し、ライブビジュアル編集とソースコード同期を実現します。

5.0
Added
2026-08-20
Price type:
Freemium
Monthly traffic:
97

Shape Overview

Shapeは、デザイナーとプログラマーのために設計されたAgentic IDEです。ライブビジュアルデザイン、ソースコード編集、Gitワークフロー、AIエージェントチャットをひとつのデスクトップワークスペースに統合し、設計からリリースまでのプロセスを一貫して行えます。ライブプレビューでページ上の要素をクリックし、サイドバーでレイアウト、塗り、タイポグラフィ、角丸などのデザイントークンを調整して、変更をソースファイルに直接書き戻せます。デザインツール、ブラウザプレビュー、ターミナルの間を行き来する必要はありません。

Shapeの使い方

デスクトップアプリを開いてプロジェクトを読み込みます。ライブプレビューで要素をクリックし、サイドバーでデザイン属性を調整して、ソースコードに適用します。エージェントパネルを使うと、エディタから離れずにウェブ検索、ドキュメント参照、ファイルの読み書き、チェック実行ができます。Gitグラフ、Pull Request、コードブロックのステージングも同じワークベンチで利用でき、コードレビューとコミットをスムーズに行えます。設定はアクティビティバーの歯車アイコン、タイトルバーのSettings、Window → Settingsメニュー、またはCtrl+,ショートカットで開けます。

Shapeの主な機能

  • ライブビジュアルデザイン編集:プレビューで要素をクリックし、サイドバーで調整してソースに適用
  • AIエージェントチャット:1つのスレッドで検索・読み取り・編集・チェック実行
  • エディタ内蔵のGitグラフ、PRディスカッション、Checks、CIワークフロー
  • diffのハンク単位でのステージング/ステージング解除
  • レイアウト、塗り、タイポグラフィ、角丸などのデザイントークンをサイドバーに表示
  • ソースコード上で直接使えるカラースウォッチ、スクラバー、レイアウトパネル
  • サインアップ数、使用量、収益を追跡する分析ダッシュボード
  • ローカル優先の設定・ファイル保存、主要なWebプログラミング言語とフレームワークに対応

Shapeの使用例

Shapeは、デザインの再現性とコード品質の両方が求められるWebアプリケーションチームに最適です。デザインエンジニアはライブビジュアルフィードバックを活用してピクセル単位のUIを実装でき、フロントエンド開発者はAIエージェントの支援を受けながらリファクタリングし、コミット前にdiffをレビューできます。プロダクトチームはデザイン・コード・Gitレビューを1つのツールで完結でき、フリーランサーや小規模チームは追加プラットフォームなしで分析ダッシュボードから登録数・使用量・収益を確認できます。

Shapeの利点

Shapeの最大の利点は集中性です。デザイン、コード、Git、エージェントチャットがひとつのデスクトップワークスペースに集約されています。「Apply to source」ワークフローはデザインと実装のギャップを縮め、エージェントは1つの会話スレッドでコンテキストを維持します。ローカル優先の設計により、設定とファイルは自分のマシンに保存され、データを自分で管理できます。料金は無料プランと月額クレジット制で透明性が高く、ニーズに合わせて選択できます。

料金プラン

Shapeは無料プラン(月額$0)を提供しており、Autoモデル、毎月のAutoトークンプール、ローカル優先のデスクトップエディタが含まれます。Plusプランは月額$15で、450クレジット/月、全モデル解放、商用利用、ダッシュボードでの使用量追跡を提供します。Proプランは月額$50で、1500クレジット/月、全モデル解放、より高いクレジットプールと優先サポートを提供します。Maxプランは月額$150で、4500クレジット/月、全モデル解放、最大のクレジットプールと優先サポートを提供します。

Shape FAQ

Shape Comments (0)

Sign in to comment.

ログイン

No comments yet.

Shape Categories

Shape Tags

Shape Jobs

Shape AI Tool Comparisons

Shape Embed Widget

Copy this embed code to place the badge on your blog, article, or product site and send readers directly to this ToolMage detail page.

ToolMageFOLLOW US ON0