Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
つくり方を変えていく | change-how-we-build
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
mottox2
March 25, 2026
Design
1.5k
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
つくり方を変えていく | change-how-we-build
mottox2
March 25, 2026
More Decks by mottox2
See All by mottox2
もう一歩進めたい OG画像の動的生成
mottox2
7
3k
なぜコピペで使うコンポーネント集を利用するのか?
mottox2
8
7.6k
UIコンポーネントライブラリをうまく使うためにできること / components-with-designer
mottox2
7
4.1k
Figma Plugin公開までの壁を乗り越える
mottox2
3
4.2k
Puppeteerでつくる画像と動画 / images and videos made with puppeteer
mottox2
0
820
手触りのよいウェブを考える / better-mobile-web
mottox2
3
2.1k
組織と権限とSlack App / slack-app-with-roles
mottox2
1
750
SSRを避けるためにやっていること / ssr-alternative
mottox2
9
3.3k
JSXでつくる宣言的UIなプレゼンテーション / jsx-presentation
mottox2
7
34k
Other Decks in Design
See All in Design
AIが作るデザインの レビューコストと向き合って分かったこと. -正社員デザイナー1人の組織でデザインハーネスを立ち上げた話-
hidekiietaka
1
360
Typographie et intégration web
goetter
0
190
ボタンUIの冪等性の話をしたらVimmerに刺さっちゃった
ottatto
3
1.9k
Webデザイナー中田美穂_ポートフォリオ
omy
0
220
The decksh tutorial
ajstarks
1
130
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
ayumidesign
0
290
明日から真似できる、AIでデザインシステムを活用する方法
vivion
0
960
インターンから2年新卒フロントエンドエンジニアから見たサイボウズのアクセシビリティ
taku10101
0
200
クリエイティブディレクター 両角 高寛 の自己紹介
morogyro
0
260
AI-DLC AI駆動開発ライフサイクルとAI-DLC Worlflows V2のご紹介
fatsushi
4
1.9k
デザインレビューを「他者へのおすそわけ」に再定義し、たのしい場にする試み
webnaut
2
170
デザインハーネス 〜AIが生成する"デザイン"の妥当性を、誰がどう担保するのか〜 / PdEConf2026 Design Harness
kgsi
14
23k
Featured
See All Featured
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
290
Mobile First: as difficult as doing things right
swwweet
225
10k
First, design no harm
axbom
PRO
2
1.4k
A Soul's Torment
seathinner
8
3.9k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
23k
Color Theory Basics | Prateek | Gurzu
gurzu
1
510
Everyday Curiosity
cassininazir
0
390
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
620
What does AI have to do with Human Rights?
axbom
PRO
1
2.5k
Darren the Foodie - Storyboard
khoart
PRO
4
4.1k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
5
890
Transcript
つくりかたを変えていく UIデザイナー・ウェブフロントエンドエンジニア @mottox2
もっと @mottox2 ウェブバックエンドエンジニア → ウェブフロントエンドエンジニア → UIデザイナー 自分の書くコードの8割がAI Agent産
今日話したいこと 作るものが変わってきている 作り方も変わってきている 変わってないこともある
AIでつくられるもの ① 今までのワークフローをAIによって再現・効率化していく ② 今までつくらなかった・つくれなかったものを作る
つくられてこなかったもの 運用のコスパが悪いもの 車輪の再発明で避けられるもの わざわざ作るまでもないもの・くだらないもの これらは従来、 作る判断をしなかった
わたしのスタンス ① 今までのワークフローをAIによって再現・効率化していく ② 今までつくらなかった・つくれなかったものを作る
わたしのスタンス ② 今までつくらなかった・つくれなかったものを作る 今までのをっ・く
わたしのスタンス 趣味をより楽しむためのソフトウェア開発 ソフトウェア開発をした 趣味のをした
今までやってきた方法を 意図的に変えてやっている まで でにままできるでま
AIに名言をでっち上げてもらい、 気持ちを上げたかった
スマホを使って弦楽器っぽいのものをつくりたかった
macOSの端においておけるチューナーがほしかった
耳コピに特化した音声プレイヤーが欲しかった
おしごとでは… ノベルゲーム風診断サイト 診断サイトノベルゲーム 診断Gゲ風ト OG画像生成サービス G OG画像生成
これらのアプリは AIがあったからこそ作っている
どうやって作っているのか?
とりあえずつくる (試作) 探索フェーズの実装はカジュアルにやらせる 自分では思いがけないものが実現できることもある つくりかたで一番変わった部分 AI開発以前、 自分が一番バリューを出していた部分😢
これは作れないだろう と決めつけずに作らせてみる るにとられ 作れる作らせて
「これだ!」 と思ったらちゃんと作る ここるれると思 だらこるとる
ちゃんとつくる段階では人間が関与する
AI駆動開発の落とし穴 VibeCoding的な進め方だと違法建築UIになりがち 実際にできたUIだと触れるのはいい反面、 プロトタイプの UIに引きづられることに注意 機能追加するたび複雑に、 本来のコア機能が埋もれて いったり、 適切な構造からかけ離れてしまう
None
None
None
なにをしたのか カラースキーマの調整 余計な機能を削る 全体のレイアウトの見直し 細かい調整
VibeCoding時代にもUIで考えること eignengineeind
作ってもいらないなら消す
定期的に全体の構造を見直す
最後の調整はちゃんとやる
VibeCoding時代にもUIで考えること 作ってもいらないなら消す 定期的に全体の構造を見直す 最後の調整はちゃんとやる
さいごに 今までは作らなかったもの、 が作れる時代になっている 今までどおりやる箇所もあれば、 今までとは違う方法になっ ている箇所もある た作り方にはありま
もっと @mottox2