스크립트
00:00:00それでは始めましょう。皆さんようこそ、お越しいただきありがとうございます。ポールです。皆さんを
00:00:21昼下がりのスランプから救い出したいと思います。うまくいくかどうか見てみましょう。さて、今回のこの
00:00:29冒頭のトークは、「Impeccable」が何であるかを知っていれば、よりしっくりくるはずです。もし
00:00:35ご存じない方に説明すると、これは皆さんのコーディング環境をより優れた
00:00:39デザイナーに変え、願わくば皆さん自身をも優れたデザイナーに変えるデザインスキルであり、実際に試すことができます。機能するのは
00:00:43Claude Code、GitHub Copilot、Cursor、Codexなど、すべての環境で横断的に動作します。今回のトークの主旨は
00:00:51ツールそのものというよりも、このツールを構築した私のアプローチについてです。それでは、
00:00:59典型的なウェブサイトから始めましょう。これは意図的に非常にシンプルなウェブサイトですが、
00:01:05次に紹介する内容の文脈として、まずこれをお見せしたいと思います。ご覧のとおり、これは
00:01:11まあまあのウェブサイトです。すごく素晴らしいわけではなく、かなり地味ですが、少なくとも色や何かしらの要素はあります。
00:01:19ではここで、「もっと大胆に、ワークフローセクションをもっと大胆に、Impeccableを使って」というコマンドを実行します。これがImpeccableを導入した状態です。これでいくつか、完璧ではない部分もあります。例えば、そこにあるセクション番号ですが、これはAIによくある
00:01:41ループの癖です。GPTが好んでやりたがるやつです。Claudeも実際、好んでやりたがりますよね。
00:01:48時々それが入り込んでしまいます。ですので、決して完璧とは言えませんが、以前よりは大胆になったと言えるでしょう。
00:01:54さて、多くの人がImpeccableをインストールして試した後、こう尋ねてきます。「もしかしたらプラシーボ効果かもしれない。モデル自体が十分に優れているだけなんじゃないか？」と。実際に機能しているのか確信が持てないわけです。では比較してみましょう。こちらはまったく同じプロジェクトで、ImpeccableなしでGPT 5.5のextra high設定で同じプロンプトを実行したものです。
00:02:16ですので、わずかな違いはあると思いますが、それについてはご自身で判断してください。ビフォアとアフターはかなり異なっており、なぜそれが起きるのか、そしてどのようなアプローチなのかについてお話します。
00:02:35つまり、形容詞のスピードでデザインするということです。まず率直に言っておくと、それらは形容詞だけでなく、動詞でもあります。
00:02:44ですが、そのうちの一部は形容詞です。
00:02:49まず第一に、エンジニアとデザイナーの役割が曖昧になっています。これまでになく多くの人がデザインエンジニアになっています。デザイナーがコードの世界へ進み、エンジニアがデザインの世界へ進む、あるいはその逆の現象が起きています。
00:03:02私のところにやってきて、「Impeccableのおかげで、誰もがコミュニケーションを取れる共通のデザイン言語が手に入った」と言ってくれる人たちからのコメントは、本当に素晴らしいものです。
00:03:11しかし実際には、これらの世界はすべて衝突しつつあり、私の意見では、典型的な引き継ぎプロセスは崩壊しています。例えば、私がデザインから始め、あるいはPM側で「何を作るか」から始め、それがデザインに回り、そして引き継ぎや批評のプロセスがあって、最終的にエンジニアが構築するというようなウォーターフォールプロセスですね。
00:03:30そうしたやり方はもはや現実のものではありません。皆さんはどうか分かりませんが、中小企業や大企業を問わず、その仕組みは急速に崩れ始めていると思います。
00:03:41そして実際のデザイン作業に関して言えば、現在、私たちがプレイできるフィールドには大きく分けて2つの世界があるように感じられます。
00:03:481つは、ピクセル空間での直接操作です。つまりFigmaを開いて、マージンやパディングなどを自分でいじるような形です。あるいはWebflowなどのツールを使って、最終的なアウトプットやデザインを直接操作する方法です。
00:04:04それはそれでいいのですが、周囲の誰もがエージェントを駆使し、ループを回しまくっているのを見ると、取り残されているような気分になりますよね。
00:04:13そこで今度はもう一つの極端な方法に走ります。つまり、エージェントに「これをデザインしてほしい」「これを作ってほしい」と単純に指示する方法です。
00:04:18しかし、少なくとも私には、私たちがまだ十分に開拓していない中間領域が存在するように思えます。
00:04:24正確なコントロールのレベルとはどのようなものか？ どうすれば完璧なタイミングで人間をループに介在させることができるのか？
00:04:32そこで、このことが頭に浮かびました。少し前に非常に話題になったツイートです。
00:04:38Opusでdivタグを中央寄せにする、というものですね。はい、Opusの優れた使い方とは言えません。
00:04:44でも、何というか、まさにその問題を表しているんですよね。どのツールをどう使い分けるべきかという話です。
00:04:51どの作業に対して、どのツールが適切なのか？
00:04:56私の考えでは、現在のところ、ほとんどの作業において、パディング、マージン、スペーシングなどの直接操作は
00:05:03実際には低すぎる抽象度で行われています。
00:05:08その一方で、完全にエージェント任せにすると、このようなウェブページができあがります。
00:05:15まあ、2022年頃なら、こういうのが出てきたでしょうね。
00:05:17ここにおられる誰もが、典型的なAIスロップのパターンを指摘できるはずです。
00:05:21しかし、紫色のグラデーションは、実際にはすでにそのはるか先を行っています。
00:05:24最近のほとんどの最先端モデルには、もう紫色のグラデーションはありません。
00:05:28今手に入るのはこういうものであり、Claude風に言うなら、ただ別のスーツを着ているようなものです。
00:05:33でも、やはりこれも結局はスロップ（質の低い生成物）なんですよね。
00:05:37ゴールが動いているだけなのです。
00:05:39現在では、私が「Claudeベージュ」と呼ぶものがあり、Instrument Serifフォントが使われ、イタリック体が多用されます。
00:05:44それ自体が悪いデザインというわけではありません。
00:05:46Claudeのデザインから出てくるものが、すべてそのように見えるというだけです。
00:05:49そして、すべてが同じように見えてくると、私が「アルゴリズム版ユニクロ」と呼ぶ状態になってしまいます。
00:05:55これもまた、あまり良くありません。
00:05:57それでは、本日のセッションにおける最初の私なりの過激な意見を述べます。
00:06:01デザインをワンショットで行うことは不可能です。
00:06:04多くの人がそれを望んでおり、いつかはそこにたどり着くかもしれません。
00:06:08しかし現時点では可能だとは思いません。
00:06:11おそらく、これからも不可能でしょう。
00:06:13見た目が素晴らしく、直感的にも優れており、効果的なデザインを構築するためには、
00:06:19自分が何をしようとしているのか、ターゲット層は誰なのか、何を構築しようとしているのかに基づいて情報が組み込まれた、
00:06:26コンテキストが豊かなものが必要です。
00:06:28そしてそれは、マルチショットである必要があります。
00:06:31デザインを何度もブラッシュアップしなければなりません。
00:06:33例えソロプレナー（ひとり起業家）であったとしても、そうでない場合であればなおさら、
00:06:38それぞれ異なる意見を持つ人々が存在するでしょう。
00:06:40ユーザーにも意見があります。
00:06:41つまり、デザインとは泥臭いものです。
00:06:42プロセスそのものです。
00:06:43それを無視して、エージェントに「この問題を解決してくれ」とただ言うだけでは、
00:06:48残念ながら問題の解決にはなりません。
00:06:51もう一つの問題は、もしあなたがデザインの言語を知らない場合、
00:06:57あるいは関係者がデザインの言語を知らない場合、
00:07:00非常に早い段階で大きなフラストレーションが溜まるということです。
00:07:02何かをデザインしたことがある人なら、こうした経験がどんなものかお分かりでしょう。
00:07:06そしてある時点で、「うーん」という感覚が内側から湧き上がってきます。
00:07:11そしていつの間にか、「あーっ」となってしまうのです。
00:07:16ですから本当に、最初に問い直すべきなのは、目指す感情的な領域は何なのか？
00:07:20どのような雰囲気にしては絶対にいけないのか？
00:07:22参考となる基準は何なのか？
00:07:23ターゲット層は誰なのか？
00:07:24これらはすべて、把握しておくべき非常に重要な疑問です。
00:07:27例えば、人間のデザインスタジオに赴くとき、たとえそれが世界最高峰のデザインスタジオであったとしても、
00:07:33デザインディレクターのところに行き、「あのさ、」
00:07:36「ブランドのデザインが欲しいんだよね」と言ったりはしません。
00:07:38するとデザインディレクターはうなずき、
00:07:39「承知しました」と言って、
00:07:41そのまま歩き去ってしまうなんてことはありません。
00:07:42そんなやり方は理にかなっていませんよね。
00:07:44彼らは当然、あなたが何を構築しようとしており、
00:07:47そこから何を得ようとしているのかを把握しなければなりません。
00:07:50重要なことに、この例において、2026年版のAIスロップのようなものでさえ、
00:07:55つまり急ごしらえの雰囲気で作られたピッチでは、ここで誰も何も決定を下していません。
00:08:00ただワンショットで作っただけです。
00:08:02このページに関して、誰も何も決めていないのです。
00:08:05これは単に、有能に見えるかもしれませんが、完全に中身が空っぽなものです。
00:08:10そこで私がここで提示する主張であり、ここ数ヶ月間作り続けようとしてきたのは、
00:08:17形容詞や動詞を使って、エージェントを正しい方向に誘導するために必要最低限のコントロールを私たちに与えてくれるツールです。
00:08:23そしてこれらが、私が話しているような言葉の種類です。
00:08:26「ここをもっと大胆に」「ここを控えめに」といった言葉について話しています。
00:08:29「これを蒸留して（本質を抽出して）」。
00:08:32つまり、単純化することです。
00:08:33「これを洗練させて（ポリッシュして）」。
00:08:35「もっと情報を濃くして（ドenser）」あるいは「堅牢にして（ハーデン）」。
00:08:36例えば「堅牢にする」とは、このデザインが全体を通して確実に機能するようにすることを意味します。
00:08:39特定のデバイスでパフォーマンスが悪いかもしれません。
00:08:44レスポンシブ対応していないかもしれません。
00:08:46こうした言葉は、私たちがデザインの世界で使っているものです。
00:08:48そして、2人の人間が全く同じタスクに挑戦するのを見たとき、
00:08:541人はデザインにほとんど触れたことのないエンジニアで、
00:08:58もう1人はデザイナーである場合、
00:09:01同じモデルを使い、同じ環境やツールを使っているにもかかわらず、
00:09:03使用する言語の違いによって、得られるアウトプットに大きな差が出ることに気づきました。
00:09:08使用する言語によって、得られる出力に明らかな違いが出るのです。
00:09:11ですから、私はその言語表現をスキルやシステムとして体系化し、圧縮しようとしてきました。
00:09:18より的確に自己表現できるようにするためです。
00:09:22例えば、ここにベースラインがあるとします。
00:09:27そこから「もっと大胆に」と指示すると、
00:09:28あなたの文脈において「大胆にする」とはどういうことかを、エージェントは実際に理解します。
00:09:32「より控えめに」と言えば、
00:09:33それも意図を理解してくれます。
00:09:34「洗練させて」と言えば、それもちゃんと通じます。
00:09:36しかし、「どのように」大胆にするのでしょうか？
00:09:42あなたのプロジェクトの文脈において、大胆とは何を意味するのでしょうか？
00:09:44それは本当に重要な疑問です。
00:09:46なぜなら、デモの冒頭のコールドオープンでもお分かりの通り、
00:09:49オープニングで示したように、
00:09:51GPTやClaudeなどに「ここをもっと大胆にして」とただ頼んでも、
00:09:55あなたの意図を全く理解してくれません。
00:09:57もちろん、AIなりに「大胆」という言葉の基準は持っていますが、
00:10:01結局は勝手気ままにやってしまうからです。
00:10:03勝手に新しい色を作ったり、
00:10:05勝手に新しい色を作ったり、
00:10:06勝手に新しいグラデーションを作ったりします。
00:10:07つまり、やりたい放題になってしまうのです。
00:10:10本当に意味するのは、グラデーションでも、グラスモーフィズムでも、ネオンでもなく、完璧なまでの
00:10:17階層構造、スケール、そして明確なタイポグラフィです。
00:10:20デザインシステムを壊さないような形で
00:10:24ユーザーが注目すべき部分を適切に引き立たせる
00:10:29これが、「より太く、完璧に」と指示したときに読み込まれるファイルに実際に書かれている文章です
00:10:38誰かに自分の作品を見せて「ねえ、ここを太くしたんだ」と言ってみてください
00:10:42「ここを太くしたんだ」と
00:10:43それで相手が信じてしまったら、それは失敗です
00:10:45ですから、これは私たちがエージェント自身に行わせる指示なのです
00:10:49するとエージェントはよく「うーん、どうだろう」と自己省察します
00:10:54「ここではあまり良い仕事ができなかったな」と
00:10:57形容詞は軽い言葉です
00:11:00「軽い言葉（light word）」はドイツ語的な表現ですが、マット・ポコックも最近この話をしていまして
00:11:06彼も非常に素晴らしいスキルをいくつか作っています
00:11:08なので、これは彼のツイートからパクったものです
00:11:11でも、本当にその通りだなと感じています
00:11:15これらは、基本的に意味を吹き込み、意味を浸透させるための言葉であり
00:11:21それ自体に意味があります
00:11:22モデルにとってもすでに一定の意味を持っていますが
00:11:24それを自分が関心のある領域へと翻訳するわけです
00:11:29そして、適切な高度（抽象度）というのは本当に大きく変化します
00:11:34その高度では、どんな問題も解決できないと私は思います
00:11:39これも非常に重要な点です
00:11:40ただ、一番最初の段階にはまだ活用の余地があります
00:11:43例えば、単にアイデア出しをしたいときや、とにかく画面に何かを表示させたいとき
00:11:47あるいは最後の仕上げの調整をしたいときなどです
00:11:50現時点のAIは、作業の最後の5%、10%、あるいは20%の部分において、人間を置き換えられるほど優秀だとは思いません
00:11:57「良いもの」を「素晴らしいもの」にするためにはね
00:12:00それでも、実際に物事をより良くしてくれるのは確かです
00:12:04さて、私は20年以上ツールを作り続けてきました
00:12:07これで自分の年齢がバレてしまいますね
00:12:10でも、ツールを作るときはいつでも、まずはワークフローをマッピングします
00:12:13自分が手助けしようとしているターゲットユーザーの実際のワークフローはどうなっているかを考えるのです
00:12:17そして、デザインのワークフローは線形ではありません
00:12:20ごちゃまぜで複雑です
00:12:21多くの異なる段階があります
00:12:23さまざまな人が関わっています
00:12:25そのため、私はプロセスのあらゆる部分をマッピングし、こう考えました
00:12:28その道程における介入ポイントはどこにあるだろうか、と
00:12:31そして、その道程のなかでどうすればサポートできるだろうか、と
00:12:34まず初期化、つまりデザインの方向性を形作るプロセスから始まります
00:12:38それから、さまざまな動詞や形容詞を用いた作成・試行錯誤の段階へと移行し
00:12:44最終的な硬化と洗練のフェーズへと進みます
00:12:46そして最後に、デザインシステムへと差し戻すわけです
00:12:49技術的なクリーンアップや、デザインのクリーンアップを行います
00:12:53さて、ここに実装するかどうか実際には迷ったコマンドの例がひとつあります
00:12:58それは「オーバードライブ」と呼ばれるものです
00:13:01私は基本的に、完全にやり過ぎた（オーバートップな）ものを作ろうとするコマンドをimpeccableに組み込みました
00:13:08半分はジョークのようなものだったのですが
00:13:11人々はこの機能にもの凄く熱狂し、夢中になりました
00:13:15そしてとても気に入ってくれています
00:13:16これはその一例に過ぎませんが、一発勝負で作ったものではありません
00:13:20これは私が自分のシェーダーライブラリ「ラディアント・シェーダー」向けに作った、現実味のある事象の地平線（事象の地平）のシェーダーです
00:13:28ただ、これをさらにオーバードライブさせるために、実際にオーバードライブコマンドを使いました
00:13:33もっとバカバカしくするためにね
00:13:34なので、本当に実装していいか確信が持てないようなコマンドを思いつくこともあります
00:13:38そしてそれをコミュニティでテストしてみるのです
00:13:39一度定着すると、これを面白いと感じてくれる人が他にもたくさんいるんだと気付かされます
00:13:44おっと、ここからですね
00:13:49さあ、行きましょう
00:13:50よし
00:13:51後ろ盾のない形容詞は、単に少しマシなプロンプトでしかありません
00:13:54ですから、自分が使っているその言葉で何を意図しているのかを、エージェントにしっかりと伝えなければなりません
00:13:59学習データの中にあまりにも多くの異なる意味が含まれているため、きちんと指示してあげる必要があるのです
00:14:05さて、もう一つ別の話があります
00:14:08Impeccableを自動で使う方法についての要望を、本当に数多く受けてきました
00:14:14ものすごい数です
00:14:16本当に気が滅入るほどに
00:14:17少なくとも週に1回は、誰かが私にこうリプライを送ってくるんです。「こんな機能があったらクールじゃないですか？」と
00:14:21「Impeccableに全部の作業を勝手にやらせようよ」
00:14:24「もう自分でコマンドを決めなくて済むようにさ」とね
00:14:26でも、それは本末転倒です
00:14:27要点は、自分が最終的にどうしたいのかをコントロールする手段をあなたに提供することなのです
00:14:31一発でデザインを完了させるツールになることは決してありません
00:14:34意図しているのはそういうことではないのです
00:14:36そして私は絶対に――ええと、現在も出しっぱなしになっているプルリクエストがありますが、そういう理由で私はそれをクローズするつもりはありません
00:14:41「自動（オート）」モードなど存在しませんし、今後も作りません
00:14:46私の意見では――次の登壇者の何人かにとっては少し居心地の悪い話かもしれませんが――センスは拡張できない、と考えています
00:14:54いや、訂正します。センスは拡張できると思います
00:14:56私はこれを「拡張された手腕（アンプリファイド・クラフト）」と呼んでいます
00:14:58ツールと一緒に作業をすることで、自分のセンスを研ぎ澄まし、より多くのセンスを引き出すことができると考えています
00:15:04ですが、人工的に培養できるものだとはどうしても思えません
00:15:07センスというものは、定義上、文脈に依存するものだからです
00:15:12それは文化的なものです
00:15:13希少なものです
00:15:15そして、誰もが同じものを複製し始めると、それは途端に濁ったものになってしまいます
00:15:20私たちはそれをもう「センス」とは見なさないのです
00:15:23それが私の意見です
00:15:24これが非常に物議を醸すトピックであることは分かっていますが、私は自分のツールでセンスを自動生成しようとしているわけではありません
00:15:32私からの発表は以上です
00:15:33今回は、デザインにおける適切なコントロールレベルを見つけることについてお話しました
00:15:36本当にありがとうございました
00:15:37何か質問があれば、いくつか答える時間が残っていると思います
00:15:40ありがとうございました
00:15:54また次回お会いしましょう
커뮤니티 글
아직 글이 없습니다. 이 영상에 대한 첫 번째 글을 작성해 보세요!
이 영상에 대해 글쓰기