
KAWAI
@kawai_design • 44,950 subscribers
AIの情報をわかりやすく毎日発信中|セミナー登壇・動画出演80回以上、法人AI研修8社|著書『AIでゼロからデザイン』重版|Google画像生成プロンプト監修|SHIFT AI デザイン部長/講師|ベイジ AIデザイン顧問|NewsPicksトピックスオーナー|Voicy|デザイナー歴14年|ご相談はWebサイトへ
Shorts
Videos

Webサイトにアニメーションを付けたいけど AI にどう指示をすれば良いか分からない そんな時に便利なのが「Animista」 動作・名称・コードがパパっと確認できるので、 コピーしてプロンプト欄にペーストするだけです。 見ているだけでも楽しい。
KAWAI145,025 просмотров • 1 месяц назад

Webサイトの構成を選べる辞典 136種類、プロンプト付きで作りました。 ファーストビューから料金表まで、 セクション単位で見比べられます。 ・写真と文章を左右に配置する構成 ・3つの料金プランを並べる構成 ・メッセージを1カラムで伝える構成 気になる例を開くと、 HTMLと生成プロンプトをコピー可能。 プロンプトの会社名やサービス名を変え、 AIに渡せばサイト制作の出発点に。 HTMLを編集して使うこともできます。 「どんな配置にするか」を、 実物を見ながら決めたいときに。 サイトのリンクを欲しい方は コメントで教えてください。 DMでお送りさせていただきます。
KAWAI39,016 просмотров • 29 дней назад

Claude Code × Vibe Codingで 「それ何て言えばいい?」を ゼロにする用語集を作りました AIにWebサイトを作ってもらうとき、 地味に困るのが 「パーツの名前がわからない」問題。 ヒーロー、モーダル、ブレッドクラム… 名前を知ってるだけでAIへの 指示精度が段違いに変わります。 この用語集では ✅パーツ名/スタイル/インタラクションを網羅 ✅各用語に「AIへの指示例」付き ✅ビジュアルUI図鑑で実際の配置も確認できる Vibe Codingの語彙力、ここで一気に上げてください。 🔽 用語集はこちら
KAWAI191,027 просмотров • 7 месяцев назад

Google Gemini 3 で 1発生成した「Webサイト」 ※ プロンプトはリプに掲載 コーポレートサイトのテンプレートを生成しました。ビジネスや信頼感を印象付けるしっかりとした表層デザイン。これが数分で生成できてしまうことに驚きです。
KAWAI215,810 просмотров • 11 месяцев назад

学びたいことが増えるほど、 教材代も増える... その常識を変えたくて、 0円カワイ大学をオープンしました。 AI、デザイン、コピーライティング、 マーケティング、人間理解など、 仕事に必要な最低限の知識を、 すべて完全無料で学べる 大学を目指しています。 チュートリアル機能もあるので、 何から読めばいいかわからない人も、 すぐに使い始められます。 ログイン不要で、完全無料です。 マイページで学習進捗を管理したい方は、 無料会員登録がおすすめです。 現在は無料提供を続ける予定ですが、 利用者が増えた場合は、運営状況に 応じて提供方法や条件を見直す 可能性があります。マイページを 使いたい方は、早めの登録がおすすめです。 現在は20記事。 まだ始まったばかりなので、読んでみて 「このテーマも知りたい」と思ったら、 ぜひコメントで教えてください。 内容を増やしていきます。 サイトを見たい方は、コメントに 「欲しい」と書いてください。 URLをお送りします。
KAWAI55,442 просмотров • 2 месяцев назад

AIに動きをつけてもらうと、 動くのに「なんか安っぽい」で止まる。 CSSアニメーション130種を、 動く実物とコードで一覧にしました。 たとえば、オーロラメッシュ、グリッチ文字。 スクロール駆動リビール、3Dカルーセル。 各項目に「AI」タブがあります。 HTML、CSS、対応ブラウザ、描画コスト、 reduced-motion(動きを控える設定) への対応まで、1回のコピーで AIへそのまま渡せます。 「安っぽい」の正体は、 派手さ不足ではありません。 軽さと配慮の指定漏れです。 使ってみたい人は コメントしてください。 DMでURLをお送りします。
KAWAI40,217 просмотров • 1 месяц назад

「配色が苦手」は、 色を知らないだけです。 センスの問題ではありません。 良い配色を見た回数と、 それを使える形で持っているかの差です。 ポケモンはなぜ愛されるのか。 そう考え続けていたら、 配色のルールが見えてきました。 どのキャラクターも、 メインカラーとアクセントカラーの バランスが徹底されています。 これはサムネイル、広告、Webサイト、 スライドにもそのまま活かせます。 ポケモン151体の配色を メイン・ベース・アクセントで 一覧できるサイトを作りました。 気に入った色はクリックでコピーできます。 Webサイトはこちら
KAWAI78,718 просмотров • 5 месяцев назад

Google 最新AI「Gemini 3」で サクッとWebサイトを生成 短いプロンプトでモダンな印象の 表層デザインになりました。 ※ プロンプトはリプに掲載
KAWAI126,861 просмотров • 11 месяцев назад

Gemini 3 Canvas を 超える使いやすさ Google Stitch が Figma を代替するかも? 🔽 プロンプトはリプに掲載 このWebサイト3ページは、1度の指示で生成されました。コードのコピー、色のテーマ変更(動画終盤で実行)も可能です。修正内容によっては、日本語で指示するよりも楽な場合もあります。 さらに驚きなのが、1クリックで「Google AI Studio」「Jules」にエクスポートできます。UIデザインが数分で動作するアプリケーションに変換される。Webサイト、アプリケーションUIデザインの制作プロセスの革命か。
KAWAI82,674 просмотров • 11 месяцев назад

次世代のストックフォトサービス 「/Studio.Stock」がすごい 無料・商用利用可能とは思えない品質の 写真がズラーっと並んでいます。 色合いやポーズをプロンプトで変更可能 これは新しい形のサービスですね。
KAWAI74,031 просмотров • 11 месяцев назад