Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
デザインエンジニアへの道
Search
shintaro
March 12, 2025
0
53
デザインエンジニアへの道
shintaro
March 12, 2025
Tweet
Share
More Decks by shintaro
See All by shintaro
Role of frontend engineer at product growth team
shin_k_2281
0
600
UIデザインとフロントエンド実装のレビュープラクティス集
shin_k_2281
0
250
Wantedly の Dropdown UI カイゼンの道(調査・設計編)
shin_k_2281
2
280
エンジニアのためのFigma
shin_k_2281
0
52
知った気になれるUX心理学用語
shin_k_2281
0
110
OOUIを知る
shin_k_2281
2
71
Featured
See All Featured
Writing Fast Ruby
sferik
629
62k
The Invisible Side of Design
smashingmag
301
51k
BBQ
matthewcrist
89
9.8k
Git: the NoSQL Database
bkeepers
PRO
431
66k
How STYLIGHT went responsive
nonsquared
100
5.8k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
A designer walks into a library…
pauljervisheath
209
24k
Why Our Code Smells
bkeepers
PRO
339
57k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
189
55k
The Straight Up "How To Draw Better" Workshop
denniskardys
237
140k
Transcript
© 2025 Wantedly, Inc. デザインエンジニアへの道 Jan. 22 2025 - Shintaro
Kawabe エンジニア交流会 #2 ~エンジニアのキャリアを考える LT~
© 2025 Wantedly, Inc. 自己紹介 shintaro kawabe sh1ntaro_dev s-kawabe 所属
ウォンテッドリー株式会社 ・Visit Growth Squad ・Frontend Chapter ・Design System Guild React / TypeScript / Figma / Design System 好きな 技術 ポーカー / カラオケ / クラフ トビール 趣味 s_kawabe
© 2025 Wantedly, Inc. 目次 1. デザインエンジニアとは? 2. エンジニアがデザインを学ぶ方法 3.
デザインエンジニアへの道
© 2025 Wantedly, Inc. デザインエンジニアとは?
© 2025 Wantedly, Inc. デザインエンジニアとは? 定義1 デザイン・エンジニアとは、さまざまな工学分野(土木、機械、電気、 化学、繊維、航空宇宙、原子力、製造、システム、構造/建築/建 築など)や、ヒューマン・コンピュータ・インタラクション(HCI)などの デザイン分野において、エンジニアリング・デザイン・プロセスに重
点を置くエンジニアのことである。 https://en.wikipedia.org/wiki/Design_engineer
© 2025 Wantedly, Inc. デザインエンジニアとは? 定義2 デザインエンジニアは、デザインとエンジニアリングの橋渡し役を担 うロールです。ユーザー体験 (UX) と技術的実現性の両方を深く
理解し、デザインの意図を忠実に製品へ反映させる役割を果たし ます。以下は、デザインエンジニアの特徴や役割の詳細です。 chatGPT
© 2025 Wantedly, Inc. デザインエンジニアとは? 求められる仕事 • UIデザインの生成 • フロントエンド実装、コンポーネント実装
• プロトタイピング(デザイン、コード) • デザイナーとエンジニアのコミュニケーションの強化 ◦ デザインシステムの整備 ◦ ドキュメンテーション • プロダクトのアクセシビリティ品質の向上
© 2025 Wantedly, Inc. デザインエンジニアとは? デザインとフロントエンドの 両方の専門知識が必要
© 2025 Wantedly, Inc. エンジニアがデザインを学ぶ方法
© 2025 Wantedly, Inc. エンジニアがデザインを学ぶ⽅法 • まずは基礎を学ぶ ◦ デザイン4原則、OOUI、情報設計、配色 …etc
◦ 本やUdemy、Youtubeなど • デザイナーと近い場所でエンジニアとして働く ◦ 日々デザイナーのアウトプットを観察、 FBする、気づきを得る ◦ コミュニケーションの課題を発見する • 自らFigmaデザイン→実装の流れを体験する ◦ 個人開発などでFigma力を養う、デザイン↔コードの間にある課題を自ら体 感する • 世の中のプロダクトを観察する • 世の中のデザインシステムを観察する
© 2025 Wantedly, Inc. デザインエンジニアへの道
© 2025 Wantedly, Inc. デザインエンジニアへの道 デザインとフロントエンドの 両方の専門知識が必要 と言っても...
© 2025 Wantedly, Inc. デザインエンジニアへの道 まずは、エンジニアとして一人前を目指そう
© 2025 Wantedly, Inc. デザインエンジニアへの道 Webエンジニアになる Reactしかできない 3年⽬ 6年⽬ 9年⽬
n年⽬ 今はこの辺り Next.jsなどのエコシステム GoやRailsも少しできる この辺りでエンジニアとして 満⾜のいくレベルに 仕事としてデザイン関係 にチャレンジし始める 明確にUIデザイン⽅⾯でも バリューを出せるようになり デザインエンジニアを名乗れる くらいになる 何らかのマネージャーに …?