UXMILKallnight_システム開発でデザイナーは何をすればいい？
•
1 gostou•544 visualizações
システム設計の流れを前提としたデザイナーにおける考え方のアプローチをご紹介です。
Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (14)
Semelhante a UXMILKallnight_システム開発でデザイナーは何をすればいい？
Semelhante a UXMILKallnight_システム開発でデザイナーは何をすればいい？ (20)
UXMILKallnight_システム開発でデザイナーは何をすればいい？
- 1. システム開発でデザイナーは何をすればいい？ 株式会社 電通国際情報サービス 高見祐介 UX MILK All Night
- 2. 今宵お伝えしたいこと 2 00. はじめに 01. システム開発ノススメ 02. フェーズ別のアプローチ 03. 俺の屍を越えてゆけ 04. 負けたことがある ⛰ Hit the wall （言葉の壁）
- 3. 3 自己紹介 高見祐介 @aghome 電通国際情報サービス（ISID） グループ経営コンサルティング4部 / エクスペリエンスデザイン部 デザイン制作 G/Wデザイナー 10年 ホスティング/サービス事業 Wディレクター、UIデザイナー 5年 システム開発/販売事業 UX/UIデザイナー 2年∼ 人間中心設計スペシャリスト / さとなおラボ 3期生 トレラン / ソロキャン / 漫画
- 4. 4 ISIDについて
- 5. 5 ISIDについて
- 9. 9 要求なのか？要件なのか？設計なのか？ z要件定義 基本設計 （外部設計） 詳細設計 （内部設計） テスト 運用 保守 要求定義 実装 こうしたい、こうありたいという希望が「要求」 、 感 ⾒ 化 、AI ⾃動化 ？ 仕事 。夢 ERP ！
- 10. 10 要求なのか？要件なのか？設計なのか？ z要件定義 基本設計 （外部設計） 詳細設計 （内部設計） テスト 運用 保守 要求定義 実装 こうしたいを実現する条件が「要件」 中 機能⼊ 。 誰 何 管理 。 全部 解決 。 ？
- 11. 11 z要件定義 基本設計 （外部設計） 詳細設計 （内部設計） テスト 運用 保守 要求定義 実装 、 種類 ？ 任意 作 聞 ？ 完了 ？誰 ？ 要件を満たすための詳細な条件としての「仕様」 要求なのか？要件なのか？設計なのか？
- 13. 13 物事を全体的&体系的にとらえ、多くの視点 から構造化し可視化する 感性的なアプローチで観察、発想、試作を 何度も繰り返し共創する 不確実性を下げるための2つの思考 共感 問題定義 創造 プロト タイプ テスト 多視点 構造化 可視化 全体俯瞰 行動 パターン システム思考 × デザイン思考 デザイン思考システム思考
- 17. 17 要求定義フェーズ 体験価値設計 1. 調査・分析 • 価値マップ • KJ法 • 共感マップ 2. ユーザーモデリング • ペルソナ • ジャーニーマップ【AS-IS】 3. コンセプトメイキング • バリュー/アクティビティシナリオ • UXDコンセプトシート • ジャーニーマップ【TO-BE】 4. プロトタイピング • ペーパープロト • プロトタイプ みんなで価値想像しましょう！ 共通認識を作り、仮想のユー ザーになって理想の業務シーン を描きだします。 企画の背景が知りたい！ どんな人が使うの？ どんな課題があるの？ 共感実施項目
- 18. 18 要件定義フェーズ UI標準設計 • 稼働対象とするOSやブラウザ • 解像度 • レスポンシブルデザインの適用 • 画面様式 • 画面レイアウト • デバイスごとの画面幅 • 処理内容に応じた画面形式 • ボタンコントロールの配置 • エラー、確認メッセージの方針 • 画面名称、ID名 • 表示項目の統一 • ヘルプ形式 • プレースホルダーの表示 • キーボード操作 • 辞書 問題定義 UXMILK Dashboard Buttons Gallery Title 提供したい価値を叶える機能を 考えます。機能に必要なUIと様 式をルール化していきます。 表示する情報はこれ！ この画面で何ができること、 ページ遷移はこんな感じ！ 実施項目
- 19. 19 設計フェーズ ユーザビリティ設計 エンタープライズ系システムのユーザビリティ • データのやりとりが円滑であること • シンプルに業務が遂行できること • マニュアルを沿って業務を遂行できること • ユーザーが想定した動作が実行されること • キーボード操作で完結できること • 許容できる応答速度であること 設計からモックアップを作りま す。実際に操作して使い勝手を 対象ユーザーに検証してもらい ましょう！ 創造 プロト タイプ テスト 通常業務が問題なく行える？ 想像どうりの挙動？ 慣れと違和感の塩梅は？ 体感速度はあがった？ aghomeUXMILK ! Dashboard Widgets UIElements Base Advance Icons Buttons Gallery Forms Tables 実施項目
- 20. 20 実施したアクションの合意形成 1. 画面イメージを検討し、該当業務プロセスで必要とされる機能を洗い出そう 2. 早い段階からUI画面のレイアウトと仕様項目のイメージをつかもう 3. 画面遷移と発生イベントを優先的に確認しよう aghomeUXMILK ! Dashboard Widgets UIElements Base Advance Icons Buttons Gallery Forms Tables Cards status 34,152 5,643 47,842 +12.58% 0 25 50 75 100 4月 5月 6月 7月 8月 9月 10月 TOTAL PROFIT ACTIVITY New Sale It's unfortunate weather today. Message It's unfortunate weather today. New Report It's unfortunate weather Users Transaction UXMILK ! Dashboard Widgets UIElements Base Advance Icons Buttons Gallery Forms Tables Cards status 34,152 5,643 47,8 0 25 50 75 100 4月 5月 6月 7月 8月 9月 10 TOTAL PROFIT Users Transaction Cancel No ←Back There is an error in the input information aghome 承認修正編集破棄
- 28. 28 DNFを続けたからわかってきたこと ビジネスサイドのコンセプトを咀嚼し、仕様へ落とし込むための言語化を行う 客観的な視点を持ち、リアリティある利用シーンをシナリオに落とし込む 言語化 01
- 31. 31 アジャイルソフトウェア開発宣言 個人と対話 包括的 動くソフトウェア 契約交渉 顧客との協調 計画 従 変化への対応 引用元：https://agilemanifesto.org/
- 33. 33 参考文献
- 34. 粒度 Hit the wall 01 （りゅうど） ⼀
- 35. 【粒度】 処理の細分化の単位。 テーブルや表などのデータセットにおいて、データの細かさを表す指標。 例）会員マスタは、会員IDひとつにつき、データが1件格納されている 「オブジェクトの粒度的にはこれくらいがいいんじゃね？」 Hit the wall 01 ⼀ 出所：gixo
- 36. トランザクション （とらんざくしょん） Hit the wall 02 ⼆
- 37. 【トランザクションデータ】 企業の情報システムなどが扱うデータの種類の⼀つで、業務に伴って発⽣ した出来事の詳細を記録したデータのこと 例）原料などの購買、製品の⽣産、社員への給与の⽀払い、経費の精算 対義語：マスタデータ Hit the wall 02 ⼆ 出所：IT⽤語辞典
- 38. 帳票 （ちょうひょう） Hit the wall 03 三
- 39. 【帳票】 帳簿や伝票、申込書など、業務や取引に必要な情報の記⼊や印刷のために ⽤いられる定型的な書類の総称。画⾯ではない。 例）レポート（報告書・分析資料・同意書・問診票） 帳簿類（出納帳・仕訳帳・売上帳・各種台帳・財務諸表） 伝票類（⾒積書・発注書・注⽂書・請求書・領収書・納品書・明細書・通知書） Hit the wall 03 三 出所：e- Words
- 40. Font：游ゴシック体, 游教科書体, Avenir Next, Flood Std Photo：Designed by wirestock / Freepik 終 制作・著作 🍺 Thanks cheers!