SlideShare una empresa de Scribd logo
1 de 25
Descargar para leer sin conexión
Civictech Challenge Cup U-22 Workshop #2
UXが重要と⾔われる
理由を知ろう
UIとUXの違いはなんとなく分かったけど…
.どこから始めたらいいの?
チームにデザイナーがいないけど、
誰ができるの?
Name: ⽔野真⼦
@macotien15
mizmako
ブログライター
広報・運営のサポート

2017.9 カナダ・バンクーバーに移る
2018.11 現地ソフトウェア開発企業に就職
UX/UIデザイナーとして働く
Web制作会社Webデザイナーとして約4年勤務
UX/UIデザイナー
Experience:
UXの重要性を知る


普段の⽣活でもUXを意識してみる
UXを意識した制作の進め⽅
Goal 本⽇のゴール/⽬的
https://twitter.com/motcho_tw/status/870589211832795136
分からないことは聞いてください
普段の業務
受託案件のWebアプリケーション/モバイルアプリ UX/UIデザイン担当
クライアント
何ができる機能?
何で必要なの?
機能が追加されることで
何が変わるの?
既存機能への影響は?
開発コストは?
ユーザーフローの確認
条件分岐の確認
(ユーザーがAだった場合、
ユーザーがBだった場合の
フローの違いなど)
動作の⼀貫性
画⾯構成
コンポーネント管理
(ボタン/フォーム/アイコン)
カラー、フォント
スタイルガイド作成
提案する
要件定義 UIデザインUXデザイン
こんな
機能が欲しい!
.ユーザーにとって
分かりやすい、使いやすい
プロダクトってどんなもの?
使い慣れたアプリから
UXを捉える
LINE Facebook
メッセンジャー
WhatsApp
2019.05記事
LINEのUI変更でレビュー⼤荒れ機能
多すぎ?「元に戻して」の声も
https://www.itmedia.co.jp/news/
articles/1905/10/news073.html
2017.06〜
メニュータブ カスタマイズできるって知ってる👀 ?
「設定」で⾃分の好きな機能
を表⽰するように、変更する
ことができる
海外で使⽤する場合は、
「ニュース」「ウォレット」
機能はなし。
「オープンチャット」も⽇本
国内ユーザーのみ。
メニュータブ メニューの数が減ってる👀
メニュータブ 他のアプリと全然違う👀
既読機能 既読をつけずに読む⽅法👀 ⁉
トークルームを⻑押し、表⽰される
モーダルウィンドウ内でメッセージ
を確認する。
画⾯をタップするとトーク⼀覧画⾯
に戻る。
LINEで既読をつけずに読む⽅法全まとめ2020
https://appllio.com/seven-ways-to-read-line-
message-without-kidoku
既読機能 既読って表⽰やめようよ👀
オフライン状態 既読を「未読」に
戻す⽅法がある
チャットルームを
右にスライドして
を選択
送信中
送信済み
送信済み
既読
既読


ログイン状態
既読機能 ルールはメッセンジャーと似てる👀
さらに詳しいログイン状態
既読
送信中
相⼿が受信、未読
既読





チャットルールを
⻑押しすると、
モーダルウィンド
ウが表⽰される
LINEとは違って、
未読のまま読むの
ではなく、既読を
未読にすることが
できる
Workshopを
しよう!
前回のおさらい
価値仮説シートを使ったワークショップのある仮説を使⽤
*2020.04.30サービス停⽌
DoggyBag-ドギーバッグ
外⾷した際の「⾷べ残し」を持ち帰る容器
ドギーバッグ普及委員会
活動に参加してくれるメンバー/飲⾷店を
募集しています
ドギーバッグを
普及させる
サービス作り
問題定義
・持ち帰りたいけど、加盟店が⾒当たらない
・⾃⼰責任カードを忘れた
・持ち帰り⽤ボックスを忘れた
・どうやって会員になるのか分からない
・衛⽣⾯が⼼配でメンバー/加盟店になれない
・持ち帰りに対する法律はどうなってるの?
・お店側の責任がどうなるのか分からない
・ビュッフェ形式の飲⾷店はどうなるの?
・持ち帰りしてる⼈が少なくて、⾔い出しにくい
・そもそもドギーバッグを知らない
Workshopの内容
・ドギーバッグを促進するWebサービス-モバイルアプリ
・Figmaを使⽤して、グレースケールで画⾯作成を⾏う
・サービス全体を考えるのではなく、機能に重点をおいて考える
・問題に対してどんなUXを提供したいのか
・時間があればプロトタイプ作成してもOK
・プレゼンは各チーム3分
・どんなふうにUXを考えて画⾯構成を
 したのか、まとめて発表する
プレゼン発表
UXの重要性を知る


普段の⽣活でもUXを意識してみる
UXを意識した制作の進め⽅
Goal 本⽇のゴール/⽬的
ご参加ありがとうございました

Más contenido relacionado

La actualidad más candente

クックパッドデザイナーが実践するユーザーファースト
クックパッドデザイナーが実践するユーザーファーストクックパッドデザイナーが実践するユーザーファースト
クックパッドデザイナーが実践するユーザーファーストMiwa Kuramitsu
 
デザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクターデザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクターtake-it
 
サービスにおけるビジュアルデザインの役割
サービスにおけるビジュアルデザインの役割サービスにおけるビジュアルデザインの役割
サービスにおけるビジュアルデザインの役割Kenichi Suzuki
 
風呂場で考えるUIデザイナーの未来
風呂場で考えるUIデザイナーの未来風呂場で考えるUIデザイナーの未来
風呂場で考えるUIデザイナーの未来Masayuki Uetani
 
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927英明 伊藤
 
UXグラフとUXグラフツールのススメ - UX評価について -
UXグラフとUXグラフツールのススメ - UX評価について -UXグラフとUXグラフツールのススメ - UX評価について -
UXグラフとUXグラフツールのススメ - UX評価について -uenoyuuki
 
The Way of the (Co-)Prototyping チームでUser Interfaceをプロトタイピングする
The Way of the (Co-)Prototyping チームでUser InterfaceをプロトタイピングするThe Way of the (Co-)Prototyping チームでUser Interfaceをプロトタイピングする
The Way of the (Co-)Prototyping チームでUser InterfaceをプロトタイピングするMikihiro Fujii
 
How to achieve the Goals of Designing?
How to achieve the Goals of Designing?How to achieve the Goals of Designing?
How to achieve the Goals of Designing?Mikihiro Fujii
 
SketchがAndroidのUIデザインに向いているワケ
SketchがAndroidのUIデザインに向いているワケSketchがAndroidのUIデザインに向いているワケ
SketchがAndroidのUIデザインに向いているワケAsami Yamamoto
 
第6回.NET中心会議パネルディスカッション 0923
第6回.NET中心会議パネルディスカッション 0923第6回.NET中心会議パネルディスカッション 0923
第6回.NET中心会議パネルディスカッション 0923Hub DotnetDeveloper
 
インターフェイスという名の付く会社が考えるUX
インターフェイスという名の付く会社が考えるUXインターフェイスという名の付く会社が考えるUX
インターフェイスという名の付く会社が考えるUXYasushi Senda
 
UIデザイナー最終防衛マニュアル
UIデザイナー最終防衛マニュアルUIデザイナー最終防衛マニュアル
UIデザイナー最終防衛マニュアルTaiki Kawakami
 
InVision勉強会資料
InVision勉強会資料InVision勉強会資料
InVision勉強会資料TakuyaTakemoto
 
グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607
グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607
グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607Yuta Saito
 
息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み
息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み
息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組みYuya Toida
 
新規アプリ開発×Ucd
新規アプリ開発×Ucd新規アプリ開発×Ucd
新規アプリ開発×Ucd綾奈 佐瀬
 
Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。uenoyuuki
 
Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」
Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」
Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」Mikihiro Fujii
 
Prototype in Service Design
Prototype in Service DesignPrototype in Service Design
Prototype in Service DesignHiiro Kato
 
デザインのためのデザイン
デザインのためのデザインデザインのためのデザイン
デザインのためのデザインMasayuki Uetani
 

La actualidad más candente (20)

クックパッドデザイナーが実践するユーザーファースト
クックパッドデザイナーが実践するユーザーファーストクックパッドデザイナーが実践するユーザーファースト
クックパッドデザイナーが実践するユーザーファースト
 
デザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクターデザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクター
 
サービスにおけるビジュアルデザインの役割
サービスにおけるビジュアルデザインの役割サービスにおけるビジュアルデザインの役割
サービスにおけるビジュアルデザインの役割
 
風呂場で考えるUIデザイナーの未来
風呂場で考えるUIデザイナーの未来風呂場で考えるUIデザイナーの未来
風呂場で考えるUIデザイナーの未来
 
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
 
UXグラフとUXグラフツールのススメ - UX評価について -
UXグラフとUXグラフツールのススメ - UX評価について -UXグラフとUXグラフツールのススメ - UX評価について -
UXグラフとUXグラフツールのススメ - UX評価について -
 
The Way of the (Co-)Prototyping チームでUser Interfaceをプロトタイピングする
The Way of the (Co-)Prototyping チームでUser InterfaceをプロトタイピングするThe Way of the (Co-)Prototyping チームでUser Interfaceをプロトタイピングする
The Way of the (Co-)Prototyping チームでUser Interfaceをプロトタイピングする
 
How to achieve the Goals of Designing?
How to achieve the Goals of Designing?How to achieve the Goals of Designing?
How to achieve the Goals of Designing?
 
SketchがAndroidのUIデザインに向いているワケ
SketchがAndroidのUIデザインに向いているワケSketchがAndroidのUIデザインに向いているワケ
SketchがAndroidのUIデザインに向いているワケ
 
第6回.NET中心会議パネルディスカッション 0923
第6回.NET中心会議パネルディスカッション 0923第6回.NET中心会議パネルディスカッション 0923
第6回.NET中心会議パネルディスカッション 0923
 
インターフェイスという名の付く会社が考えるUX
インターフェイスという名の付く会社が考えるUXインターフェイスという名の付く会社が考えるUX
インターフェイスという名の付く会社が考えるUX
 
UIデザイナー最終防衛マニュアル
UIデザイナー最終防衛マニュアルUIデザイナー最終防衛マニュアル
UIデザイナー最終防衛マニュアル
 
InVision勉強会資料
InVision勉強会資料InVision勉強会資料
InVision勉強会資料
 
グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607
グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607
グローバルを目指すサイボウズ式UXリサーチ_UT事例発表170607
 
息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み
息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み
息のながーいB2Bサービスで、デザイナーが価値を発揮するための取り組み
 
新規アプリ開発×Ucd
新規アプリ開発×Ucd新規アプリ開発×Ucd
新規アプリ開発×Ucd
 
Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。
 
Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」
Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」
Framework for Designing the Goals 「モノづくりのゴールを実現するフレームワーク」
 
Prototype in Service Design
Prototype in Service DesignPrototype in Service Design
Prototype in Service Design
 
デザインのためのデザイン
デザインのためのデザインデザインのためのデザイン
デザインのためのデザイン
 

Similar a CCC Design Session

[UX]は投げ捨てろ!
[UX]は投げ捨てろ![UX]は投げ捨てろ!
[UX]は投げ捨てろ!c-mitsuba
 
なぜUXをデザインしているのか
なぜUXをデザインしているのかなぜUXをデザインしているのか
なぜUXをデザインしているのかMikihiro Fujii
 
DevLOVEkosien2014_itow_ponde
DevLOVEkosien2014_itow_pondeDevLOVEkosien2014_itow_ponde
DevLOVEkosien2014_itow_ponde英明 伊藤
 
Think User : UXデザインにおけるユーザー設計とは?
Think User : UXデザインにおけるユーザー設計とは?Think User : UXデザインにおけるユーザー設計とは?
Think User : UXデザインにおけるユーザー設計とは?Kazumi Miyamura
 
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO JamExperience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO JamAkihiko Kodama
 
Itプロジェクトにおけるuxデザインの実践的適用方法
Itプロジェクトにおけるuxデザインの実践的適用方法Itプロジェクトにおけるuxデザインの実践的適用方法
Itプロジェクトにおけるuxデザインの実践的適用方法Roy Kim
 
ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)
ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)
ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)Kazumichi (Mario) Sakata
 
ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方Tomoko Nishina
 
マーケティングアプリのUXDで考えたこと
マーケティングアプリのUXDで考えたことマーケティングアプリのUXDで考えたこと
マーケティングアプリのUXDで考えたことHideki Akizuki
 
UX研修「UXからサイトを考える!」2013新卒向け
UX研修「UXからサイトを考える!」2013新卒向けUX研修「UXからサイトを考える!」2013新卒向け
UX研修「UXからサイトを考える!」2013新卒向けMari Takahashi
 
新規サービス立ち上げ時のUX設計
新規サービス立ち上げ時のUX設計新規サービス立ち上げ時のUX設計
新規サービス立ち上げ時のUX設計Naomi Hirota
 
意味をデザインするを考える
意味をデザインするを考える意味をデザインするを考える
意味をデザインするを考えるAya Tokuda
 
はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験Daichi Aoki
 
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性yukahatakeyama
 
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮schoowebcampus
 
デザインの要件定義
デザインの要件定義デザインの要件定義
デザインの要件定義Shin Iiboshi
 
たった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナー
たった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナーたった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナー
たった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナーMitsuo Tomii
 
LiBRA_210201/New_emploee
LiBRA_210201/New_emploeeLiBRA_210201/New_emploee
LiBRA_210201/New_emploeeMasanori Saito
 
企業向けUXデザイン導入のポイント
企業向けUXデザイン導入のポイント企業向けUXデザイン導入のポイント
企業向けUXデザイン導入のポイントRoy Kim
 

Similar a CCC Design Session (20)

[UX]は投げ捨てろ!
[UX]は投げ捨てろ![UX]は投げ捨てろ!
[UX]は投げ捨てろ!
 
なぜUXをデザインしているのか
なぜUXをデザインしているのかなぜUXをデザインしているのか
なぜUXをデザインしているのか
 
DevLOVEkosien2014_itow_ponde
DevLOVEkosien2014_itow_pondeDevLOVEkosien2014_itow_ponde
DevLOVEkosien2014_itow_ponde
 
Think User : UXデザインにおけるユーザー設計とは?
Think User : UXデザインにおけるユーザー設計とは?Think User : UXデザインにおけるユーザー設計とは?
Think User : UXデザインにおけるユーザー設計とは?
 
Bridge UXからUIへ
Bridge UXからUIへBridge UXからUIへ
Bridge UXからUIへ
 
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO JamExperience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
 
Itプロジェクトにおけるuxデザインの実践的適用方法
Itプロジェクトにおけるuxデザインの実践的適用方法Itプロジェクトにおけるuxデザインの実践的適用方法
Itプロジェクトにおけるuxデザインの実践的適用方法
 
ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)
ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)
ユーザエクスペリエンス・デザイン・ガイド(User Experience Design Guide)
 
ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方
 
マーケティングアプリのUXDで考えたこと
マーケティングアプリのUXDで考えたことマーケティングアプリのUXDで考えたこと
マーケティングアプリのUXDで考えたこと
 
UX研修「UXからサイトを考える!」2013新卒向け
UX研修「UXからサイトを考える!」2013新卒向けUX研修「UXからサイトを考える!」2013新卒向け
UX研修「UXからサイトを考える!」2013新卒向け
 
新規サービス立ち上げ時のUX設計
新規サービス立ち上げ時のUX設計新規サービス立ち上げ時のUX設計
新規サービス立ち上げ時のUX設計
 
意味をデザインするを考える
意味をデザインするを考える意味をデザインするを考える
意味をデザインするを考える
 
はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験
 
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
 
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
 
デザインの要件定義
デザインの要件定義デザインの要件定義
デザインの要件定義
 
たった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナー
たった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナーたった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナー
たった一言で回避できたはずが、 現場の空気にのまれ深入りしすぎた 2年目UXデザイナー
 
LiBRA_210201/New_emploee
LiBRA_210201/New_emploeeLiBRA_210201/New_emploee
LiBRA_210201/New_emploee
 
企業向けUXデザイン導入のポイント
企業向けUXデザイン導入のポイント企業向けUXデザイン導入のポイント
企業向けUXデザイン導入のポイント
 

CCC Design Session