10分で完全に(雰囲気を)理解するマテリアルデザイン

Bbf2a0e77c98104ac16ef6d0098c1385?s=47 yagi2
April 20, 2018

 10分で完全に(雰囲気を)理解するマテリアルデザイン

Kyoto.LT 第20回の発表スライドです
https://kyotolt.connpass.com/event/82294/

Bbf2a0e77c98104ac16ef6d0098c1385?s=128

yagi2

April 20, 2018
Tweet

Transcript

  1. 10෼Ͱ׬શʹཧղ͢Δ ϚςϦΞϧσβΠϯ γʔαʔגࣜձࣾɹItuski Aoyagi (@yagi2) 2018-04-20(Fri) Kyoto.LT #20

  2. ࣗݾ঺հ ɾ੨༄ थʢ͓͋΍͗ ͍͖ͭʣ a.k.a ΍͗ʹ͍ ɾAndroidΞϓϦΤϯδχΞ ʢ✨2೥໨✨ʣ ɾσβΠϯͳΜʹ΋Θ͔ΒΜϚϯ

  3. ϚςϦΞϧσβΠϯ ஌ͬͯΔਓ

  4. –from Wikipedia “ϚςϦΞϧσβΠϯʢMaterial Designʣ͸ɺ ΞϝϦΧ߹ऺࠃͷGoogle͕ࣾఏএͨ͠Ϣʔβʔ ΤΫεϖϦΤϯεσβΠϯͷମܥɺ͓ΑͼͦΕ Λ࣮ݱ͢Δ։ൃٕज़΍ख๏ɺσβΠϯɺࢼΈͳ Ͳͷแׅతݺশɻ”

  5. None
  6. ϚςϦΞϧσβΠϯ ΨΠυϥΠϯ ΛಡΜͩ͜ͱ͋Δਓ

  7. None
  8. 10෼Ͱ׬શʹཧղ͢Δ ϚςϦΞϧσβΠϯ

  9. 10෼Ͱ׬શʹཧղ͢Δ ϚςϦΞϧσβΠϯ 10෼ޙͷ໨ඪ →

  10. ࠓ೔͸ϚςϦΞϧσβΠϯΨΠυϥΠϯͷද໘Λ ;ΜΘΓͳͧͬͯงғؾΛཧղ͠·͠ΐ͏

  11. 10෼ͰงғؾΛཧղ͢Δ ϚςϦΞϧσβΠϯ γʔαʔגࣜձࣾɹItuski Aoyagi (@yagi2) 2018-04-20(Fri) Kyoto.LT #20

  12. ʮݹయతͳ͍͍σβΠϯͷݪଇʯ + ʮٕज़΍ՊֶͷՄೳੑͱֵ৽ʯ ↓ ࢹ֮తͳݴޠͷ࡞੒ ϚςϦΞϧσβΠϯͷΰʔϧ

  13. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  14. ϚςϦΞϧ͸ݱ࣮ੈքʹج͍ͮ ͍ͯΔ ਓؒʹͱͬͯೃછΈͷ͋Δײ֮ ΛऔΓೖΕΔ ࢴͱΠϯΫͷॏͳΓɾ࡞༻ ϚςϦΞϧ͸ϝλϑΝʔ

  15. Ϣʔβʔͷૢ࡞Λڧௐͯ͠ɺॏ ཁͳػೳ͕͙͢Θ͔Δʢಓඪʣ େ୾Ͱੜ͖ੜ͖ͱͨ͠Πϯλʔ ϑΣʔεʢσβΠϯʣ͸Ϣʔβʔ Λເதʹͤ͞Δ େ୾Ͱੜ͖ੜ͖ͱͨ͠ɺҙࣝతͳσβΠϯ

  16. ಈ͖Λ༩͑ͯɺಈ࡞ͷओମ͕Ϣʔβʔ Ͱ͋Δ͜ͱͷڧௐ มܗɾ࠶ߏ੒͢Δͱ͖΋Ϣʔβʔମ ݧͷ࿈ଓੑΛଛͳΘͳ͍Α͏ʹ͢Δ ಈ͖ʹ͸ҙຯ͕͋Δ ҙຯͷ͋ΔϞʔγϣϯ

  17. None
  18. ͳΜ͔͍Ζ͍Ζ೉͍͠

  19. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  20. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  21. ݱ࣮ੈքͷҹ࡮෺͸ࢴͱΠϯΫ ͰσβΠϯ͞Ε͍ͯΔ ͦΕΛൺᄻͱ͍ͯ࣋ͬͯ͘͠ → ෺ཧతʹ͋Γ͑ͳ͍σβΠϯ͸͠ͳ͍ ϚςϦΞϧ͸ϝλϑΝʔ

  22. ϘλϯͳͲͷUIύʔπ͸ࢴͰͰ ͖͍ͯΔͱߟ͑Δɻ 1dpͷް͞Λ͍࣋ͬͯΔ ݱ࣮ੈքͱಉ͘͡ɺॏͶΒΕΔ ࢴͱΠϯΫ

  23. None
  24. None
  25. None
  26. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  27. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  28. Ϣʔβʔͷૢ࡞ΛσβΠϯͱͯ͠ දݱ͢Δ ૢ࡞Λڧௐͯ͠ૢ࡞͢Δ্Ͱͷ ಓඪΛͭ͘Δ ҙࣝతͳσβΠϯ

  29. None
  30. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  31. ϚςϦΞϧ͸ϝλϑΝʔ େ୾Ͱ͍͖͍͖ͱɺҙࣝతͳ ҙຯͷ͋ΔϞʔγϣϯ ϚςϦΞϧσβΠϯͷ3ݪଇ

  32. ύʔπ͸෺࣭ɺͭ·Γ࣭ྔΛ࣋ͭͷͰ ෺ཧ๏ଇʹै͏ Ϣʔβʔʹ࿈ଓੑΛࣦΘͤͳ͍Α͏ʹ ΞχϝʔγϣϯΛͤͯ͞αϙʔτ͢Δ ҙຯͷ͋ΔϞʔγϣϯ

  33. None
  34. Do Don’t

  35. ݱ࣮ੈքͷϧʔϧΛऔΓೖΕͯ ௚ײతͳૢ࡞Λ࣮ݱ Ϣʔβʔͷૢ࡞ʹඥ෇͘ҙຯ ͷ͋ΔϞʔγϣϯͰྑ͍ମݧ Λ༩͑Δ ·ͱΊ

  36. ͓·͚

  37. Material Design Guideline Twitter : @materialdesign Material Icons Design Templates

    ϚςϦΞϧσβΠϯ͜ͱ͸͡Ί