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
わかりやすいグラフを作ろう
Search
Yoshihide Jimbo
October 06, 2018
Design
3
1.4k
わかりやすいグラフを作ろう
ng-kyoto Angular Meetup #8 での LT発表資料です。
https://ng-kyoto.connpass.com/event/100685/
Yoshihide Jimbo
October 06, 2018
Tweet
Share
More Decks by Yoshihide Jimbo
See All by Yoshihide Jimbo
高齢者でも使えるプロダクトUIの挑戦 / Designing User Interfaces for the Elderly
jmblog
32
28k
unstated-next による Redux に頼らない状態管理の考察
jmblog
9
5.2k
雰囲気でやってる人向けの Redux 再入門
jmblog
21
6.5k
Web Components で 社内 UI ライブラリを作っている話
jmblog
11
4.3k
gulp: The Good Parts
jmblog
29
5.9k
CSS in JS と CSS Modules
jmblog
25
4.7k
PostCSS とは何か
jmblog
38
9.8k
Kaizen Platform における UI ライブラリのワークフロー
jmblog
30
6.1k
フロントエンドエンジニアのための Dotfiles
jmblog
53
8.5k
Other Decks in Design
See All in Design
ランドマークが光る!季節を彩るナビ体験 - Mobility Night #3 -
kitau
0
110
文字コントラストを改めて考える / Reevaluating Text Contrast
lycorptech_jp
PRO
0
420
Мышление дизайнера историями. Как текстовые модели человеческого поведения помогают проектировать
ashapiro
0
350
【最新】マズロー安達の弟子実績(1期-4期の26人分)
maslow_akkun
0
1k
RAKSUL_DESIGN_DECK_20250319
raksulrecruiting
0
470
株式会社Muture_ソーシャル推進事業
muture
PRO
0
130
Saudade typeface
tiagoporto
0
340
AIで加速するアクセシビリティのこれから
magi1125
3
610
数理的アプローチで挑むスマホUIのデザイン改善:タップ成功率推定ツール「Tappy」の社内活用事例 / Improving Smartphone UI Design with a Mathematical Approach: In-house Use Case of the Tap Success Rate Estimation Tool "Tappy"
lycorptech_jp
PRO
0
700
株式会社バクタム 会社説明資料
bactum
0
270
Findyのプロデチームの 歩みとこれから
satty9556
0
200
“ブロック”で作る、WordPress制作フロー変革のすすめ
koots2021
4
1.9k
Featured
See All Featured
KATA
mclloyd
31
14k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Site-Speed That Sticks
csswizardry
10
750
Navigating Team Friction
lara
188
15k
A designer walks into a library…
pauljervisheath
207
24k
RailsConf 2023
tenderlove
30
1.2k
Become a Pro
speakerdeck
PRO
29
5.5k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.2k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
332
22k
Transcript
Θ͔Γ͍͢άϥϑΛ࡞Ζ͏ OHLZPUP"OHVMBS.FFUVQc0DU
ҙɿ"OHVMBSͷҰग़͖ͯ·ͤΜ
ਆอՅल !KNCMPH ͡Μ΅ɹΑ͠ͻͰ
None
None
Θ͔Γ͍͢άϥϑΛ࡞Δͷɺҙ֎ͱ͍͠
σʔλ άϥϑ Τϯίʔυ ޮՌతͳΤϯίʔσΟϯάͷςΫχοΫΛ ͓ͬͯ͘͜ͱ͕େ
Θ͔Γ͍͢άϥϑΛ࡞͢ΔͨΊͷखॱ ԿΛ͍͑ͨͷ͔໌֬ʹ͢Δ ΘΓ͍͢දݱΛબͿ ݟӫ͑ΛσβΠϯ͢Δ
Θ͔Γ͍͢άϥϑΛ࡞͢ΔͨΊͷखॱ ԿΛ͍͑ͨͷ͔໌֬ʹ͢Δ ΘΓ͍͢දݱΛબͿ ݟӫ͑ΛσβΠϯ͢Δ
Α͋͘Δέʔε ۤ࿑ͯ͠ใΛಡΈऔΒͳ͚ΕͳΒͳ͍άϥϑ ͍͑ͨ͜ͱʹϑΥʔΧεͰ͖͍ͯͳ͍ɻ ݴ͍͍ͨ͜ͱ͕Θ͍ͬͯͳ͍ɻ
͍͑ͨʮϝοηʔδʯΛ͔ͭͭʹߜΓࠐΉɻ ͜ΕΛΘ͔Γ͑͘͢Δ͜ͱʹϑΥʔΧε͢Δ 1PXFS1PJOUΛ։͘લʹ
Θ͔Γ͍͢άϥϑΛ࡞͢ΔͨΊͷखॱ ԿΛ͍͑ͨͷ͔໌֬ʹ͢Δ ΘΓ͍͢දݱΛબͿ ݟӫ͑ΛσβΠϯ͢Δ
None
͏ͷආ͚͍ͨάϥϑ ԁάϥϑ %άϥϑ ࣠άϥϑ ಡΈʹ͍͘ ͕ࠩݟ͚ͮΒ͍ ಡΈʹ͍͘ ͕ࠩݟ͚ͮΒ͍ ࠨӈʹॎ͕࣠͋Δͱ ಡΈʹ͘͘
͕͔͔࣌ؒΔ
ͬͯ҆৺ͳجຊͷάϥϑ άϥϑ άϥϑ ઢάϥϑ ࢄਤ ॎάϥϑ ԣάϥϑ ੵΈ্͛άϥϑ ંΕઢάϥϑ εϩʔϓάϥϑ
Θ͔Γ͍͢άϥϑΛ࡞͢ΔͨΊͷखॱ ԿΛ͍͑ͨͷ͔໌֬ʹ͢Δ ΘΓ͍͢දݱΛબͿ ݟӫ͑ΛσβΠϯ͢Δ
ෆඞཁͳཁૉΛऔΓͷͧ͘ ૬खͷҙΛແҙࣝతʹͻ͖͚ͭΔ ৺͕͚Δ͖ͭͷϙΠϯτ
ਅͬനͳը໘ʹཁૉΛͭՃ͢Δ͝ͱʹɺ ೝతෛՙ૿͍͑ͯ͘ɻ ඞཁ࠷খݶ·ͰɺཁૉΛऔΓͷ͍͍ͧͯ͘ɻ ෆඞཁͳཁૉΛऔΓͷͧ͘
None
None
૬ख͕ʮೝࣝ͢Δલʯʹݟ͍ͤͨͷΛݟͤΔ ࢹઢͷಈ͖Λҙࣝͯ͠ཁૉΛஔ͢Δ ૬खͷҙΛແҙࣝతʹͻ͖͚ͭΔ
ʮʯͷΛ͍͑ͯͩ͘͞
ҙࣝతʹݟΑ͏ͱ͠ͳͯ͘ɺ ʮʯ͕ࣗવͱʹඈͼࠐΜͰ͖·ͤΜͰ͔ͨ͠ʁ
ແҙࣝతࢹ֮ใ QSFBUUFOUJWFBUUSJCVUFT c ͖ ܗ ઢͷ͞ ઢͷ෯ αΠζ ۂ Ճ
ғΈ ৭ ೱ͞ Ґஔ ಈ͖
ਓ ʮ;ܕʯʹ ࢹઢΛ ಈ͔͢
5IFUJUMFJTJNQPSUBOU 5IFOPUFUFYUJTOPUTPJNQPSUBOU
࣮ફྫ
ԿΛ͍͑ͨͷ͔໌֬ʹ͢Δ
ԿΛ͑Δ͔ աڈؒͷେࡕࢢͷؾσʔλΛੳͨ݁͠Ռɺ ͕࠷ଳͷଟ͍ͩͬͨ͜ͱ͕Θ͔ͬͨɻ ಛʹͱൺֱ͢Δͱഒͷ͕ࠩ͋ͬͨɻ ͜ͷΛ͑Δɻ
ଳͷ
ΘΓ͍͢දݱΛબͿ
දΛ͏ͷ͋Γ ଳͷ
͜ͷఔͷσʔλͰ͋Εѱ͘ͳ͍ɻ ʮແҙࣝతࢹ֮ใʯΛར༻͢Εɺ Θ͔Γ͑͘͢ΒΕΔɻ ͨͩ͠ɺ΄͔ͷͱͲΕ͙Β͍ͷ͕ࠩ ͋ͬͨͷ͔ɺදΛʮಡΉʯඞཁ͕͋Γ ͕͔͔࣌ؒΔɻ
ંΕઢάϥϑʹͯ͠ΈΔ ؒͷมԽͷΛ͍͑ͨͷͰ͋Ε ͪΐ͏Ͳ͍͍ɻ ͨͩ͠ɺͲΕ͕࠷େ͖͘ɺ ͲΕ͕࠷খ͍͞ͷ͔ͱ͍͏͜ͱʹ ϑΥʔΧε͍ͤͨ͞߹ʹ ͋·Γ͍͍ͯͳ͍ɻ
ॎάϥϑʹͯ͠ΈΔ
ͲΕ͕࠷େ͖͘ɺͲΕ͕࠷খ͍͔͞ɺ ೝ͍ࣝ͢͠͠ɺ͝ͱͷࠩ ͻͱͰ͔Δɻ
ԣάϥϑʹͯ͠ΈΔ ॎάϥϑͱಉ༷ɺͪ͜ΒΘ͔Γ͍͢ɻ ͞Βʹʮ;ܕʯͷࢹઢͷಈ͖Λߟ͑Δͱɺ ·ͣϥϕϧʢʣΛݟͯɺͦΕ͔ΒσʔλΛ ݟΔͷͰɺॎάϥϑΑΓಡΈ͍͢ɻ ʢॎάϥϑͷ߹ɺ্ԼʹΛಈ͔ͯ͠ σʔλͱϥϕϧΛݟൺΔඞཁ͕͋Δɻʣ ࠓճ͜ΕΛ࠾༻ɻ
ݟӫ͑ΛσβΠϯ͢Δ
ෆඞཁͳཁૉΛऔΓͷ͍͍ͧͯ͘
աڈؒͷେࡕࢢͷଳͷ
աڈؒͷେࡕࢢͷଳͷ
৭Λͳ͘͢ʢάϨʔεέʔϧʹ͢Δʣ
աڈؒͷେࡕࢢͷଳͷ
ғΈઢͱܩઢΛফ͢
աڈؒͷେࡕࢢͷଳͷ
9࣠ͷϥϕϧΛফ͢
૬खͷҙΛແҙࣝతʹͻ͖͚ͭΔ
λΠτϧΛࠨ্ʹஔ͍ͯڧௐ͢Δ աڈؒͷେࡕࢢͷଳͷ
ʮ৭ʯͰҙΛҾ͖͚ͭΔ աڈؒͷେࡕࢢͷଳͷ
ݟͯ΄͍͠ʹ͚ͩΛදࣔ͢Δ աڈؒͷେࡕࢢͷଳͷ
աڈؒͷେࡕࢢͷଳͷ
मਖ਼લ
मਖ਼ޙ
աڈؒͷେࡕࢢͷଳͷ
·ͱΊ
ʮσʔλΛͨͩݟͤΔ͚ͩʯͰऴΘΒͳ͍άϥϑΛ࡞Ζ͏