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
出口 裕貴
January 23, 2024
Design
720
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
デザインテクノロジストが先導する プロダクト開発の世界
2024/01/23 に開催された、Spectrum Tokyo Meetup #08 で発表したスライドです。
出口 裕貴
January 23, 2024
More Decks by 出口 裕貴
See All by 出口 裕貴
初めてのClaude Code
degudegu2510
0
19
AIを活用したアクセシビリティ改善フロー
degudegu2510
1
240
Tripo MCP × Cursorで始める 手軽な3Dモデル生成の世界
degudegu2510
0
500
はじめての自作キーボード制作
degudegu2510
0
46
Figma Plugin開発は面白い!
degudegu2510
1
220
社内を動かすアクセシビリティ戦略
degudegu2510
1
370
ダークテーマとアクセシビリティの融合したカラートークンの設計
degudegu2510
9
8.1k
最速で価値を届けるUXリサーチ
degudegu2510
5
1.5k
Qiitaアクセシビリティ史 ~ Qiitaの歩んできた道 ~
degudegu2510
0
3.1k
Other Decks in Design
See All in Design
「親切なオンボーディング」 が招く罠 ー AI時代のUXデザイン
godlingkogami
1
150
Basket_of_love.pdf
terencebasart
0
240
富山デザイン勉強会_プレゼンテーション.pdf
keita_yoshikawa
0
110
少人数チームで_使われるプロダクトにたどり着くための_デザインハーネス.pdf
nishame
1
1.3k
AI時代に求められるUXデザインのアプローチ
xtone
1
7.6k
「バイブコーディングって何?」から始まった、 AIとの一年間と、その先のこと
seto
0
1.1k
デザインツールを開く前に その画面は誰に何と言わせたい?受託UIデザイナーが顧客解像度を高める 「打ち合わせの場での確かめ方」
garyuten
1
160
凡庸を落とすハーネス
hiromimaeo
1
760
CULTURE DECK/Frontend Engineer
mhand01
0
1.5k
【CEDEC2026】『Shadowverse: Worlds Beyond』続編開発におけるUIデザイン・アニメーション演出の「超進化」 ~継承と挑戦を両立するデザイン手法~
cygames
PRO
2
4.5k
ISO 9241-171:2025っていうのがあってな
shosira
1
240
トランジションの冒険 自分と世界を変える冒険の書 / Transition Adventure
dmattsun
2
280
Featured
See All Featured
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
450
The Curse of the Amulet
leimatthew05
2
14k
Java REST API Framework Comparison - PWX 2021
mraible
34
9.6k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.1k
Designing for humans not robots
tammielis
254
26k
Reality Check: Gamification 10 Years Later
codingconduct
0
2.2k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.2k
Site-Speed That Sticks
csswizardry
13
1.4k
Become a Pro
speakerdeck
PRO
31
6.2k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.9k
Transcript
デザインテクノロジストが先導する プロダクト開発の世界 Qiita株式会社 出口 裕貴
Qiita株式会社 デザインG マネージャー・Qiita PdM X:@degudegu2510 デザイン, フロントエンドに関連する情報を中心に発信している DEGUCHI HIROKI 出口
裕貴
「デザインテクノロジスト」 という役割をご存知ですか?
デザインとエンジニアリングの領域を理解して その2つの領域のスキルを使って働く役割 デザインテクノロジストとは Designer Engineer
最近は、デザインとエンジニリングの壁がなくなっている デザインテクノロジストとは Designer Engineer
デザインとエンジニアリングのスキルを使いプロダクト開発をする デザインテクノロジストとは Designer Engineer
デザインエンジア 工学分野のデザインとハードウェアのエンジニアリングを専門とする役割 デザインエンジニアとUXエンジニア Designer インダストリアル 組み込み技術 ハードウェア開発 ソフトウェア開発 製造技術 構造・電気設計
Engineer
UXエンジア デザインの知識を用いてプロダクトを開発するエンジニア デザインエンジニアとUXエンジニア Designer UX / UI フロントエンド コンポーネント設計 SEO
リサーチ 体験設計 Engineer
デザインテクノロジスト 「リサーチ〜設計〜実装〜リリース」全般を担当する役割 デザインエンジニアとUXエンジニア Designer UX / UI フロントエンド コンポーネント設計 SEO
リサーチ 体験設計 Engineer
Qiitaの事例を紹介しながら デザインテクノロジストが プロダクト開発において どのような役割があるのかを説明します!
エンジニアに関する知識を記録・共有するための記事投稿サービス Qiitaとは
デザインG 全員がデザインテクノロジスト 機能の企画〜リリースまで担当しています。 QiitaのデザインG
Qiitaのデザインテクノロジストの役割 GF UXを向上させるこ4 8F アクセシビリティを向上させるこ4 CF ユーザーの声を聞くこと
UXを向上させること
デザインとエンジニアリングのスキルがあるからこそ UXを向上させること デザインデータで表現できないような体験にも こだわってデザイン・開発することができる etc. アニメーション, キーボード操作 デザインデータで表現できないような体験にも こだわってデザイン・開発することができる etc.
アニメーション, キーボード操作
記事投稿体験の改善 Before After エディタのUIの変更・キーボード操作できるようにする
記事投稿体験の改善 投稿中の画面 投稿後の画面 アニメーションやライディングもこだわる
UXを向上させること デザインデータで表現できないような体験にも こだわってデザイン・開発することができるため プロダクトのUX向上が役割の1つ デザインデータで表現できないような体験にも こだわってデザイン・開発することができるため プロダクトのUX向上が役割の1つ
アクセシビリティを向上させること
アクセシビリティの改善 デザインとエンジニアリングのスキルがあるからこそ アクセシビリティ改善にも こだわってデザイン・開発することができる etc. WCAG, コントラスト比 アクセシビリティ改善にも こだわってデザイン・開発することができる etc.
WCAG, コントラスト比
アクセシビリティの改善 コントラスト比を考慮した配色 スクリーンリーダーのため改善 UI上・コード上 両面からアクセシビリティの対応ができる
アクセシビリティの改善 UI上・コード上 両面から改善が必要な アクセシビリティ改善も役割の1つ UI上・コード上 両面から改善が必要な アクセシビリティ改善も役割の1つ
ユーザーの声を聞くこと
ユーザーの声を聞く ヒアリング 〜 デザイン 〜 開発を全てできるから スピード感を持ってユーザーの意見を プロダクトに反映させることができる etc. 開発リードタイムが短くできる
スピード感を持ってユーザーの意見を プロダクトに反映させることができる etc. 開発リードタイムが短くできる
ユーザーの声を聞く Qiita Discussions 実装 開発リードタイムが短いことで、ユーザー満足度が高い
ユーザーの声を聞く スピード感を持ってユーザーの意見を プロダクトに反映させるこも役割の1つ スピード感を持ってユーザーの意見を プロダクトに反映させるこも役割の1つ
まとめ Designer UX / UI フロントエンド コンポーネント設計 SEO リサーチ 体験設計
Engineer デザインテクノロジストは、DesignとEngineeringのスキルを使って 「リサーチ〜デザイン〜実装」全般を担当する役割
プロダクト開発を先導して ユーザーに価値を提供している デザインテクノロジストは プロダクト開発おいて不可欠な存在