Tweet
Tweet

Slide 1

Slide 1 text

UIを完全に理解して、 プロダクトをチョット良くする Kazuto Ushijima 2022/10/26 UI/UXデザイナーLT会 - vol.9

Slide 2

Slide 2 text

È 牛嶋一登 / Kazuto Ushijima / tojima È バックエンドエンジニア@ファンコミュニケーションズ È 趣味はランニングとサウナ È 今週末、BMWのバイク納車予定 @tojima 自己紹介

Slide 3

Slide 3 text

課題

Slide 4

Slide 4 text

背景 プロダクトの新規機能開発時、以下のようなサイクルが回る デザインワカラン 意思決定しづらい プロダクトがダサい

Slide 5

Slide 5 text

9 「デザイン(UI)完全に理解した」を目指T 9 「完全に理解した」製品を利用をするためのチュートリアルを完了で きたという意味1 9 引用: https://twitter.com/ito_yusaku/ status/1042604780718157824 9 プロダクトをチョット良くする 目標

Slide 6

Slide 6 text

取り組み

Slide 7

Slide 7 text

やったこと デザイン4原則 OOUI Bonoの課題

Slide 8

Slide 8 text

Before → After 開始前 Bootstrapを使っただけ ゴリゴリのタスク指向

Slide 9

Slide 9 text

Before → After 1ヶ月後 ' 音声SNSアプリ Soundia ' デザイン4原則の理解 【UIデザイン】 音声SNSアプリを作ってみました

Slide 10

Slide 10 text

Before → After 現在（5ヶ月後） ( 経費申請 Expenses ( OOUIの理解と実践 【UIデザイン】出張申請サービス（申請作成）をデザイン

Slide 11

Slide 11 text

改善 ややこしいデザイン箇所の修正 役割に応じたコンポーネントの提案

Slide 12

Slide 12 text

プロダクト改善 ややこしいデザイン箇所の修正 テキスト 別タブを開く 削除 テキスト 別タブを開く 削除

Slide 13

Slide 13 text

プロダクト改善 " 役割に応じたコンポーネントの提案 例: ステータスの変更に適切なコンポーネントは？ Button Button Toggle CheckBox

Slide 14

Slide 14 text

改善 ややこしいデザイン箇所の修正 役割に応じたコンポーネントの提案 プロダクトがチョット良くなった 評価と給料が上がった 結果として

Slide 15

Slide 15 text

まとめ

Slide 16

Slide 16 text

結果 デザイン(UI)完全に理解した プロダクトのデザインで理由のある意見を出せるようになった 普段使っているアプリのデザインを観察するようになった 個人開発のモチベが上がった

Slide 17

Slide 17 text

これから UIの知識を深めていきたい タスク指向UI → オブジェクト指向UI グラフィックデザイン力の向上

Slide 18

Slide 18 text

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