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
わたしたちのコーディングのUX
Search
m-yoshiro
June 03, 2020
Design
1
220
わたしたちのコーディングのUX
プロダクトのUXを向上するためには、開発者自身のUXも重要です。
この資料では、開発者のコーディングのUXにフォーカスして述べました。
UX JAM Online #4 で発表した資料です。
m-yoshiro
June 03, 2020
Tweet
Share
More Decks by m-yoshiro
See All by m-yoshiro
雑に出してみるデザイントークン適用率
myoshiro
0
91
デザイントークンの適用率計測とその活用
myoshiro
0
980
画像の減色処理とOctree
myoshiro
1
240
CSS Houdiniであそぶ
myoshiro
0
110
Template Literal Typesであそぶ
myoshiro
1
150
Selector-2-regexp というツールを作った
myoshiro
0
200
Data Studio Community Visualizationを触ってみた
myoshiro
1
490
UIデザインと関わろう
myoshiro
0
460
Atomic Design てなぁに?
myoshiro
3
540
Other Decks in Design
See All in Design
3 Reasons Why I Got into Design
harukausui
1
150
Baby Bear Genius
yvonnehsuanho
PRO
0
630
Credence
lratmansunu
0
220
拡大するマルチプロダクトSaaSの顧客理解にデザイン組織はどう取り組んでいるか / RAKUSTechCon2024_Design
rakus_dev
0
1.9k
Minuto de Aventura
olgastoryboard
0
160
デザイナー視点の体験設計とデザインレビューを事業部全員で体験するワークショップをしたお話
masayofff
2
160
Dreamia
elsh
0
130
DMMデザイナーのプロダクトへの携わり方と組織再編
takumasaito
1
360
アジャイル開発におけるFigmaAI新機能の活用
abokadotyann
1
140
Blender 4.1 で レッツ Vket Cloud!
kamera25
0
270
DMMデザイン組織の生成AI導入プロセス - Adobe Fireflyと振り返る約1年とこれから -
takumasaito
1
290
インターフェースのユーザビリティ概論および調査手法について
readymadegogo
0
170
Featured
See All Featured
What's new in Ruby 2.0
geeforr
340
31k
Writing Fast Ruby
sferik
623
60k
Into the Great Unknown - MozCon
thekraken
29
1.4k
Designing with Data
zakiwarfel
98
5.1k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
2
210
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.4k
Code Reviewing Like a Champion
maltzj
518
39k
It's Worth the Effort
3n
182
27k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
26
4k
Designing for humans not robots
tammielis
248
25k
Transcript
コーディングのUX 松本 芳郎 / GMOペパボ株式会社 わたしたちの UX JAM Online #04
#about-me { name: 松本 芳郎; twitter: @bennkyougirai;
/* GMOペパボ株式会社 デザイナー / UXエンジニアリング */ }
コーディングのUX わたしたちの
コーディングのUX わたしたちの 実装の話はしません
コーディングのUX わたしたちの 実装の話はしません なんの話?
コーディングのUX わたしたちの 実装の話はしません コーディングに携わる開発者のUX
調査・分析・ 設計 開発 UIデザイン コーディング グロース リリース
調査・分析・ 設計 開発 UIデザイン コーディング グロース UXの文脈でスポットがよく当たるフェーズ リリース
調査・分析・ 設計 開発 UIデザイン コーディング グロース この発表が対象とするフェーズ リリース
UX サービスのユーザー ではなくて コーディングに携わる開発者 とさせていただきます。 前提 1
コーディング HTML CSS JS この発表では、 HTML・CSS・JSなどでUIの実装を行うこと とさせていただきます。 前提 2
デザイナー エンジニア コーディングに携わる の開発体験が プロダクトのUXの価値向上のために重要である 本発表の主張
なぜコーディングが UXに重要なの?
コーディングは プロダクトのデザインの 最終実装を担うから
UIデザインや設計は、 HTML・CSS・JSで実装されて 初めてユーザーが利用できるようになる。 デザインの最終的な品質を左右する重要な工程。
調査・分析・ 設計 開発 UIデザイン コーディング グロース 例えば、これらのフェーズの取り組みが大変素晴らしくても… リリース
None
反応が遅い そもそも表示が崩れている スクロールが 引っかかる
反応が遅い そもそも表示が崩れている スクロールが 引っかかる UIでの体験を損なう
調査・分析・ 設計 開発 UIデザイン コーディング グロース コーディングの質がUIの品質に大きく影響する リリース
https://developers.google.com/web/fundamentals/performanc e/why-performance-matters?hl=ja パフォーマンスが重要なのはなぜか | Web Fundamentals
品質が悪くなる要因 • リソース不足 • 期限 • コードが書きづらい • レガシーコード •
一貫したルールがない
品質が悪くなる要因 • リソース不足 • 期限 • コードが書きづらい • レガシーコード •
一貫したルールがない コーディングの体験が損なわれている
開発のUXを改善するには?
開発のUXを改善するには? • ツールの整備 • 自動化していく • レガシー環境の リファクタリング チーム
開発のUXを改善するには? • ツールの整備 • 自動化していく • レガシー環境の リファクタリング • 自分の使っている道具に関心
をもつこと(エディタとか) • プロセスに関心をもつこと チーム 個人
デザイナー エンジニア コーディングに携わる の開発体験が プロダクトのUXの価値向上のために重要である 本発表の主張
ご清聴ありがとうございました