本文へスキップ
企画・演出

NEXAGEN Website Studio

アイデアから本物のウェブサイトまで。PRIME がデザインし、画像・映像ビジュアルを作り、レスポンシブなウェブとコードを Next.js・React・HTML 形式で仕上げます。

サイトの目的とユーザーを先に分析し、情報設計、ビジュアル方針、デザインシステム、コンポーネント計画を立ててから React·Next.js のコードを書きます。モーション・インタラクション、レスポンシブ、アクセシビリティ、SEO、パフォーマンスを確認したビルド可能なコードと引き継ぎ手順を会話の中で提供します。必要に応じて、NEXAGEN の動画・画像ワークフローでヒーロー・背景動画やセクション用ビジュアルを見積もり確認後に作成します。NEXAGEN はサイトを直接ビルド・プレビュー・デプロイしません。実際のブラウザ確認とホスティングはご自身の環境で行います。

クレジットを使用する場合あり

使う場面

このような場合に使います

  • 新しいSaaSランディングページをデザインして制作して
  • このNext.jsプロジェクトのホームページをリニューアルして
  • モバイルまでレスポンシブ対応のポートフォリオを作って

このような場合は他の Skill を使います

NEXAGEN で使用する機能

  • サイト目的の分析・情報設計・デザインシステム
  • React·Next.js のページとコンポーネントのコード
  • モーショングラフィックス · インタラクション
  • レスポンシブ・アクセシビリティ・SEO・パフォーマンス確認
  • ウェブサイト用ビジュアル映像生成
  • ビルド可能なコードと引き継ぎ手順

動作の流れ

Skill のポリシーで定義された実際の順序です。

  1. 1サイトの目的・ユーザー分析
  2. 2情報設計（サイトマップ）
  3. 3ビジュアル方針・デザインシステム
  4. 4［任意］サイト用動画の企画 → 見積もり → 承認 → 生成
  5. 5ページ構成・コンポーネント計画
  6. 6React·Next.js 実装
  7. 7モーショングラフィックス・インタラクション
  8. 8レスポンシブ・アクセシビリティ・SEO・パフォーマンス確認
  9. 9ビルド QA
  10. 10コードと動画埋め込みガイドの引き継ぎ

リクエスト例

コピーしてそのまま AI アプリに貼り付けられます。

  • 新しいSaaSランディングページをデザインして制作して

  • このNext.jsプロジェクトのホームページをリニューアルして

  • モバイルまでレスポンシブ対応のポートフォリオを作って

  • スクロールインタラクションのあるブランドサイトを設計して

  • このReact画面のデザインとパフォーマンスを改善して

  • ウェブサイト用の背景映像とヒーローセクションを一緒に作って

  • モーショングラフィックス効果のあるSaaSランディングページを制作して

使用する NEXAGEN MCP Tool

Tool役割コスト
get_account補助無料
get_mcp_policy補助無料
get_job補助無料
get_result補助無料
wait_for_job補助無料
estimate_video補助無料
generate_video補助有料
create_storyboard_plan補助無料
apply_cinematic_control補助無料
create_workspace_image補助有料
generate_cinema_video補助有料
estimate_music補助無料
generate_music補助有料
estimate_voice補助無料
generate_voice補助有料

クレジットについて

クレジットを使用する場合あり

設計とコード作成は会話（選択したモデル）の使用量のみです。ウェブサイト用の動画・画像・音楽・音声の生成は有料で、見積もり確認と承認の後にのみ実行します。

Skill のインストールは無料です。クレジットは有料の生成を実行したときにのみ NEXAGEN アカウントから差し引かれます。

現在の対応範囲

現在公開されている Tool に基づく注意点です。

  • NEXAGEN にはファイル作成・コード実行・ブラウザプレビュー・デプロイの Tool がないため、コードは会話の中で提供され、ビルド・プレビュー・ホスティングはご自身の環境で行います。
  • 実際のブラウザ QA（デスクトップ・タブレット・モバイル、コンソール、ネットワーク）は引き継ぎチェックリストでご確認ください。
  • 認証・決済・データベースなどのバックエンドは契約（インターフェース）設計までの対応です。

プラットフォーム別のインストール

ダウンロード

NEXAGEN Complete Skills Pack

他の Skill が担当するリクエストもあわせて処理するには、Complete Pack をおすすめします。

すべての Skills をダウンロード

nexagen-skills-complete-1.2.0.zip479.3 KB

チェックサムを表示 (SHA256)

ダウンロードしたファイルの SHA256 値が以下の値と一致するか確認してください。

7613259ef38d10d772d9fe49c51b24872004db6aa624f2c11c76f434eb1934bb

この Skill のみダウンロード

この Skill のフォルダー、共通ポリシー、Skill のドキュメントが入っています。

この Skill のみダウンロード

nexagen-skill-website-builder-1.2.0.zip168.4 KB

チェックサムを表示 (SHA256)

ダウンロードしたファイルの SHA256 値が以下の値と一致するか確認してください。

c8d4cd455b2c5238a106545fbbe7756a76b5d32c911078b1967295825f753645

関連する Skills

よくある質問

NEXAGEN でそのままサイトをデプロイできますか？
いいえ。現在 NEXAGEN にはデプロイ Tool がありません。ビルド可能なコード、インストール・ビルドコマンド、ホスティングの案内をお渡しし、ご自身の環境でデプロイします。
どのモデルが使われますか？
PRIME でご自身が選んだ高度なモデルがそのまま使われます。自動モードでは作業に合ったモデルが 1 つ選ばれ、毎回 2 つのモデルを同時に使うことはありません。
サイト用の動画も作れますか？
はい。ヒーロー・背景動画やセクション用ビジュアルを NEXAGEN の動画・画像ワークフローで作成できます。生成前に予想クレジットを表示し、承認後に実行します。
すべての Skills