AI

AI関連の実装記事を集めたタグ。AI時代のWeb制作完全ガイド、Claude Codeコマンド一覧、AI時代に本当に必要なVSCode拡張機能など、AIとWeb制作を融合する実践記事をまとめています。AI×Web制作の全体像はAI時代のWeb制作完全ガイドもどうぞ。

全43件の記事中、1-30件を表示

Claude CodeでAfter Effectsを自動化|テロップ5本をaerenderで一括書き出し

Claude CodeでAfter Effectsを自動化|テロップ5本をaerender...

Claude CodeでAfter Effectsを自動化するには、Claude CodeにExte...
続きを読む
Google AI Studioでできること|無料でナレーションを作ってみた

Google AI Studioでできること|無料でナレーションを作ってみた

Google AI Studioとは、GoogleのAIモデル「Gemini」をブラウザ上で無料で試...
続きを読む
AI動画の前にプリビズを作る|Claude CodeでCozyClayを動かす

AI動画の前にプリビズを作る|Claude CodeでCozyClayを動かす

プリビズ(プレビズ/previs)とは、本番の撮影や生成の前に、仮の3Dで人物の立ち位置・動き・カメ...
続きを読む
VOICEVOXでナレーションを自動で入れる|動画の尺に合わせて速さを調整

VOICEVOXでナレーションを自動で入れる|動画の尺に合わせて速さを調整

VOICEVOXで動画にナレーションを自動で入れるには、台本をカットごとに分けてVOICEVOXエン...
続きを読む
Claude CodeでBlenderを動かしWebに載せる|glb書き出しとthree.js再生

Claude CodeでBlenderを動かしWebに載せる|glb書き出しとthree....

Claude CodeでBlenderを動かしてWebに載せるには、動きをPythonスクリプトで組...
続きを読む
YouTube Data APIで動画アップロード|Claude Code×Pythonで予約公開まで自動化

YouTube Data APIで動画アップロード|Claude Code×Pythonで...

YouTube Data APIで動画をアップロードするには、Google CloudでOAuthク...
続きを読む
AIでMV・CMを作る|曲・歌声・ナレーションまで1回の生成で出す

AIでMV・⁠CMを作る|曲・⁠歌声・⁠ナレーションまで1回の生成で出す

AIでMVを作るには、曲の雰囲気・歌詞・歌う人の見た目・カメラの流れを1つの文章に書き、音声付きで生...
続きを読む
Seedance 2.5の作例|ショートドラマと動画バナーをプロンプト付きで公開

Seedance 2.5の作例|ショートドラマと動画バナーをプロンプト付きで公開

Seedance 2.5は、文章や画像から音声付きの短い動画を作れる動画生成モデルです。この記事では...
続きを読む
MiniMax H3の作例検証|キャラを保ったまま画風を変えてMV・CMを作る

MiniMax H3の作例検証|キャラを保ったまま画風を変えてMV・⁠CMを作る

MiniMax H3は、画像・動画・音声を参考素材として渡し、その人物や世界観を保ったまま短い動画を...
続きを読む
Claude Codeで複数プロジェクトを管理する|AIと人間の共同管理ダッシュボード

Claude Codeで複数プロジェクトを管理する|AIと人間の共同管理ダッシュボード

Claude Codeで複数プロジェクトを管理するときは、「どこで何が動いていて、どれが人間の判断を...
続きを読む
社内ポータルをClaude Codeで自作する|チームボードの作り方と公開前チェック

社内ポータルをClaude Codeで自作する|チームボードの作り方と公開前チェック

社内ポータルの自作とは、チームの連絡や情報共有に使う社内向けのWebサイトを、SaaSを契約せずに自...
続きを読む
動画のショットの種類一覧|伝わる印象とAI動画プロンプトの書き方

動画のショットの種類一覧|伝わる印象とAI動画プロンプトの書き方

ショットの種類とは、動画の1カットを「被写体をどのくらいの大きさで映すか」「どの高さ・向きから撮るか...
続きを読む
AI画像で商品バナーは作れるか|DomoAIで日本語と価格表記を検証

AI画像で商品バナーは作れるか|DomoAIで日本語と価格表記を検証

AI画像で商品バナーは作れます。DomoAI の GPT Image 2.5 Sunburst に、...
続きを読む
AI動画のカット割りの作り方|シーン表を作って1シーンずつ生成する

AI動画のカット割りの作り方|シーン表を作って1シーンずつ生成する

AI動画のカット割りとは、1本の動画を複数のショットに分け、ショットごとに秒数・カメラワーク・セリフ...
続きを読む
Seedance 2.5はどこで使える?提供経路別の違いと選び方

Seedance 2.5はどこで使える?提供経路別の違いと選び方

Seedance 2.5とは、ByteDanceの研究チーム「ByteDance Seed」が202...
続きを読む
ComfyUIとは?無料の範囲・動作環境・ライセンスを始める前に整理

ComfyUIとは?無料の範囲・⁠動作環境・⁠ライセンスを始める前に整理

ComfyUIとは、画像や動画を生成するAIモデルを、ノード(処理の部品)を線でつないで動かす無料の...
続きを読む
Fireflyは自分の契約でどこまで使えるか|生成クレジットの上限と超過後

Fireflyは自分の契約でどこまで使えるか|生成クレジットの上限と超過後

生成クレジットとは、Adobeの生成AI機能を使うたびに減っていく、月ごとの持ち点です。付与数は契約...
続きを読む
DESIGN.mdとは|AIが作るUIを「それっぽい」で終わらせない設計ファイル

DESIGN.mdとは|AIが作るUIを「それっぽい」で終わらせない設計ファイル

DESIGN.mdとは、AIコーディングエージェントにデザインの判断基準を渡すためのファイル仕様です...
続きを読む
AI社員の職種一覧|1人会社が実際に配属できる仕事とその境界

AI社員の職種一覧|1人会社が実際に配属できる仕事とその境界

AI社員とは、Claude Code のサブエージェント機能を使って、業務ごとに専任のAIを定義し、...
続きを読む
DomoAIとは|料金プラン・使える機能・クレジットの仕組みを整理

DomoAIとは|料金プラン・⁠使える機能・⁠クレジットの仕組みを整理

DomoAI(ドモAI)とは、シンガポールの DOMOAI PTE. LTD. が提供する、ブラウザ...
続きを読む
TikTok ShopのAI動画はどこまで作れるか|DomoAIで4本検証

TikTok ShopのAI動画はどこまで作れるか|DomoAIで4本検証

TikTok Shop の商品動画を AI で作るとき、映像そのものは商品を映しても崩れません。化粧...
続きを読む
ClaudeでPhotoshopを操作する2つの方法|公式コネクタとExtendScript

ClaudeでPhotoshopを操作する2つの方法|公式コネクタとExtendScrip...

ClaudeからPhotoshopを操作する方法は2つあります。コードを書かずに済ませるなら、Ado...
続きを読む
AI動画生成は指示の出し方で9割決まる|DomoAIで6本検証

AI動画生成は指示の出し方で9割決まる|DomoAIで6本検証

AI動画生成の出来を決めているのは、モデルの性能よりも指示の粒度です。同じツール・同じ尺・同じ解像度...
続きを読む
画像を高画質化する無料ツール|ボケ補正・AI超解像に対応

画像を高画質化する無料ツール|ボケ補正・⁠AI超解像に対応

画像高画質化ツールとは、小さい画像やピントの甘い写真を最大4倍まで大きくしながら、輪郭と細部を補って...
続きを読む
生成AIで写真から動画を作る|無料枠で3本作って本番サイトに載せた

生成AIで写真から動画を作る|無料枠で3本作って本番サイトに載せた

生成AIの無料枠を使えば、手持ちの写真から数秒の動画を作ってWebサイトやSNSに載せられます。ただ...
続きを読む
MCPサーバーの作り方|Claude Codeから呼べる自作ツールを実装する

MCPサーバーの作り方|Claude Codeから呼べる自作ツールを実装する

MCPサーバーの作り方は、公式SDKでツールを1つ定義して、Claude Codeに登録するだけです...
続きを読む
Claude CodeのMCP連携ガイド一覧|Figma・WordPress・Chrome DevTools・Notion

Claude CodeのMCP連携ガイド一覧|Figma・⁠WordPress・⁠Chrome...

Claude Codeは、MCP(Model Context Protocol)を通じてFigma・...
続きを読む
Chrome DevTools MCPの使い方|Claude Codeにブラウザ実測・デバッグさせる方法

Chrome DevTools MCPの使い方|Claude Codeにブラウザ実測・⁠デバ...

Chrome DevTools MCPとは、Claude CodeなどのAIコーディングエージェント...
続きを読む
NotionとClaude Codeを連携する方法|公式MCPで仕様書・タスクを開発コンテキスト化する

NotionとClaude Codeを連携する方法|公式MCPで仕様書・⁠タスクを開発コンテ...

NotionとClaude Codeは、Notion公式のリモートMCPサーバー「Notion MC...
続きを読む
WordPressとClaude Codeを連携する方法|公式MCP Adapterでサイトを操作するワークフロー

WordPressとClaude Codeを連携する方法|公式MCP Adapterでサイ...

WordPressとClaude Codeは、WordPress 6.9でコアに搭載された「Abil...
続きを読む