管理画面をなくした話 DIST.25 LT資料

Slide 1

Slide 1 text

激しい変化の中で個別最適された管理画面

Slide 2

Slide 2 text

自己紹介主にエンジニアプロのプログラマ、認定スクラムマスター、UX見習い武田

Slide 3

Slide 3 text

本日のまとめあるECサイトの「管理画面」を限りなく無くしたという話 ※ 管理画面のLTで管理画面をなくす話ですみません… ※ • HTMLも直接書き換える • SQLも直接書く

Slide 4

Slide 4 text

さて、"管理画面" の話をする前に…… 画面とは？国語辞典より 1. 描かれている絵の表面 2. 映画やテレビなどの映像

Slide 5

Slide 5 text

なんで画面が必要なの？

Slide 6

Slide 6 text

ID name account email ・・・ □ 100 aaa @aaa aaa@bbb □ 123 takeda ～～～ ccc@ddd UPDATE SET account='～～～' WHERE id=123; 機能としては同じ

Slide 7

Slide 7 text

昔々はいわゆる「画面」なんてなかったいわゆる「黒い画面」のコマンドですべてをやっていたでも、みんな画面ほしがった > ls ./ ../ bin/ dev/

Slide 8

Slide 8 text

「画面」の効果とは？ • 普段の生活に近い感覚で操作ができる • マウスで操作できる • なんとなく簡単な気がする • 画面があればエンジニアじゃなくても出来る気がする

Slide 9

Slide 9 text

「エンジニアじゃなくても出来る」とは？つまり「効率」と「効果」のトレードオフ効率効果

Slide 10

Slide 10 text

.cta{}#custom-links- edit{}#custom-links- edit-dialog{}.default- theme{}#dood{}#error- notice{}#error-notice- container{}#error- notice-link{}#error- notice- msg{}.fkbx{}#fkbx- text{}.float- down{}.float-up{}.has- link{}.hide- index.html タイトル本文画像効果効率使うのは簡単！でも出来ることが限られるなんでもできる！でも使うのが難しい

Slide 11

Slide 11 text

閑話休題（それはさておき）

Slide 12

Slide 12 text

「画面」は良いとして「管理」とは？「画面の変更」「ユーザ情報の確認」サービスを提供するために不可欠な機能。管理はサービスの一機能（サービスに含まれるもの）

Slide 13

Slide 13 text

ここで改めて「管理画面」ってどういうイメージだったでしょうか？

Slide 14

Slide 14 text

ユーザエンジニアオペレータユーザエンジニアオペレータ管理画面どっち？管理画面

Slide 15

Slide 15 text

ユーザエンジニアオペレータユーザエンジニアオペレータ管理画面こっち！管理画面

Slide 16

Slide 16 text

・画面の話 "効率と効果の話" ・管理の話 "one teamの話" つまり何が言いたいのか？

Slide 17

Slide 17 text

まず「効果」を最大にするためには「黒い画面」を使おう！

Slide 18

Slide 18 text

え? エンジニアじゃないから HTMLなんて書けない？？やっぱり管理画面がほしい？？？

Slide 19

Slide 19 text

いえいえ… 1人でやる必要なんてありませんよエンジニアとあなたは "One Team" ですよチームで実現できるならそれで良いじゃないですか

Slide 20

Slide 20 text

閑話休題（それはさておき）

Slide 21

Slide 21 text

抽象的な話ばかりだったので…… とあるECサイト作ってました {Title1} Title2 ……………………………… …………………… …………………… Image(jpg) logo 商品編集画面タイトルタイトル画像（.jpg）タイトル２

Slide 22

Slide 22 text

「商品の魅力訴求のために動画を使いたい！！動画使えますよねっ！？」商品画面編集タイトルタイトル画像（.jpg）タイトル２「え… 管理画面に .jpgって書いてありますよね…… 動画使えませんよ…？」「そうですよね……すみません」ある時…

Slide 23

Slide 23 text

Σ(ﾟ□ﾟ；)これじゃダメっ！やりたいこと＜管理画面だっけ？違うよね？？

Slide 24

Slide 24 text

Σ(ﾟ□ﾟ；)これじゃダメっ！やりたいこと＞管理画面だよね？

Slide 25

Slide 25 text

管理画面を捨てました！ {Title1} Title2 ……………………………… …………………… …………………… Image(jpg) logo 商品画面編集タイトルタイトル画像（.jpg）タイトル２エンジニアオペレータ

Slide 26

Slide 26 text

管理画面を捨てました！ logo 商品画面編集タイトルタイトル画像（.jpg）タイトル２エンジニアオペレータ New Item!! Movie ♡

Slide 27

Slide 27 text

管理画面という制約を捨てたことでよりユーザに価値を届けられるECサイトに変貌したという話でした

Slide 28

Slide 28 text

！！注意！！環境変化が激しい少品種少量のECだからできた技です。これはAmazonみたいな安定・多品種・大量のサイトでは無理です。 Cost 管理画面作りこみ手作業 Cost 管理画面作りこみ手作業環境変化 ↓ 環境変化 ↓ 環境変化 ↓ Time Volume Time Volume

Slide 29

Slide 29 text

！！注意！！逆に言うと変化が激しい世界にいるなら管理画面を作るより手作業でone teamで効果を求める方が安くて・うまいかもしれません。 Time Volume Cost 管理画面作りこみ手作業 Time Volume Cost 管理画面作りこみ手作業環境変化 ↓ 環境変化 ↓ 環境変化 ↓

Slide 30

Slide 30 text

閑話休題（それはさておき）

Slide 31

Slide 31 text

まとめ

Slide 32

Slide 32 text

ということで、「オペレータ」「管理画面」「エンジニア」という垣根を壊して１つの「サービス」と再定義することで、効果をとった、という話でした。

Slide 33

Slide 33 text

管理画面は「誰かが作ってくれるからそれを使う」という他人行儀なものではなく、サービスそのものサービスをよりよくするための「道具」ユーザーにより良い価値を届けるための「道具」

Slide 34

Slide 34 text

－穴ではなくドリル－ユーザは穴が欲しいのかもしれませんが、われわれはドリルを作ってます。必要なときに必要なサイズの穴をユーザーに届けたい。管理画面というのは決められたサイズの穴ではなく優秀なドリルであって欲しいと思います。

Slide 35

Slide 35 text

ご清聴ありがとうございました m__m