はじめに 2026年4月17日（米時間金曜）、Anthropicが Claude Design を research preview として発表 自然言語でプロトタイプ・スライド・モックアップ・LPを作れる、Claude Opus 4.7ベースの新機能 競合は Figma Make / v0 / Lovable / Bolt / Google Stitch / Gamma / Canva 発表前後で Figma -6% / Wix -4.7% / Adobe -2.7% / GoDaddy -3% と市場は結構まじめに反応 「Webデザイナー・フロントエンドの仕事が丸ごと消える」のではなく、「初稿を作る工程」と「単純なUI実装」から先に溶ける、というのが現時点での実際的な読み 普段はClaude CodeやAIツール周りの記事を書くことが多いのですが、今回は界隈としてインパクトが大きかった

はじめに こんばんは、mirukyです。 個人的にAIにデザインを指定するのって、意外と難しいと思っています。 皆さん、DESIGN.mdをご存知でしょうか。GoogleがStitchプロジェクトの一部として策定した、マークダウンベースのデザインシステム仕様です。「AIコーディングエージェントにデザインの文脈を与える」という、シンプルながら強力なアプローチで、いま海外のAI開発者コミュニティで注目を集めています。 私はこのDESIGN.mdの仕様を読んで「これ、実際に使うとどのくらいのクオリティが出るんだろう？」と気になりました。 そこで今回、DESIGN.mdを5つ書き、それぞれClaude Codeに渡してデモサイトを作ってもらいました。ジャンルはSaaS、カフェ、ポートフォリオ、ヘルスケア、クリエイティブエージェンシーとバラバラにしています。結果は正直、かなり驚きました。 この記事で

こんにちは、せーのです。今日は社内向けに使っているクラスメソッドのデザインガイドを、DESIGN.md という形に置き換えてみましたので、共有します。 みなさん、AIに画面や資料を作らせるときに「背景は #f4f4f4、角丸はなし、ロゴは右上……」と毎回プロンプトに書いていませんか。私もずっとそうでした。 嘘です。正確には、Claude Code のスキルに寄せて省略しました。/classmethod-brand-guidelines というスキルを作成し、それを呼べば、そこにロゴやトーンのルールがまとまっているので、毎回ゼロから色の指定をしなくて済む、という方法をとっていました。 問題は「スキルは明示的に呼ばないと効かない」「Cursor や別のエージェントでは同じ資産を共有しづらい」あたりが、少しモヤッとするところにあります。 私は今までは Claude Code 上ではスキルでブラン

はじめに Claude CodeやCursorでUIを生成させると、毎回デザインがバラバラになる──そんな経験はないだろうか。 「ボタンをつくって」と頼むたびに色もフォントも丸みも変わる。「Notion風にして」と伝えても、AIには「Notion風」の定義がわからないので、毎回違う解釈で出力される。 この問題を解決するのが DESIGN.md だ。 DESIGN.md はプロジェクトのデザインルール（カラー・タイポグラフィ・コンポーネントのスタイル）をMarkdownで記述したファイルで、プロジェクトルートに配置するだけでAIコーディングエージェントが参照できる。CLAUDE.mdやAGENTS.mdと同じ「AIへの説明書」ファミリーの一員だ。 この記事で学べること: DESIGN.mdが何のためのファイルで、なぜ有効なのか DESIGN.mdの基本的な書き方と構造 awesome-des

こんにちは！運用イノベーション部の大野です。 最近ひょんなことから知り合ったカナダ在住エンジニアの方に、「UI作成ならStitchが便利」というお話を伺いました。 ...が恥ずかしながら「Stitch」について全くの無知だったため、軽くですが実際に触って確かめてきました。 今回はその感想を共有させていただきます。 Stitchってなんだ？ Stitchとは、Google Labs提供のUIデザイン生成支援用AIツールです。 2025年5月に行われた「Google I/O 2025」にて発表されました。 自然言語や画像を入力として与えることで、AIによってWebやモバイル画面のUIを生成してくれる機能を持っています。 また、生成したUIをHTMLコードとして表示することや、Figmaに直接エクスポートすることが可能です。 UI生成可能なAIツールは他にも多数存在しますが、以下の点においてSt

Google Stitch、話題になってますよね。 ただ、デザイナーじゃない自分からすると 「すごそうだけど、結局なにができるの？」 がよくわからなかった。触ってみたいけど、何から手をつければいいかもわからない。 同じように感じている人、けっこういるんじゃないかと思います。 なので、非デザイナーの私が実際に触りながら「こういうやれば、だいたいわかる」というハンズオンマニュアルを作りました。 あくまで"だいたい"です！！ この記事の通りに手を動かしてもらえれば、Google Stitch がどんなものか、なんとなーく掴めると思います。よければ使ってください。 そもそも Google Stitch って何が話題なの？Google Stitch のすごいところは、簡単にいうと3つだと私は思っています。 AIネイティブなデザインキャンバス: テキストや音声で指示するだけで、無限キャンバス上にUIデ

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

こんにちは、How many designs です。 Web Design Talk というタイトルで、デザインに関するお話を少しだけ書いていこうと思います。気軽に読んでいただければ幸いです。 What is DESIGN.md?Google が提供する次世代の UI デザインツール Google Stitch における DESIGN.md は、プロジェクト全体で一貫性のあるUIを生成するためにAIエージェントが読み込むデザインシステムドキュメントです。 一言で言うと「AI のためのデザイン説明書」です。 通常、デザイン案には、色、フォント、間隔、コンポーネントスタイルといった視覚的なアイデンティティがあります。従来、これらはFigmaファイル、ブランドPDF、あるいはデザイナーの頭の中に存在していました。しかし、これらはAIエージェントには読み取れません。 DESIGN.mdはこの状況を

僕のケースでは、生成品質はほぼ同じだった。 ただしこれは、旧版のCLAUDE.mdを18KBかけてかなり丁寧に作り込んでいたから。Quick ReferenceにTailwindクラスを全部書き、禁止パターンを76項目列挙し、コンポーネント仕様もインラインで記述していた。ここまでやれば、AIはMarkdownの禁止ルールもちゃんと守る。 一般的には、CLAUDE.mdやカーソルルールにここまでの解像度で書いている人は多くないと思う。DESIGN.mdとして設計原則・Quick Reference・禁止パターンを構造化するだけで、生成品質が目に見えて上がるケースの方が多いはず。 僕の場合、DESIGN.mdを伴う生成品質の向上も大事だけど、サービス開発で使っていくために「今日の品質」ではなく「半年後も品質が落ちない仕組み」を 作っていく必要がある。 1ファイルに全部入りの限界 melta U

ちゃんと人間が書いています。 Claude Codeをこれから使い始める初学者の方から、 すでに使っているけれど もっと活用したい上級者の方まで、 幅広く対象にしています。 2026/02/18時点のAnthropic公式のベストプラクティスと、私の開発の知見を元にまとめています。 上から順に読んでいけば、誰でもプロになれるように書きました。

普段は無気力なPMなんて名乗っているが、プライベートでの集まり飲み会の幹事や予定調整なんかが好きで主導してやることが多い。しかし、完全に気の知れた人ならまた別だが、社会人の集まりを調整するというのは、想像以上に骨が折れる作業だ。 会社組織であれば、明確な役割分担といったルールが存在する。しかし、プライベートな集まりにはそれがない。結果として、幹事は参加者の良識や、空気を読む力といった不確かなものに依存せざるを得なくなるのだが、これが大きな枷となる。ここでお客様気分みたいな受動的な人間が一人でも混ざると、進行は恐ろしく重くなる。 期限を過ぎても出欠連絡が来ない、段取りに文句を言う、当日はただ座っているだけで会話の起点にもならない。みたいな地雷みたいな現場は稀にある。 このストレスの正体は一体何なのか。彼らの性格が悪いからかと考えてみたが、恐らくこの決定的な差は「人を動かした経験」、つまりリー

大規模言語モデルのトレーニングには大規模なデータセットが必要ですが、データセットに偏りがあると出力結果や動作にもバイアスが生じます。これを逆手に取り、あえて1800～1875年という限られた年代のデータセットのみを用いてトレーニングされた大規模言語モデルが「TimeCapsule LLM」です。 GitHub - haykgrigo3/TimeCapsuleLLM: A LLM trained only on data from certain time periods to reduce modern bias https://github.com/haykgrigo3/TimeCapsuleLLM TimeCapsule LLMは現代に存在するさまざまなバイアスや価値観を排除し、当時の論調や語彙(ごい)、世界観を模倣することを目的として、あえて1800～1875年のデータセットのみを用

typography.md タイポグラフィ font-family フォントは Web サイトの印象に直結するため、一概にこれが良いとは言えない。 特にこれと言った指定がされていない場合は font-family: sans-serif のみで良い。 Windows 11/10 では 2025 年のアップデートにより Noto Sans JP が標準搭載された。色々と問題があった游ゴシックの呪縛から解放されたのは大きい。 Android はメーカーにより削除されている可能性はあるが、そうでない場合は原則的に Noto Sans CJK JP が適用される。 Mac/iOS はヒラギノ角ゴ ProN が適用される。 アップデートによるフォントの変更の懸念はあるものの、ディスクリシアの方々は UD デジタル教科書体などの読みやすいフォントを設定している可能性があるため、アクセシビリティの観点で

BuriKaigi 2026

m.mako @e13_mako @humitukky46 ハーバーボッシュ法の2人がトップかなとは思いますが、それ以外だとフォンノイマンですかね。 いなくてもコンピューターは発明されていたと思いますが、2026年にスマホ的な端末が作れるまで到達していたかは微妙かなと思います。 2026-01-03 19:07:01 夕凪 @amatukayuunagi @humitukky46 スタニスラフ・ペトロフ（旧ソ連軍将校） 「世界を核戦争から救った男」 ソ連の警戒システムが「アメリカから5発の核ミサイルが発射された」という誤報を発しました。彼は直感で「誤報」と判断し、上層部に報告しませんでした。彼がマニュアル通りに動いていたら、第三次世界大戦が勃発して世界が、 2026-01-03 07:08:45

孫正義は名前にもこだわりを見せる。ヤフーBB以降、コンシューマービジネスでは名前が大事だということを痛感していたからだ。 最初は「ヤフーペイ」という名前を検討していたが、当時はまだ米国ヤフーとのロイヤリティの契約があった。ロイヤリティを払うと薄利のビジネスなので、決済の時に逆ざやが生じる。だからヤフーの名前は使えないということになった。 そこから○○ペイという名称を考え始めた。アリババだと「Alipay」だし、みな○○ペイだったからである。川邊健太郎と小澤で相談し、一つに絞って持って行けば納得してくれるだろうと、 「検討した結果、これ一つになりました」 と○○ペイ案を持っていったが、それでも孫は反対した。 次は逆に、複数の候補を持って行ってその中で決めさせる作戦に出た。 「この中でいいと思うのを言ってください」 と20個ほどアイデアを持っていった。 すると孫はのっけから、 「そもそも、○○

2025年現在、デザインの「三種の神器」はStudio、Figma、Canvaだそうです。 なんと、アドビが入っていない!!! 「いやいや、Illustratorは使うでしょ!?」って思いますが、アドビを使わずに仕事はできますよ！という層が増えているそうです。 諸行無常、栄枯盛衰──永遠不変なものは何ひとつないんですよね。昔話はなるべくしないようにしているのですが、ちょっと振り返ってみます。 記憶をたどりながら＋調べながら書いたのですが、事実関係が異なることがあるかもしれません。おかしなところがあれば、コメントなどで教えてください！ なお、この段落のように「引用」スタイルになっている箇所は、ちょっとした補足や著者のメモです。 Macでデザイン!?いまではPCを使って印刷用のデータを作るのが当たり前ですが、PC（やMac）が存在する前には、次のように「分業」が確立されていました。 写植：原稿

utopia 夕暮宇宙船 夏の異常気象と生活のAI化が進んだ2045年。古き良き夏の文化が失われつつあるなか、この時代を生きる子供たちはかつての夏の暑さを知りたくなり…