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
231007_tokyor_kato
Search
Hajime Kato
October 07, 2023
Design
6
1.5k
231007_tokyor_kato
第109回R勉強会@東京にて発表した、
「デザイナーが可視化する上でやってきたこと」のスライドです。
Hajime Kato
October 07, 2023
Tweet
Share
More Decks by Hajime Kato
See All by Hajime Kato
地図・デザイン・可視化 −情報をわかりやすく伝えるために−
hjmkth
2
530
現代風歴史マップ「れきちず」フロントエンドのウラとオモテ|フロントエンドカンファレンス北海道2024 / frontend of Rekichizu
hjmkth
0
210
240803_tochiji-hai_hackathon_kato
hjmkth
2
240
231229_Datavizjp_kato
hjmkth
1
1k
231206_Book-launch-event_kato
hjmkth
2
1.4k
231129_FOSS4G-ASIA-2023_kato
hjmkth
1
500
230909_chiriin-fc_kato
hjmkth
0
1.3k
230904_Geo-Lang_kato
hjmkth
0
1.5k
230726_MIERUNE BBQ #03_kato
hjmkth
1
440
Other Decks in Design
See All in Design
「ちょっといいUI」を目指す努力 / Striving for Little Big Details
usagimaru
6
3.9k
PMとデザイナーはニコイチ! メリットと具体的なアクション10選
mosmos_noki
2
1.2k
How to go from research data to insights?
mastervicedesign
0
180
実利の世界で、表現者である
kiyou77
3
110
Rayout Pattern 01
one0
0
370
Night Shift concept 9/15/2024
cpineda57
0
750
太田博三(@usagisan2020)
otanet
0
200
Design Your Own App Using Figma by Medha Muppala
gdgmontreal
0
1.5k
若手デザイナーチームが手がける CADC2024クリエイティブディレクションの全貌 / opening-design
cyberagentdevelopers
PRO
1
1k
Improve a service workshop
mastervicedesign
1
130
ユーザーに向き合うデザインが介護・福祉の現場を変える / User-facing design changes the field of care and welfare
sms_tech
0
180
Памятка-раздатка по Карте процесса-опыта, А4
ashapiro
1
470
Featured
See All Featured
Thoughts on Productivity
jonyablonski
67
4.4k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
4 Signs Your Business is Dying
shpigford
181
21k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
6
510
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Making Projects Easy
brettharned
116
5.9k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
48
2.2k
Statistics for Hackers
jakevdp
796
220k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
111
49k
Code Reviewing Like a Champion
maltzj
520
39k
Transcript
デザイナーが可視化する上で やってきたこと 地図とかデザインとか(加藤創) 藻岩山から札幌市中心部を望む 09/27撮影
©OpenStreetMap contributors 自己紹介・会社紹介 可視化で重要だと思うこと 可視化で気をつけていること まとめ 01 02 03 04
©OpenStreetMap contributors 01 自己紹介
©Project PLATEAU / MLIT Japan デザイナー 加藤 創 Hajime Kato
©Project PLATEAU / MLIT Japan • 千葉県市川市生まれ • 去年まで東京都江東区に住んでいました •
去年の夏に北海道の企業(MIERUNE)に 転職し、札幌市に住んでいます
©Project PLATEAU / MLIT Japan © MIERUNE | © MapTiler
© OpenStreetMap contributors
©Project PLATEAU / MLIT Japan 7月に会社のメンバーと 行って来ました
©Project PLATEAU / MLIT Japan © MIERUNE | © MapTiler
© OpenStreetMap contributors 札幌 稚内・宗谷岬 “日本最北の地” 340km
©Project PLATEAU / MLIT Japan © MIERUNE | © MapTiler
© OpenStreetMap contributors 宗谷岬 07/23撮影
©Project PLATEAU / MLIT Japan 個人の趣味でこんなもの を作ったり
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan 最近、こんなサイトも 作りました🙌
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan 「れきちず」 https://rekichizu.jp/
©OpenStreetMap contributors ここから 会社の話を少しだけ🏢
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan みえるね 位置情報に関する可視化
©Project PLATEAU / MLIT Japan オフライン/オンラインイベントをやったり… Web技術に関する オフラインイベント@札幌 「MIERUNE BBQ」
位置情報技術のユルい オンライン勉強会 「MIERUNE JCT」
©Project PLATEAU / MLIT Japan 国際カンファレンスに参加して登壇したり… FOSS4G 2023 Prizren (コソボ)
©Project PLATEAU / MLIT Japan 札幌の市電を貸し切って社内イベントをしたり
©Project PLATEAU / MLIT Japan イベントしてばかりじゃ…?🤔 いえ、ちゃんと仕事もしてます!😀
©Project PLATEAU / MLIT Japan G7高松都市大臣会合 minecraftデータ作成
©Project PLATEAU / MLIT Japan 林野庁 森林データ処理・Web開発
©Project PLATEAU / MLIT Japan などなど…いろいろやってます noteやXで情報発信中!
©Project PLATEAU / MLIT Japan では、加藤は何やってるの?😏
©Project PLATEAU / MLIT Japan 会社のデザインに関わるものを 作ってます!🎨
©Project PLATEAU / MLIT Japan
©Project PLATEAU / MLIT Japan 宣伝が長くなってしまいました🙇 ここからが本題になります
©OpenStreetMap contributors 02 可視化で重要だと思うこと
©Project PLATEAU / MLIT Japan ❶ 目的
©Project PLATEAU / MLIT Japan 誰に伝えたいか?
©Project PLATEAU / MLIT Japan 誰に伝えたいか? 見る人(ターゲット)によって変わる
©Project PLATEAU / MLIT Japan 何を伝えたいか?
©Project PLATEAU / MLIT Japan 何を伝えたいか? 意図・メッセージを明白にする
©Project PLATEAU / MLIT Japan ❷ 方法
©Project PLATEAU / MLIT Japan どう表現するか?
©Project PLATEAU / MLIT Japan どう表現するか? いろいろな可視化の方法がある りんご もも なし
いちご みかん
©Project PLATEAU / MLIT Japan 実例1:コンビニ地図
©Project PLATEAU / MLIT Japan よく見かける、こういう地図 セブン-イレブン ファミリーマート ローソン ※地図を
制作した 2018年 当時
©Project PLATEAU / MLIT Japan 例えば奈良県… 緑のファミマが 優勢なのかなと思いきや 悪いとは言いません、悪いとは言わないですが… ※地図を
制作した 2018年 当時
©Project PLATEAU / MLIT Japan 悪いとは言いません、悪いとは言わないですが… セブン 140店 ファミマ 144店
ローソン 140店 ※地図を 制作した 2018年 当時
©Project PLATEAU / MLIT Japan 悪いとは言いません、悪いとは言わないですが… セブン 140店 ファミマ 144店
ローソン 140店 3社がほぼ拮抗している のに、地図では緑一色に 塗られてしまっている! ※地図を 制作した 2018年 当時
©Project PLATEAU / MLIT Japan セブン-イレブン ファミリーマート ローソン この表現で良いのだろうか? 悪いとは言いません、悪いとは言わないですが…
©Project PLATEAU / MLIT Japan そんなわけで、こんな表現を考えてみた。 セブン-イレブン ファミリーマート ローソン 店舗数の割合を、
光の3原色(RGB)を 用いて表現
©Project PLATEAU / MLIT Japan そんなわけで、こんな表現を考えてみた。 セブン-イレブン ファミリーマート ローソン 赤くなるほど
セブン優勢 3社拮抗だと グレーに
©Project PLATEAU / MLIT Japan そんなわけで、こんな表現を考えてみた。 ※地図を 制作した 2018年 当時
セブン-イレブン ファミリーマート ローソン
©Project PLATEAU / MLIT Japan そんなわけで、こんな表現を考えてみた。 ※地図を 制作した 2018年 当時
セブン-イレブン ファミリーマート ローソン 3社が拮抗する奈良県は ほぼグレーで表される
©Project PLATEAU / MLIT Japan 一応こちらのバージョンも… ※地図を 制作した 2018年 当時
セブン-イレブン ファミリーマート ローソン
©Project PLATEAU / MLIT Japan ただ、弱点もある ※地図を 制作した 2018年 当時
セブン-イレブン ファミリーマート ローソン 3原色ということで 3社以上表現できず、 セイコーマートが強い 北海道は表現できない
©Project PLATEAU / MLIT Japan 実例2:乗降客数路線図
©Project PLATEAU / MLIT Japan 東京メトロの乗降客数 ※地図を 制作した 2018年 当時
https://www.tokyometro.jp/corporate/enterprise/passenger_rail/transportation/passengers/2018.html
©Project PLATEAU / MLIT Japan 東京メトロの乗降客数 ※地図を 制作した 2018年 当時
池袋 大手町 北千住 銀座 新橋
©Project PLATEAU / MLIT Japan 東京メトロの乗降客数 ※地図を 制作した 2018年 当時
575,043 356,634 292,684 265,325 253,678 池袋 大手町 北千住 銀座 新橋 まだ見にくい…😭
©Project PLATEAU / MLIT Japan 東京メトロの乗降客数 ※地図を 制作した 2018年 当時
都心部の駅が 重なってよく わからない😢 データ:国土交通省「国土数値情報」
©Project PLATEAU / MLIT Japan 東京メトロの乗降客数 ※地図を 制作した 2018年 当時
路線図にした ことでわかり やすくなった🤗
©Project PLATEAU / MLIT Japan
©OpenStreetMap contributors 03 可視化で気をつけていること
©Project PLATEAU / MLIT Japan ❶ 伝え方
©Project PLATEAU / MLIT Japan 不安を扇動するもの
©Project PLATEAU / MLIT Japan 不安を煽動するもの ええじゃないか 発生マップ 慶應3年10月7日 1,234,567人
※フィクションです
©Project PLATEAU / MLIT Japan 不安を煽動するもの ええじゃないか 発生マップ 慶應3年10月7日 1,234,567人
※フィクションです 必要以上に煽る必要はあるか?
©Project PLATEAU / MLIT Japan 警戒を呼びかけるもの
©Project PLATEAU / MLIT Japan 警戒を呼びかけるもの どこかのアカウント @•••dokokano_account 【拡散希望】このままだと•日後に 栗まんじゅうで本州が覆い尽くされます!
今すぐ避難の準備を! ※フィクションです
©Project PLATEAU / MLIT Japan 警戒を呼びかけるもの どこかのアカウント @•••dokokano_account 【拡散希望】このままだと•日後に 栗まんじゅうで本州が覆い尽くされます!
今すぐ避難の準備を! 生命・財産に関わる責任を取れるか? ※フィクションです
©Project PLATEAU / MLIT Japan ❷ 伝える内容
©Project PLATEAU / MLIT Japan 差別や偏見・ヘイトを 助長するもの
©Project PLATEAU / MLIT Japan 差別や偏見・ヘイトを助長するもの https://www.nichibenren.or.jp/document/statement/year/2022/220825_2.html
©Project PLATEAU / MLIT Japan 差別や偏見・ヘイトを助長するもの https://www3.nhk.or.jp/news/html/20230628/k10014111941000.html
©Project PLATEAU / MLIT Japan 年収••万円以上の割合 ※地図はイメージでフィクション そこまで行かなくても、よくあるこういう地図 20%- 15-20%
10-15% 5-10% 0-5% 😔 😃
©Project PLATEAU / MLIT Japan そこまで行かなくても、よくあるこういう地図 20%- 15-20% 10-15% 5-10%
0-5% 😔 😃 社会課題・ジャーナリズムとの境界は? 年収••万円以上の割合 ※地図はイメージでフィクション
©Project PLATEAU / MLIT Japan プライバシーに関わるもの
©Project PLATEAU / MLIT Japan プライバシーに関わるもの http://www.jame.or.jp/portrait_rights/case_law/
©Project PLATEAU / MLIT Japan そこまで行かなくても、たとえば… •加藤の生活 ※フィクションです
©Project PLATEAU / MLIT Japan •加藤の生活 ※フィクションです その情報は公開していいものか? そこまで行かなくても、たとえば…
©OpenStreetMap contributors 04 まとめ
©OpenStreetMap contributors 目的をもって可視化する • 誰に伝えたいか? • 何を伝えたいか?
©OpenStreetMap contributors 気をつけて可視化する • 不安を煽動していないか? • 警戒を呼びかけていないか? • 差別や偏見・ヘイトを助長していないか? •
プライバシーを侵害していないか?
©OpenStreetMap contributors 可視化は利器にも、 凶器にもなりうる
©OpenStreetMap contributors いろいろ可視化して みてください! Enjoy👍