Naoto Oguri

UIUXデザイン×Claude Codeが生む体験

これまでの対話型AIの課題である。会話の流れの可視化をすることで思考を貯蔵庫とするプロダクトとして開発。

Thinker -思考OS-

以前作成した、「それ、買うbuy?」では「買う判断を抑制するため」のものであったため、対となる「買い物の基準を自分の中で定める」という視点が必要だと考え、
要件・設計：Gemini、実装：Claude Codeを使い、9時間でアウトプットをしました。

それ、ナイスBuy！

イタリア名所クイズについて体験設計を言語化し、単なる感覚や属人化ではなく、どのように体験を生み出すのかを体系化するため言語化しました。

体験設計の思考プロセス

開発思考ログ

「昨日の夜に思いつき、先ほどデプロイしました」Claudeで超速MVP開発。

原点回帰

思考OSのアプリ開発をして感じたこと

UIUXの先に、ビジネスの数字を接着するには…。

AI社会だからこそ必要な人間臭さを思い出しました。

ポケモンから学んだ体験の核

「“街の風景に惹かれる感覚”の先行体験」

訪問者が「イタリアに行きたい」と感じる体験を目指し、画像配置を固定せずリズムを持たせることで視覚的な没入感を設計。モダンなUI設計により高級感の演出につなげています。開発当初はHTML / CSS / JavaScript（jQuery）での実装でしたが、
UX向上や、将来的な拡張性を踏まえ、Next.js（SSG)へ移行しました。

一方で、main visualの大型画像によるLCP悪化がUX低下要因と分析。
画像よりもテキストを先に認知させる構成を検討しました。また、スライドのpreloadによる全体読み込み遅延リスクを考慮し、安易な最適化を避ける判断を行いました。

Lighthouse（Slow 4G）での計測および実測環境との比較を行い、
LCP・TBTの差分を検証するなど、体験とパフォーマンスの両立を意識しています。
今後も軽量化・最適化を継続して行う方針です。

デザイン企画・開発は2022年頃ですが、現在も改善を続けております。

Aurora - Italian Travel

イタリア名所クイズ

なぜ、PdM・プロダクトエンジニアを目指すのか

真俊 横田

さくらインターネット株式会社, 執行役員

Takahiro Kubo

アマゾンウェブサービスジャパン合同会社, Developer Relations Machine Learning