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
51
デザインエンジニアへの道
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
570
UIデザインとフロントエンド実装のレビュープラクティス集
shin_k_2281
0
240
Wantedly の Dropdown UI カイゼンの道(調査・設計編)
shin_k_2281
2
280
エンジニアのためのFigma
shin_k_2281
0
51
知った気になれるUX心理学用語
shin_k_2281
0
110
OOUIを知る
shin_k_2281
2
69
Featured
See All Featured
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.5k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
How to Ace a Technical Interview
jacobian
279
23k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
A better future with KSS
kneath
239
17k
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デザイン⽅⾯でも バリューを出せるようになり デザインエンジニアを名乗れる くらいになる 何らかのマネージャーに …?