Upgrade to Pro — share decks privately, control downloads, hide ads and more …

認知パターンから考えるesaらしさのデザイン / Thinking esa-like design

認知パターンから考えるesaらしさのデザイン / Thinking esa-like design

DIST.26 「Webサービスの個性を支えるデザイン」で発表させていただきました。
https://dist.connpass.com/event/123241/
https://esa.io

ken_c_lo / TAEKO AKATSUKA

April 26, 2019
Tweet

More Decks by ken_c_lo / TAEKO AKATSUKA

Other Decks in Design

Transcript

  1. ೝ஌ύλʔϯ͔Βߟ͑Δ
    esaΒ͠͞ͷσβΠϯ
    @ken_c_lo
    TAEKO AKATSUKA
    DIST.26 WebαʔϏεͷݸੑΛࢧ͑ΔσβΠϯ 2019.04.26
    ))

    View full-size slide

  2. !2
    • ੺௩ ົࢠ
    • @ken_c_lo (@taea)
    • esa LLC
    • ૑ۀऀɾσβΠφʔ
    • ΤϯδχΞ2ਓ + σβΠφʔ1ਓ
    • ࠷ॳ͸झຯͰαʔϏεΛ࡞͍ͬͯͨ
    • 5೥લ͔Β๏ਓԽ

    View full-size slide

  3. https://esa.io

    View full-size slide

  4. MarkdownͰॻ͚Δ৘ใڞ༗αʔϏε
    esaΛ͝ଘ஌ͷํʁ ůŢ
    DISTͷπʔϧεϙϯαʔ΋͍ͯ͠·͢

    View full-size slide

  5. ೝ஌ύλʔϯ͔Βߟ͑Δ
    esaΒ͠͞ͷσβΠϯ
    @ken_c_lo
    TAEKO AKATSUKA
    DIST.26 WebαʔϏεͷݸੑΛࢧ͑ΔσβΠϯ 2019.04.26
    ))

    View full-size slide

  6. !6
    ຊ೔ͷ͓୊
    w ࣅͨΑ͏ͳػೳΛ࣋ͬͨ8FCαʔϏε͸ɺಉ͡Α͏ͳݟͨ໨ʹͳΓ͕ͪ໰୊
    w ͦͷதͰ͍͔ʹɺͦͷαʔϏεΒ͠͞ʢݸੑʣΛग़͍ͯͬͨ͠Β͍͍ͷ͔ʁ
    ػೳͰ͸ͳ͘
    ݟͨ໨͔Βߟ͑ΔʮFTBΒ͠͞ʯͷ࡞Γํ
    ೝ஌ύλʔϯ

    View full-size slide

  7. !7
    ػೳύλʔϯ ͱ ೝ஌ύλʔϯ
    Design Systems
    ― σδλϧϓϩμΫτͷͨΊͷσβΠϯγεςϜ࣮ફΨΠυ

    View full-size slide

  8. !8
    ػೳύλʔϯ ͱ ೝ஌ύλʔϯ
    ػೳύλʔϯ
    w 6*ͷߏ੒ཁૉʢ͍ΘΏΔʮػೳʯʣ
    w ϢʔβʔͷߦಈΛՄೳʹͨ͠
    Γɺଅͨ͠Γ͢Δͷ͕໨త
    w ʮಈࢺʯʹ͍ۙ
    w ॻ͘ɺಡΉɺڞ༗͢Δɺݕࡧ͢
    Δʜ
    ೝ஌ύλʔϯ
    w ݟͨ໨ɾ֎؍
    w τʔϯɺλΠϙάϥϑΟɺΧϥʔύϨοτɺ

    ϨΠΞ΢τɺΠϥετɺΞΠίϯελΠϧɺܗঢ়ɺ
    ςΫενϟɺִؒɺը૾ɺΠϯλϥΫγϣϯɺ

    ΞχϝʔγϣϯFUDʜ
    w ϒϥϯυͷίΞɾࠩผԽཁҼ
    w ʮܗ༰ࢺʯʹ͍ۙ
    w ͔Θ͍͍ɺ৺஍Α͍ɺ਌͠Έ΍͢
    ͍ɺඒ͍͠ʜ
    σβΠϯύλʔϯ
    σδλϧϓϩμΫτͷ
    ࠓ೔͸ͬͪ͜ͷ࿩

    View full-size slide

  9. !9
    esaͷσβΠϯݪଇ
    σβΠϯΛ͢Δͱ͖ʹؾΛ͚ͭΔ͜ͱΛݴޠԽ͢Δ

    View full-size slide

  10. !10
    αʔϏεͷσβΠϯݪଇΛߟ͑Δ
    ʮϒϥϯυΛΑ͘ද͢ಛ௃ͱɺආ͚Δ΂͖ಛ௃Λʙݸڍ͛Δʯ
    Design Systems P.78ΑΓ
    .BJM$IJNQͷ৔߹
    w ָ͍͚͠ΕͲࢠڙͬΆ͘ͳ͍
    w ໘ന͍͚Ͳ;͚͍ͯ͟ͳ͍
    w ύϫϑϧ͚ͩͲ΍΍͘͜͠ͳ͍
    w ྲྀߦͷ࠷ઌ୺Ͱ͋Δ͚ͲೃછΈ͕͋Δ
    w ΧδϡΞϧ͚ͩͲͩΒ͠ͳ͘ͳ͍
    όϥϯεײ֮ ͷݴޠԽ

    View full-size slide

  11. !11
    esaͷσβΠϯݪଇ
    ָ͍͠ɾ͔Θ͍͍ɾΏΔ͍
    ৽઱ɾ໨৽͍͠
    ΤϯδχΞϑϨϯυϦʔ
    πʔϧͱͯ͠࢖͍΍͍͢
    حΛͯΒΘͣೃછΈਂ͍
    ΤϯδχΞҎ֎΋࢖͍ͨ͘ͳΔ
    ਌͠Έ΍͢͞
    ͚ΕͲ

    View full-size slide

  12. !12
    esaͷσβΠϯݪଇ
    ָ͍͠ɾ͔Θ͍͍ɾΏΔ͍
    ৽઱ɾ໨৽͍͠
    ΤϯδχΞϑϨϯυϦʔ
    πʔϧͱͯ͠࢖͍΍͍͢
    حΛͯΒΘͣೃછΈਂ͍
    ΤϯδχΞҎ֎΋࢖͍ͨ͘ͳΔ
    ਌͠Έ΍͢͞
    ݸੑ
    ݸੑͱීวੑͷόϥϯε
    ઑ͍ͬͯΔɾଞͱ͸ҧ͏
    ීวੑ
    ਌͠Έ΍͍͢ɾ҆৺ײ

    View full-size slide

  13. !13
    esaͷΧϥʔ
    FTBͷΧϥʔεΩʔϜ͸ͲͷΑ͏ʹόϥϯεΛͱ͍ͬͯΔ͔
    main-color
    #0a9b94
    text-color
    #3c4a60
    accent-color
    #f29600
    base-color
    #efede0

    View full-size slide

  14. !14
    esaͷϝΠϯΧϥʔͷ৚݅
    FTBʹͱͬͯҰ൪όϥϯεͷྑ͍৭ͱ͸Կ͔ʁ
    w ໨ʹ΍͍͞͠৭
    w ϦϯΫ৭ʹ΋࢖͑Δ৭
    w ઌೖ؍ͷগͳ͍৭
    w ڝ߹͕গͳ͍৭
    w ΧδϡΞϧͰ໌Δ͍৭
    main-color
    #0a9b94
    ීวੑ
    w ਌͠Έ΍͍͢
    w ҆৺ײ
    w ࢖͍΍͍͢
    w ΦʔιυοΫε
    ݸੑ
    w ଞͱ͸ҧ͏
    w ҹ৅త
    w ۀ຿ͬΆ͘ͳ͍

    View full-size slide

  15. !15
    όϥϯεͷྑ͍৭Λফڈ๏Ͱ୳ͦ͏
    GSPNIUUQTqBUVJDPMPSTDPNQBMFUUFEFGP

    View full-size slide

  16. !16
    ໨ʹ༏͍͠৭
    ೔ৗతʹ࢖͏௕͘ݟΔը໘ͳͷͰɺ͋·Γܹࢗతͳ৭͸ආ͚͍ͨ
    Ϣʔβʔͷ࡞ۀͷअຐʹͳΒͳ͍Α͏ʹ
    ☓ஆ৭ܥ
    w ͪΐͬͱΪϥΪϥͦ͠͏
    w ͔Θ͍͍͚Ͳπʔϧͱͯ͠௕͍࣌
    ؒ໨ʹ͢Δʹ͸఍߅͕͋Δ
    ☓ࢵ
    w ͪΐͬͱΪϥΪϥͦ͠͏

    View full-size slide

  17. !17
    ϦϯΫ৭ʹ΋࢖͑Δ৭
    ϝΠϯΧϥʔΛϦϯΫͷจࣈ৭ʹ΋ྲྀ༻͠ɺ৭਺Λ͓͑͞γϯϓϧͳը໘ʹ͍ͨ͠
    ☓ԫ৭
    w จࣈ৭ʹ͸ݟͮΒ͍
    ☓੺
    w XBSOJOHܥͱ͔ͿΔ
    ☓Ϟϊτʔϯܥ
    w ී௨ͷจࣈ৭ͱ͔ͿΔ

    View full-size slide

  18. !18
    ઌೖ؍ͷগͳ͍৭
    ͍ΖΜͳਓʹ࢖ͬͯ΄͍͠ͷͰɺͳΔ΂͘૝ى͞ΕΔઌೖ؍΍όΠΞε͕গͳ͍ɺ
    ͋Δछແػ࣭Ͱɺதཱతͳ৭ʹ
    ☓ࢵ
    w ߴوͳײ͡
    w ޷͖ݏ͍Θ͔ΕΔ
    ☓੺ܥ
    w ঁࢠͬΆ͍ͱ͍͏ઌೖ؍ʁ
    w ͜͜ʹ͸ͳ͍͚ͲϐϯΫ΋
    ☓㐋ɾΦϨϯδ
    w ݩؾͳײ͡
    w ޷͖ݏ͍͕গ͠Θ͔Εͦ͏

    View full-size slide

  19. !19
    ڝ߹͕গͳ͍৭
    ྨࣅαʔϏεͱ͸ҰઢΛըͨ͠ɺҹ৅తʹ࢒Δ৭
    ☓ϒϧʔ
    w ৘ใܥͷαʔϏεʹଟ͍
    w ੨͍ΞΠίϯ͹͔ͬΓฒ
    ΜͩΓ͢Δ
    ☓ԫ྘
    w ੨΄ͲͰ͸ͳׂ͍͕ͱ͋
    Δײ͡

    View full-size slide

  20. !20
    ΧδϡΞϧͰ໌Δ͍৭
    ָ͍͠ײ͡Λ૝ىͤ͞Δ৭
    ☓ࢵ
    w γοΫͰΤϨΨϯτ
    ☓ೱࠠɾϞϊτʔϯ
    w ҉͍
    w ͔ͬͪΓਅ໘໨

    View full-size slide

  21. !21
    ফڈ๏ͰɺΤϝϥϧυάϦʔϯ͕࢒ͬͨ
    ̋ΤϝϥϧυάϦʔϯ
    w ໨ʹ༏͘͠ɺϦϯΫ৭ʹ΋࢖͑Δ
    w ڝ߹αʔϏε΋͋·Γଟ͘ͳ͍
    w ΧδϡΞϧͰ໌Δ͍ײ͡
    w όΠΞε͕গͳ͍৭
    w ࣗ෼ͷ޷͖ͳ৭Ͱ΋͋Δʢॏཁʣ

    View full-size slide

  22. !22
    esaͷςΩετΧϥʔ
    r text-color
    #3c4a60
    accent-color
    #f29600
    base-color
    #efede0
    ࣮͸ɺࠇͰ΋άϨʔͰ΋ͳ͍ɻೱࠠͳͷͩͬͨɻ

    View full-size slide

  23. !23
    esaͷςΩετΧϥʔ
    ࣮͸ɺࠇͰ΋άϨʔͰ΋ͳ͍ɻೱࠠͳͷͩͬͨɻ
    text-color
    #3c4a60
    black
    #000000
    dark gray
    #444444

    View full-size slide

  24. !24
    black
    #000000
    dark gray
    #444444
    text-color
    #3c4a60

    View full-size slide

  25. !25
    ςΩετΧϥʔʹগ͠৭ຯΛՃ͑Δ
    main-color
    #0a9b94
    text-color
    #3c4a60
    a
    base-color
    #efede0
    main-color
    #0a9b94
    text-color
    #3c4a60
    accent-color
    #f29600
    base-color
    #efede0
    w ΍ΘΒ͔͘ચ࿅͞Εͨҹ৅ʹͳΔ
    w ը໘ʹʮ৭ؾʯ͕ग़Δɻແຯס૩ɾߗ͕͞཈͑ΒΕΔ
    w ϝΠϯΧϥʔͷΤϝϥϧυάϦʔϯͱΑ͘ௐ࿨͢Δ੨ܥʹৼΔ
    w ʢஆ৭ܥͩͱগ͠ೱ஡ܥʹৼͬͨΓ͢Δ͜ͱ͕ଟ͍ʣ

    View full-size slide

  26. !26
    esaͷϕʔεΧϥʔ
    ίίͷ৭
    main-color
    #0a9b94
    base-color
    #efede0

    View full-size slide

  27. !27
    άϨʔʹͯ͠ΈΔͱྫྷ͍ͨײ͡ʹ…
    ࢖͍ͨ͞൒ݮ

    View full-size slide

  28. !28
    ϕʔεΧϥʔʹ΋গ͠৭ຯΛՃ͑Δ
    main-color
    #0a9b94
    text-color
    #3c4a60
    a
    base-color
    #efede0
    main-color
    #0a9b94
    text-color
    #3c4a60
    a
    base-color
    #efede0
    w ϝΠϯΧϥʔͱͷௐ࿨
    w ϏϏουͳ৭ΞΠϘϦʔˠ΍ΘΒ͔ͰԹ͔Έͷ͋Δҹ৅ͷը໘ʹ

    View full-size slide

  29. !29
    esaͷλΠϙάϥϑΟ
    ςΩετʹؔ͢ΔσβΠϯͷߟ͑ํ

    View full-size slide

  30. !30
    esaͷλΠϙάϥϑΟͷݪଇ
    w ָ͍͠ɾΘ͘Θ͘͢Δ
    w Θ͘Θ͘͢Δɾߴ༲ײ
    w ॻ͖ͳ͕Βߟ͑ΔͷΛॿ͚Δ
    ͜ͷ΁ΜΛ৺͕͚ͯ࡞ΔΑ͏ʹ͍ͯ͠·͢
    w ετϨε͕ͳ͍
    w ৘ใΛ੔ཧ͠΍͍͢
    w จষ΋ίʔυ΋ಡΈ΍͘͢
    ݸੑ
    ઑ͍ͬͯΔɾଞͱ͸ҧ͏
    ීวੑ
    ࢖͍΍͢͞ɾΦʔιυοΫε
    ಡΜͰͯPSॻ͍ͯͯ

    View full-size slide

  31. !31
    δϟϯϓ཰͕ߴ͍ͷ͕ಛ௃
    w FTBͷδϟϯϓ཰ͷߴ͞ʹ͸ɺେ͖ͭ͘ͷҙਤ͕͋Γ·͢
    ʢδϟϯϓ཰ຊจʹର͢Δɺݟग़͠ɾλΠτϧͷจࣈαΠζͷେ͖͞ͷൺ཰ʣ

    View full-size slide

  32. !32
    WIP
    reaction
    h1
    h2
    h3
    tag
    ຊจ
    link
    category
    title
    action
    ཁૉ͕݁ߏଟ͍

    View full-size slide

  33. !33
    δϟϯϓ཰ͰཁૉؒͷϝϦϋϦΛग़͢
    ☓δϟϯϓ཰খ
    ϝϦϋϦ͕ͳ͍ɻ
    λΠτϧͷ಺༰͕໨ʹೖͬͯདྷͮΒ͍ɻ
    εΧεΧͯ͠ऐ͍͠ײ͕͢͡Δׂʹɺཁૉؒͷ
    ҧ͍͕Θ͔ΓͮΒͪ͘͝Όͪ͝Όͨ͠ײ͡ʹ
    ̋δϟϯϓ཰େ
    λΠτϧ͕ೖ͖ͬͯ΍͍͢ɻ
    ཁૉؒͷҧ͍͕Θ͔Γ΍͍͢
    ը໘ʹϦζϜ͕ੜ·Εɺ͍͖͍͖ͱ͢Δɻ

    View full-size slide

  34. !34
    ΤσΟτϦΞϧσβΠϯΛҙࣝ
    FTBͷهࣄϖʔδ͸ɺࡶࢽ΍৽ฉͳͲͷࢴ໘σβΠϯΛͪΐͬͱҙࣝͯ͠·͢
    w ߴ͍δϟϯϓ཰
    w ܩઢɾۭ͔͍ؒͮ
    ಡΉ࣌ͷշద͞ɺோΊΔتͼʹ͍ͭͯ௕೥ࢼߦࡨޡ͞Ε͖ͯͨ෼໺
    ೃછΈਂ͍͚ͲɺWebαʔϏεͱͯ͠͸৽઱

    View full-size slide

  35. !35
    esaͷϩΰɾϚείοτ
    ͔Θ͍͞ͱςοΫײͷόϥϯε

    View full-size slide

  36. !36
    esaͷϩΰλΠϓ
    w FTBͱ͍͏໊લ
    w τϦͷΩϟϥΫλʔ
    esa
    طଘॻମΛϕʔεʹͯ͠ɺΑΓ௕ํܗʹۙͮ͘Α͏ʹௐ੔ɻ
    ॊΒ͔͞Λ཈͑ͯɺεΫΤΞͳҹ৅ʹɻ
    ΏΔ͍ɾ͔Θ͍͍
    w ϩΰλΠϓͷॻମ
    5FDIײɾεΫΤΞ
    த࿨ɾόϥϯε

    View full-size slide

  37. !37
    esaͷΩϟϥΫλʔ
    w ਌͠Έ΍͢͞
    w Ѫᇷ
    ΏΔ͍ɾ͔Θ͍͍
    w ᇪͼͳ͍ɾແද৘
    w ந৅తɾزԿֶత
    γϯϘϦοΫ
    த࿨ɾόϥϯε
    ͔Θ͍͍͚ͩ͡Όͳ͘ɺγϯϘϧϚʔΫͱͯ͠΋੒ཱ͢ΔΑ͏ʹόϥϯεΛऔͬͨɻ

    View full-size slide

  38. !38
    w زԿֶతͳ଄ܗʹدͤΔ
    w ଄ܗΛγϯϓϧʹ
    w ྠֲઢ͸ͳ͘໘͚ͩͰදݱ
    w ओு͗͢͠ͳ͍ɾॊΒ͔͞
    زԿֶతʹ ໘͚ͩͰදݱ
    ଄ܗΛγϯϓϧʹ → γϯϘϦοΫʹ

    View full-size slide

  39. !39
    ͍ͭͷؒʹ͔ΩϟϥΛ֫ಘ
    ΠϕϯτͰԕ੐ͨ࣌͠ʹɺ͝౰஍όʔδϣϯΛ࡞ͬ
    ͯ༡ΜͰ͍Δ
    w ൒֯ΧφͰΧλίτΛͭͿ΍͘ŪůŠŪ
    w ࡶͰద౰ͳײ͕ͩ͡ɺָͦ͠͏ʹੜ͖͍ͯΔ
    w ໊લ͸ͳ͍ʢτϦͱ͔ΤαυϦͱ͔ݺ͹Ε͍ͯΔʣ
    w ࠷ۙ͸৯΂ΒΕΔΩϟϥʹͳΓ͕ͪ
    w ͵͍͙ΔΈ͸ɺ!GVLBZBUTVͷख๓͍

    View full-size slide

  40. !40
    esaΒ͠͞ͱ͸Կ͔ʁ
    FTBΛ௨ͯ͡ڞ༗͍ͨ͠Ձ஋ͱਫ਼ਆ

    View full-size slide

  41. !41
    Ethos(Τʔτε):
    ݹ୅ΪϦγϟޠͰ׳श΍ؾ࣭ͷҙຯɻసͯࣾ͡ձ΍จԽɺಛఆͷूஂͷ
    جຊతͳߟ͑ํɺੑ֨ɺؾ෩ɺಛੑͷҙຯͰ࢖ΘΕΔ
    ϓϩμΫτΛ௨ͯ͡දݱ͍ͨ͠Ձ஋ͱਫ਼ਆ
    Τʔτε (Ethos)
    Design Systems P.16ΑΓ
    ݸਓతʹ͸ɺैདྷಉٛͷ͜ͱΛʮίϯηϓτʯͱ͍͏ݴ༿Ͱදݱ͖ͯ͠·͕ͨ͠ɺ
    ʮΤʔτεʯͷํ͕ΑΓਖ਼֬ʹ఻ΘΓͦ͏ͳͷͰɺͪ͜Βʹม͑·ͨ͠ɻ

    View full-size slide

  42. !42
    esaͷΤʔτε
    ʮ৘ใΛɺҭ͍ͯͨɻʯ

    View full-size slide

  43. !43
    Ұ౓ʹ׬ᘳΛ໨ࢦ͢ͷͰ͸ͳ͘ɺ
    ͩΜͩΜͱΑ͍ͯ͘͜͠͏ͱ͍͏Ձ஋؍
    ʮҭͯΔʯ
    w զʑ͕ීஈߦ͍ͬͯΔɺFTBͷ։ൃͷࠜఈʹ΋͋ΔՁ஋؍
    w զʑ͚ͩͰͳ͘ɺ਎ͷճΓͷ։ൃऀʢFTBΛ࢖ͬͯཉ͍͠ਓୡʣʹ΋ڞ
    ௨͢ΔՁ஋؍
    w ࣗ෼͕ͨͪීஈ͔Βେ੾ʹ͍ͯ͠ΔՁ஋؍ʹؾ͖ͮɺݴޠԽ͢Δ
    w τϦͬΆ͞ɺΤαͬΆ͞΋ײͤ͡͞ΔϫʔυˠΑΓڧݻͳੈք؍ʹ

    View full-size slide

  44. !44
    ΤʔτεΛάϥϑΟοΫʹ
    w τϦҭͯΔˠʦཛˠ੒௕ˠ૥ͮ͘ΓʧˠετʔϦʔʹ͢Δ
    w ϏδϡΞϥΠζ͢Δ͜ͱͰɺΑΓੈք؍͕͸͖ͬΓݟ͑ͯ͘Δ

    View full-size slide

  45. !45
    طʹͦ͜ʹ͋ΔՁ஋؍Λɺܗʹͯ͠఻͑Δ
    w զʑ։ൃऀࣗ਎͕αʔϏεΛҭͯΔಓඪʹͳΔ
    w ͜ͷػೳ΍σβΠϯ͸ʮ৘ใΛҭͯΔʯͨΊͷ΋ͷʹͳ͍ͬͯΔ͔ʁͱ͍͏໰͍Λ࣋ͭ
    w ϢʔβʔͱϓϩμΫτΛͭͳ͙Ս͚ڮʹͳΔ
    w Τʔτεʹڞײͯ͠΋Β͏͜ͱͰɺΑΓFTBʹ߹ͬͨϢʔβʔʹ࢖ͬͯ΋Β͑Δ
    w Ϣʔβʔ͕ΤʔτεΛਂ͘ཧղ͢Δ͜ͱͰɺϢʔβʔࣗ਎͕ΑΓྑ͍FTBͷ࢖͍ํΛൃݟ͢Δ
    Τʔτεͷ۩ݱԽ
    αʔϏεͷΏΔ͗ͳ͍ݸੑʹ

    View full-size slide

  46. !46
    ݸੑͷݯ͸ɺΤʔτεͰ͋Δ
    Τʔτεͱීวੑͷόϥϯε
    Balance!
    Τʔτε ීวੑ
    w ݸੑ
    w ݻ༗ͷՁ஋؍ɾੈք؍
    w ࣗ෼ͨͪͷओு
    w Ϣʔβʔχʔζ
    w ࢖͍΍͢͞ɾ਌͠Έ΍͢͞
    w ੈؒɾଞऀ

    View full-size slide

  47. !47
    σβΠϯ͸ײ͔֮ʁཧ࿦͔ʁ
    ࠷ޙʹ

    View full-size slide

  48. !48
    ࣮͸ׂͱɺܗ͔Βߟ͍͑ͯ·͢
    ͜͏͍͏࿩Λ͢ΔͱɺʮσβΠϯΛཧ۶͔Βߟ͍͑ͯΔʯͱΑ͘ݴΘΕΔ͚Ͳɺ࣮ࡍ͸ͦ͏Ͱ΋ͳͯ͘ʜ
    w ਓʹઆ໌͠Α͏ͱ͢Δͱཧ۶ɾཧ࿦ʹدΔ
    w આ໌͍ͯ͠Δཧ۶͸ɺ࣮͸શͯޙ෇͚ͷ΋ͷͰ͋Δ
    w ʢFTBͷ྘৭΋ɺཧ۶Λߟ͑Δલ͔Β࣮͸ܾΊͯ·ͨ͠ʣ
    w σβΠϯ͸ݴޠͰઆ໌͠ͳͯ͘΋ɺݟͨ໨Λ௨࣮ͯ͠ײͱͯ͠
    ఻ΘΔ΋ͷͰͳͯ͘͸ҙຯ͕ͳ͍
    w ݴޠ͸ෆ׬શͳදݱखஈʜܗମͷྑ͞͸ݴޠԽ͖͠Εͳ͍ɻʮ͑΋͍ΘΕ͵Α͞ʯ
    w όϥϯεײ֮͸ɺཧ۶͚ͩͰ͸ͳ͘ମಘ͢Δඞཁ͕͋Δ
    w ମҭɾεϙʔπͱ͔ʹଟ෼ࣅͯΔɻ࣮ફͰ஁͍͑ͯ͘ඞཁ͕͋Δɻ
    w ཧ۶͚ͩͰΘ͔ͬͨؾʹͳͬͪΌ͏ͷةݥʂ

    View full-size slide

  49. !49
    σβΠϯΛߟ͑Δ࣌ͷϓϩηε
    ݴ༿ͷ*OQVU
    w ࢀߟจݙΛಡΉɺώΞϦϯάΛ͢Δ
    w ࢥ͍ͭ͘ΩʔϫʔυΛॻ͖ग़͠ͳ͕Βߟ͑Δ

    ܗͷ*OQVU
    w ৭ΜͳࢀߟσβΠϯΛݟͳ͕Βߟ͑Δ
    w ྨࣅ8FC"QQ
    w άϥϑΟοΫʗϓϩμΫτσβΠϯ


    ͜Εͩοʂ
    ࣗ෼ͷ৔߹͸͜Μͳײ͡Ͱ͢ɻ
    ʮܗʯ͕೴಺ʹͻΒΊ͘ɾࢥ͍ͭ͘ɾ߱Γͯ͘Δ
    w εέον͢Δ
    w ඳըɾϓϩτλΠϐϯά
    w ʢίʔσΟϯάʣ
    ܗͷ0VUQVU

    w σβΠϯͷݴޠԽɾઆ໌
    w ෼ղɾ෼ੳɾݕূ
    ݴ༿ͷ0VUQVU

    View full-size slide

  50. !50
    ෼ղɾݕূͱͯ͠ͷσβΠϯͷݴޠԽ
    w ࢥ͍͍ͭͨʮܗʯͷߏ੒ཁૉΛ෼ղͯ͠ݴޠԽ͢Δ
    w ϦόʔεΤϯδχΞϦϯάͷΑ͏ͳײ͡
    w ʮܗʯ͕ຊ౰ʹཧʹ͔ͳͬͨɺద੾ͳ΋ͷ͔Λݕূ͢Δ
    w ඞཁͳཁ݅ʹ߹͍ͬͯΔ͔ʁ໰୊ղܾʹద͍ͯ͠Δ͔ʁ
    w Τʔτε΍σβΠϯݪଇʹऩଋ͢Δ΋ͷͰ͋Δ͔ʁےͷ௨ͬͨ΋ͷͰ͋Δ͔ʁ
    w ݴޠԽͯ͠આ໌ՄೳͰ͋Δ͜ͱͰɺσβΠϯʹڧ౓ͱઆಘྗ͕૿͢
    w νʔϜϝΠτͱ΋σβΠϯݪଇΛڞ༗͠΍͍͢ˠଞͷਓ΋ҰॹʹσβΠϯΛߟ͑ͯ͘ΕΔΑ͏ʹ
    ͳΔ
    w ݴޠԽ͓ͯ͘͜͠ͱͰɺ࣍ͷσβΠϯվળͷώϯτʹͳΔʢࣗ෼ʹ΋νʔϜϝϯόʔʹ΋ʣ

    View full-size slide

  51. !51
    ײ֮ͱཧ࿦͸྆ྠ
    ྆ํΛߦ͖དྷͯ͠ߟ͑ͳ͕ΒɺσβΠϯΛϒϥογϡΞοϓ͍ͯ͘͠
    w εέον
    w ϓϩτλΠϐϯά
    w ࣮ࡍ࢖ͬͯΈΔ
    w ݴޠԽ
    w ෼ղɾ෼ੳ
    w ઃܭ
    ײ֮ʢܗମʣ ཧ࿦ʢݴ༿ʣ
    ࡞ͬͯɾ࢖ͬͯɺ
    ͦͷҙຯΛ֬ೝ͢Δ
    ݴ༿͕ɺ࡞Δʗվળ͢Δ
    ͨΊͷࢦ਑ʹͳΔ

    View full-size slide

  52. !52
    Ұݟ૬൓͢Δ΋ͷͷؒͰόϥϯεΛऔΔ
    ײ֮
    ݸੑత
    ͔Θ͍͍
    ΤϯδχΞ
    झຯ
    ࣗ෼ͷΤΰ
    ͭ·Γ͸ɺόϥϯε
    ରཱͤͣ͞ɺௐ࿨ͤ͞Δɻ
    ཧ࿦
    ීวత
    ΧοίΠΠ
    ඇΤϯδχΞ
    Ϗδωε
    ੈؒͷχʔζ
    ݸੑΛൃشͭͭ͠΋ɺۃ୺ͰઌӶతʹͳΒͣɺ

    ଟ͘ͷਓʹ਌͠ΜͰ΋Β͑Δ΋ͷΛ࡞Δɺ̍ͭͷϙΠϯτͩͱߟ͑·͢ɻ

    View full-size slide

  53. !53
    Enjoy Balance!
    Thank you!
    ))

    View full-size slide