見出し画像

【デザインとAI】週末版20260719〜20260726

デザインとAI

オープンソース系もチェックしておいた方がいいのか・・・。
ちょっとめんどくさいなぁ。


New skill: /pick-ui-library Have your agent pick the right UI li…

Emil Kowalski

カテゴリ：UI/UX・フロントエンド

New skill: /pick-ui-library Have your agent pick the right UI library for the task based on libraries I use and trust, instead of letting AI hand-roll a toast component or install an abandoned package…

反響: ブックマーク3000超と高く、実務でAIに任せたUIライブラリ選択のミスを防ぐ実用スキルとして「すぐ試す」「これは使える」との反応が多数。

示唆: AIエージェントに「信頼できるUIライブラリを選ばせる」スキルを用意することで、手書きコンポーネントや廃れたパッケージの乱立を防ぎ、品質を担保しながら速度を上げられる。デザイナー・エンジニア双方がエージェントに渡す「知識の型」を持つ重要性が示されている。

I'm sad it took me this long to actually type /design but workin…

Thariq

カテゴリ：UI/UX・プロダクトデザイン

I'm sad it took me this long to actually type /design but working on frontend with Claude Design and Claude Code is actually so good

反響: Claude Code公式関連アカウントからの投稿で2600いいね超。「/designコマンドでフロントが劇的に楽になる」と実務での試用報告が相次ぎ、返信で具体的な使い方やトークン効率の質問が集まっている。

示唆: Claude DesignとClaude Codeを組み合わせることで、デザインからコード実装までのループが短縮される。コマンド一つでデザイン作業に入れる環境が整いつつあり、デザイナーとエンジニアの境界がさらに曖昧になる流れが加速している。

opus 5 is absolutely insane, holy shit. visual construction + de…

signüll

カテゴリ：UI/UX・ビジュアルデザイン

opus 5 is absolutely insane, holy shit. visual construction + design is noticeably much much better. paired with claude design, it’s an absolute beauty. wow.

反響: Opus 5とClaude Designの組み合わせによる視覚構築の大幅向上を実感した投稿で2000いいね超。「試した」「明らかに良くなった」との実用的な感嘆が中心。

示唆: 最新モデル（Opus 5）と専用デザインツールの組み合わせで、AI生成のビジュアル品質が「実用レベル」に達した実感が広がっている。モデル単体ではなく「ツール＋モデル」のセットで評価する姿勢が重要。

Midjourney is acquiring Co-Star. CEO @banu__guler is now Chief D…

Midjourney

カテゴリ：グラフィック・プロダクトデザイン

Midjourney is acquiring Co-Star. CEO @banu__guler is now Chief Design Officer at Midjourney. She's building a cross-functional design, product and frontend team for all our efforts. The Co-Star app wi…

反響: 公式発表で2100いいね超。デザイン・プロダクト・フロントエンド横断チーム構築への期待と、Co-Star継続運営への安心感が混在した反応。

示唆: 生成AI企業が「デザイン責任者」を正式に据え、プロダクト・フロントエンドまで統合する動きは、ツールが単なる画像生成から「デザイン組織そのもの」へ進化していることを示す。

We're releasing V8.2 today and making it the default model on Mi…

Midjourney

カテゴリ：グラフィックデザイン

We're releasing V8.2 today and making it the default model on Midjourney. This is a release focused on aesthetics, personalization, and image quality. Our new style is more creative, bold, edgy and fr…

反響: 公式リリースで1400いいね超。美学・パーソナライズ・画質向上を謳い、「すぐ試す」「スタイルが刷新された」との反応が目立つ。

示唆: デフォルトモデル更新で「美学とパーソナライズ」を前面に出した点は、生成AIが「使える画像」から「ブランドや個人の好みに寄り添うデザインツール」へシフトしている証拠。

WTF... Someone literally built a massive collection of open-sour…

Ram Maheshwari

カテゴリ：WEBデザイン・ツール全般

WTF... Someone literally built a massive collection of open-source, in-browser tools that require no sign-up to use. 🤯 It includes tools across multiple categories: → Design & Graphics → Development →…

反響: 2000いいね超、ブックマーク2800超。「すぐ使える」「サインアップ不要が最高」との実用的な反応が殺到。

示唆: サインアップ不要・ブラウザ完結のオープンソースツール集は、プライバシーと即時性を重視するデザイナーに刺さる。有料SaaS依存から「自前で回せる軽量ツール」への回帰が加速している。

> 16 years old > still in high school > built the "Taste Skill" …

am.will

カテゴリ：UI/UX・フロントエンド

16 years old > still in high school > built the "Taste Skill" for AI frontend design > 67,000 stars on Github > 813 billion tokens used in Codex > Absolute psychopath Some people are just built diff…

反響: 1425いいね。「高校生が作ったTaste SkillがGitHubで6.7万スター」と驚きとともに「実際に使っている」「フロントデザインの質が上がる」との実用報告が多い。

示唆: 「AIに味覚（Taste）を教えるスキル」が爆発的に支持されている事実は、生成AIの出力が「きれいだけど無機質」になりがちな弱点を、人間が作ったルールで補完するアプローチが有効であることを示している。

seeing claude design my portfolio webpage in 30 minutes that i h…

moscow chick

カテゴリ：WEBデザイン・ポートフォリオ

seeing claude design my portfolio webpage in 30 minutes that i have been working on for 3 months in framer

反響: 1399いいね。「3ヶ月かかったポートフォリオが30分で」との衝撃的な実用比較に、「試してみる」「Framerからの移行を検討」との反応が集中。

示唆: 既存ツール（Framer）で長期間かけた作業が、Claude Designで短時間に再現できる事例は、プロトタイピング速度の劇的向上を実感させる。ただし「味」や「独自性」の最終調整は人間が残す必要がある。

Using Claude Design 2.0 to Avoid Slop! 👇

Gary Simon

カテゴリ：UI/UX・WEBデザイン

Using Claude Design 2.0 to Avoid Slop! 👇

反響: 動画付きで約900いいね、ブックマーク1480超。「スロップ（安っぽいAI感）を避ける具体的な使い方」として実務者から高く評価されている。

示唆: 「AIスロップを避ける」ための具体的なワークフローを公開することで、単なる生成ではなく「品質管理されたデザインプロセス」としてのClaude Designの使い方が広まりつつある。

Every Friday (almost) I pull together the AI + design tools that…

Jarrad Grigg

カテゴリ：UI/UX・モーション・ツール

Every Friday (almost) I pull together the AI + design tools that I think creatives can use to supercharge their workflows. This week I'm mostly looking at open source options that have cropped up. ...…

反響: オープンソース中心の週次まとめとして、実務で使えるツールをリストアップ。反応は「試した」「クライアントワークに使える」との実用志向。

示唆: 有料クローズドツール一辺倒から、オープンソースで「自前インフラを持ちながらAIデザインを回す」選択肢が増えている。ロックインを避けつつ実制作に耐えるツール群が揃いつつある点が重要。

【全体的な傾向】

今週（2026年7月19日〜26日）の「デザイン＋AI」界隈は、大きく3つの潮流が交差している。

第一に、AnthropicのClaude DesignとClaude Codeの実用化・品質向上が最も強いエンゲージメントを集めている点だ。Opus 5との組み合わせで「視覚構築が明らかに良くなった」「ポートフォリオが3ヶ月から30分に短縮された」「スロップを避ける使い方」など、抽象的な可能性論ではなく「実際に使ってこう変わった」という具体的な体験報告が目立つ。特に /design コマンドやスキル連携によって、デザイン作業がターミナルやエージェントフローに自然に溶け込み始めている。これは単なる画像生成ツールから「デザインとコードの統合環境」への進化を象徴する。

第二に、オープンソース・スキルエコシステムの台頭が顕著である。Emil Kowalskiのskillsリポジトリ（UIライブラリ選択スキルやアニメーション改善スキル）や、高校生が作った「Taste Skill」が数万スターを獲得するなど、「AIに渡すための知識の型」を人間が作り、共有する動きが活発だ。有料SaaSに依存せず、エージェントに「信頼できるルール」を与えることで品質を担保するアプローチが、実務者から強く支持されている。また、サインアップ不要のブラウザ完結ツール集や、Open Designのようなローカル実行可能なClaude Design相当ツールが紹介され、「ロックインを避けつつ実制作に耐える」選択肢が増えている点も特徴的だ。

第三に、Midjourneyの動きが「生成AI企業の組織的進化」を示している。V8.2での美学・パーソナライズ強化に加え、Co-Star買収とChief Design Officer任命により、単なる画像生成エンジンから「デザイン・プロダクト・フロントエンド横断チーム」を持つ企業へとシフトしている。これは生成AIが「ツール」から「デザイン組織の一部」になりつつあることを示唆する。

全体として、今週の議論は「AIがデザインを代替するかどうか」から「AIをどう品質管理し、ワークフローに組み込むか」へと完全に移行している。スロップ（安っぽいAI感）を避けるための具体的な手法、デザインシステムとの同期、エージェントへのスキル付与、オープンソースによる自前化——これらが共通のキーワードだ。エンゲージメントの高い投稿はほぼ例外なく「試した結果こうだった」「このスキルを使うとこうなる」という実証ベースのもので、単なるニュース共有や願望ではなく、実務者同士のナレッジ共有の場として機能している。今後は、Claude Designのような統合環境と、Taste SkillやEmil skillsのような「人間が定義した味覚・ルール」の組み合わせが、標準的なデザインプロセスになっていく可能性が高い。

今週のプロンプト

【衣装プロンプト配布】いよいよ夏らしくなってきましたね！

Noir◆幻想AIアート @atelier_noir00

カテゴリ：ファッション／衣装デザイン（ファンタジーグラフィック）

【衣装プロンプト配布】いよいよ夏らしくなってきましたね！今回は、そんな夏にぴったりのサマードレスをお仕立てしてみました♪白百合をイメージした、涼しげで爽やかなデザインをお楽しみくださいませ！アレンジはご自由にどうぞプロンプトはリプ欄に貼ります✨

``` A beautiful summer-inspired fantasy dress, elegant white lily gothic style, predominantly pure white with delicate black accents, lightweight and airy design, refined and graceful silhouette. Soft square neckline revealing the collarbones, elegant semi-off-shoulder design with translucent white chiffon draped gently over the shoulders, sheer organza three-quarter sleeves finished with delicate black lace cuffs. A fitted high-waist bodice embroidered with intricate silver floral patterns, a small sapphire gemstone set at the center of the neckline, a slim black ribbon around the waist with an elegant silver ornament. Layered flowing skirt made of multiple translucent chiffon and organza fabrics, high-low hemline (shorter in front, longer in back), subtle movement as if dancing in a gentle summer breeze, delicate black lace trimming along the edges, soft petal-inspired layered construction. A tasteful side slit revealing only a small portion of the thigh while walking, maintaining an elegant and refined appearance. Color palette: 85% pure white, 10% silver embroidery and metallic ornaments, 5% black lace and ribbon accents. Accessories: white lily hair ornament with silver leaves, crystal flower petals, sapphire decorations, delicate silver jewelry, refined white ankle-strap sandals with silver embellishments. Materials: chiffon, organza, fine lace, satin, silk, subtle glossy fabric, translucent textiles. Mood: fresh, airy, elegant, innocent, romantic, graceful, summer breeze, moonlit garden, ethereal beauty, delicate femininity, sophisticated rather than sexy. ```

示唆: 詳細な素材・シルエット・色比率・ムード指定を重ねることで、生成AIで一貫性の高いファンタジードレスを再現可能。季節感や「上品さ」を数値的にコントロールする手法が、ファッション系生成の再現性を高める示唆を与える。

Turn the volume up and let the colors take over. A little chaos,…

Caden Flux @Caden_Flux

カテゴリ：グラフィック／動画デザイン（ミュージックビデオ）

Turn the volume up and let the colors take over. A little chaos, a lot of energy, and a soundtrack made for endless summer days. 💖⚡ Made on @Flovaai using Sonu and Seedance 2.0 #Flovaai #Flovacpp PROM…

``` Generate a continuous 1-minute high-budget K-pop-inspired music video synchronized to the lyrics below. The video should feel like a real summer comeback with constant momentum, vibrant colors, cinematic visuals, and powerful synchronized choreography. Every beat should introduce dynamic dance movements, new camera angles, formation changes, or visual effects. The pacing should be fast, energetic, stylish, and addictive with no slow walking sequences or static shots. Every frame should feel alive. Character (Must Remain Identical Throughout) Caden, 22-year-old male, 6'0" (183 cm), lean athletic build, fair skin, expressive brown eyes, clean-shaven, short brown hair styled in a voluminous side-swept quiff, youthful, confident, playful, charismatic smile. Outfit (Never Changes) Burgundy varsity jacket with white sleeves and striped ribbed cuffs and waistband Oversized untucked white button-up shirt Slim black necktie Washed charcoal oversized wide-leg jeans Burgundy Converse-style high-top sneakers with white toe cap and white laces Matte black over-ear headphones resting around his neck Thin silver chain necklace Silver rings [以下、時間帯ごとの歌詞・シーン・カメラワーク・全体ビジュアル方向の詳細指定が続く] 🔥 Final Line (Very Important) Prioritize synchronized choreography, expressive dance performance, dynamic camera movement, fast-paced editing, and continuous visual excitement over cinematic slow moments. Every beat should feel performance-driven, colorful, energetic, and designed like a high-budget K-pop music video with nonstop momentum from beginning to end. ```

示唆: 時間軸ごとに歌詞・振付・カメラワークを厳密に指定し「静止ショット禁止」を明記することで、動画生成AIの出力を高エネルギーで一貫したものに制御できる。キャラ・衣装固定＋動的演出の優先順位付けが、商業レベルのMV生成に有効な設計手法を示している。

you asked me to open source the Pi UI from my recent post, but t…

dodo-reach 🦤 @DODOREACH

カテゴリ：UI/UXデザイン（AIエージェント向けWebインターフェース）

you asked me to open source the Pi UI from my recent post, but the best thing @pidotdev taught me is that learning to shape your own tools is better than accepting someone elses finished product so i …

``` Build a complete local, private, responsive web UI for my existing Pi coding-agent setup. Work autonomously from discovery through verification: inspect the environment, create the project, install dependencies, implement every required flow, run tests, launch the production app, and fix failures. Do not stop at a plan, scaffold, or mockup, and do not ask me aesthetic questions—make sensible choices and finish the app. THE RESULT I should get a working dashboard that runs on the same computer as Pi and lets me: - choose a project; - create or resume a native Pi session; - stream assistant text, thinking, and tool activity; - send, steer, queue a follow-up, and stop; - choose model, thinking level, and read-only/full tools; - use it comfortably from desktop and mobile; - reach it privately through Tailscale Serve. [以下、環境検証・パス規則・固定スタック・ビルド順序・Pi統合・セキュリティ・Tailscale対応・テスト要件・完了定義までの超詳細仕様が続く] ```

示唆: 単なる見た目指定ではなく、機能要件・セキュリティ境界・レスポンシブ仕様・テスト基準までを一気に記述した「完成まで自律実行させる」プロンプト設計。AIにUIを構築させる際、曖昧さを排して実装・検証まで強制する手法が、実用的なツール生成に直結する示唆を与える。

This from Flux 3 is incredible! Prompt : Four-way CCTV-style spl…

Umesh - @umesh_ai

カテゴリ：ビデオ/グラフィックデザイン

This from Flux 3 is incredible! Prompt : Four-way CCTV-style split-screen showing the same real-time event inside a convenience shop. ... (詳細な同期描写) Use realistic low-resolution CCTV footage... （日本語訳: …

``` Prompt : Four-way CCTV-style split-screen showing the same real-time event inside a convenience shop. Divide the frame into four equal security-camera views with timestamps. Top left: wide ceiling-corner view covering aisles, entrance, and cashier. Top right: overhead view above the central aisle. Bottom left: camera facing the checkout counter. Bottom right: camera near the entrance looking inward. At the 2-second mark, a customer takes a boxed item from a shelf, accidentally bumps a display, catches one falling bottle, then places the box on the checkout counter. The cashier turns, scans it, and hands over a receipt as another shopper crosses behind them. All four views must remain perfectly synchronized, showing identical people, movements, object positions, occlusions, timestamps, lighting, and physical reactions. Use realistic low-resolution CCTV footage, slight lens distortion, fixed cameras, and no cinematic camera movement. ```

示唆: 複雑なマルチビュー同期動画生成のプロンプト技法が秀逸。イベントの詳細なタイミング・カメラ位置・物理的リアクションを具体的に記述することで、AIの出力精度を劇的に向上。デザイン界隈では、ストーリーボードや監視映像風コンテンツ作成に即活用可能で、単一プロンプトでプロ級の複合シーンを実現する示唆を与える。

Made with Midjourney V8.1 via @itsPolloAI. Prompt A fearless foo…

Romana - @Romi2656

カテゴリ：グラフィック/イラストデザイン

Made with Midjourney V8.1 via @itsPolloAI. Prompt A fearless football legend sprinting directly toward the camera with unmatched intensity, surrounded by multiple roaring versions of himself in differ…

``` A fearless football legend sprinting directly toward the camera with unmatched intensity, surrounded by multiple roaring versions of himself in different national team jerseys, explosive energy, flying dust, dramatic golden cinematic lighting, thick expressive oil paint brush strokes, textured canvas, ultra-detailed face, dynamic motion, emotional sports atmosphere, high contrast, masterpiece, fine art, 8K, epic composition, trending on ArtStation. ```

示唆: スポーツアイコンをダイナミックに複数描写する油絵風プロンプト。動き・照明・テクスチャ・構図のレイヤリングが豊富で、Midjourneyなどで即戦力。デザインでは感情喚起や英雄的ビジュアル作成に役立ち、「explosive energy」や「textured canvas」などの記述がAI出力の芸術性を高める実践例を示す。

Prompt Forge engaged. Idea: Lone AI discovers glowing artifact i…

Grok - @grok

カテゴリ：コンセプトアート/グラフィックデザイン

Prompt Forge engaged. Idea: Lone AI discovers glowing artifact in cybernetic museum ruins after human extinction. Signals in axis order: The Gift Is Actually Evidence, Standing, Ethereal, Single Domin…

``` Idea: Lone AI discovers glowing artifact in cybernetic museum ruins after human extinction. Signals in axis order: The Gift Is Actually Evidence, Standing, Ethereal, Single Dominant Subject, Museum After Human Extinction, Low Angle, Digital Painting, Cyberpunk, Neon Glow, Neon, Metallic, Floating Embers, Photorealistic. ```

示唆: Prompt Forgeのような軸分解手法（ナラティブ・被写体・ムード・スタイル・照明など）が、コンセプトデザインの質を安定させる。SF/サイバーパンクビジュアル作成にすぐ使え、物語性と視覚効果をバランスよく組み込むことで、AI生成デザインの没入感を高める実践的示唆を提供。 これらは生成AIプロンプトの即時性とデザイン応用性が高い例です。エンゲージメントは300前後を中心に選びました。


いいなと思ったら応援しよう！