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

エンジニアのためのデザインの話

Pちゃん
November 09, 2015

 エンジニアのためのデザインの話

BKDC vol.1

Pちゃん

November 09, 2015
Tweet

More Decks by Pちゃん

Other Decks in Design

Transcript

  1. ΤϯδχΞͷͨΊͷ
    σβΠϯͷ࿩
    1ͪΌΜ
    IUUQQDIKQ!QDI@KQ

    View full-size slide

  2. 1ͪΌΜJT୭
    1ͪΌΜ͸ɺͨͩͷίʔμʔɻ
    ݝཱ͓͸͖ͩΕ͍͖Ε͍େֶͷҰճੜɻ

    View full-size slide

  3. աڈʹ͜Μͳ͜ͱ΍ͬͯ·ͨ͠
    ੲ͸σβΠφʔΛ໨ࢦͯͨ͠ɻ
    த͔Βߴʹ͔͚ͯҹ࡮ܥσβΠϯࣄ຿ॴͰमߦɻ
    ߴͰํ޲స׵ͯ͠ΤϯδχΞΛࢤ͢ɻ
    ߴ͔Β͸8FC੍࡞ձࣾͰΞϧόΠτɻ
    ͦΜͳ͜ΜͳͰɺ
    ͦ͜ΒลͷେֶੜΑΓ͔͸σβΠϯ෼͔Δɻ
    ؾ͕͢Δɻ

    View full-size slide

  4. ͜͏͍͏ͷΛͳ͍ͨ͘͠ʂͱࢥͬͯདྷ·ͨ͠ɻ
    ΤϯδχΞʮԶ͸ηϯε͕ͳ͍͔ΒσβΠϯ͸Ͱ͖ͳ͍ɻʯ
    ΤϯδχΞʮԶ͸ֆ͕͔͚ͳ͍͔ΒσβΠϯ͸Ͱ͖ͳ͍ɻʯ
    ΤϯδχΞʮԶʹ͸#PPUTUSBQ͕͋Δɻ͔ͩΒɺେৎ෉ɻʯ

    View full-size slide

  5. σβΠϯJTԿʁ

    View full-size slide

  6. σβΠϯͱΞʔτͷҧ͍͸ԿͰ͔͢ʁ

    View full-size slide

  7. σβΠϯ͸໰୊ղܾͰ͋Γ
    Ξʔτ͸ࣗݾදݱͰ͋Δ

    View full-size slide

  8. σβΠϯ͸໰୊ղܾɺ
    σβΠϯ͸໰୊ղܾɻ
    େࣄͳ͜ͱͳͷͰճݴ͍·ͨ͠ɻ

    View full-size slide

  9. Զ͸ηϯε͕ͳ͍͔ΒσβΠϯ͸Ͱ͖ͳ͍ɻ
    ͦΜͳ͜ͱͳ͍Αɺ໰୊ղܾͱ͍͏ҙຯͰ͸
    σβΠϯ΋ϓϩάϥϛϯά΋ࣅͨΑ͏ͳϞϊ
    ͦͯ͠ɺ໰୊ղܾ͸
    ηϯε΍ײ֮ͰͲ͏ʹ͔ͳΔ΋ͷͰ͸ͳ͍ɻ

    View full-size slide

  10. ͋͑ͯݴ͓͏ɺ
    σβΠϯ͸ϩδοΫͰ͋Δͱ

    View full-size slide

  11. ϩδΧϧɺ
    ނʹ୭Ͱ΋Ͱ͖Δ
    σβΠφʔ͸ηϯε͕͋Δ͔ΒσβΠϯ͕Ͱ͖Δ
    Θ͚Ͱ͸͋Γ·ͤΜɻ
    ϧʔϧΛक͍ͬͯΔ͔Βɺ఻͍͑ͨ৘ใΛ఻͑Δ
    ͨΊͷσβΠϯ͕Ͱ͖͍ͯΔͷͰ͢ɻ

    View full-size slide

  12. σβΠϯͷ
    جຊ࢛ݪଇ
    ۙ઀
    ੔ྻ
    ίϯτϥετ
    ൓෮

    View full-size slide

  13. ؔ܎ཁૉΛ͚ۙͮ
    ͦ͏Ͱͳ͍ཁૉΛ཭͢

    View full-size slide

  14. ݝཱ͓͸͖ͩΕ͖Ε͍େֶ
    ֶ෦঺հ
    ηΫγʔσβΠϯֶ෦
    ηΫγʔϓϩάϥϛϯάֶ෦
    ϠΫβֶ෦
    ͓͸େమͷᎄ
    ͱʹ͔͘ηΫγʔʹ΍Ε
    ඞཁҎ্ʹϏϏΔͳ
    งғؾ͸࣮ફͰ௫Ί
    ֶ௕Λݟ͔͚ͨΒԥΕ

    View full-size slide

  15. ݝཱ͓͸͖ͩΕ͖Ε͍େֶ
    ɹֶ෦঺հ
    ɹɹηΫγʔσβΠϯֶ෦
    ɹɹηΫγʔϓϩάϥϛϯάֶ෦
    ɹɹϠΫβֶ෦
    ɹ͓͸େమͷᎄ
    ɹɹͱʹ͔͘ηΫγʔʹ΍Ε
    ɹɹඞཁҎ্ʹϏϏΔͳ
    ɹɹงғؾ͸࣮ફͰ௫Ί
    ɹɹֶ௕Λݟ͔͚ͨΒԥΕ

    View full-size slide

  16. ݝཱ͓͸͖ͩΕ͖Ε͍େֶ
    ɹֶ෦঺հ
    ɹɹηΫγʔσβΠϯֶ෦
    ɹɹηΫγʔϓϩάϥϛϯάֶ෦
    ɹɹϠΫβֶ෦
    ɹ͓͸େమͷᎄ
    ɹɹͱʹ͔͘ηΫγʔʹ΍Ε
    ɹɹඞཁҎ্ʹϏϏΔͳ
    ɹɹงғؾ͸࣮ફͰ௫Ί
    ɹɹֶ௕Λݟ͔͚ͨΒԥΕ
    άϧʔϐϯά

    View full-size slide

  17. ؔ࿈͢Δ৘ใΛάϧʔϓԽ͢Δ͜ͱͰ
    ৘ใΛ૊৫Խ͢Δ͜ͱ͕Ͱ͖Δ

    View full-size slide

  18. શͯͷཁૉΛҙࣝతʹ഑ஔ͢Δ͜ͱ

    View full-size slide

  19. ཁૉ͕཭Ε͍ͯͯ΋
    ੔ྻ͍ͯ͠Ε͹ݟ͑ͳ͍ઢͰ
    ඥ෇͚Δ͜ͱ͕Ͱ͖Δ

    View full-size slide

  20. ݟ͑ͳ͍ઢΛҙࣝ͢Δ
    ˓ͱ˘Λඥ෇͚Δ

    View full-size slide

  21. ৘ใͷ૊৫ԽΛΑΓڧݻͳ΋ͷʹ

    View full-size slide

  22. ίϯτϥετ

    View full-size slide

  23. ίϯτϥετͱ͸

    View full-size slide

  24. ͸͖ͬΓͨ͠ҧ͍Λग़͢͜ͱͰ
    ৘ใͷ૊৫ԽΛࢧԉ͢Δ

    View full-size slide

  25. ݝཱ͓͸͖ͩΕ͖Ε͍େֶ
    ɹֶ෦঺հ
    ɹɹηΫγʔσβΠϯֶ෦
    ɹɹηΫγʔϓϩάϥϛϯάֶ෦
    ɹɹϠΫβֶ෦
    ɹ͓͸େమͷᎄ
    ɹɹͱʹ͔͘ηΫγʔʹ΍Ε
    ɹɹඞཁҎ্ʹϏϏΔͳ
    ɹɹงғؾ͸࣮ફͰ௫Ί
    ɹɹֶ௕Λݟ͔͚ͨΒԥΕ

    View full-size slide

  26. ݝཱ͓͸͖ͩΕ͖Ε͍େֶ
    ɹֶ෦঺հ
    ɹɹηΫγʔσβΠϯֶ෦
    ɹɹηΫγʔϓϩάϥϛϯάֶ෦
    ɹɹϠΫβֶ෦
    ɹ͓͸େమͷᎄ
    ɹɹͱʹ͔͘ηΫγʔʹ΍Ε
    ɹɹඞཁҎ্ʹϏϏΔͳ
    ɹɹงғؾ͸࣮ફͰ௫Ί
    ɹɹֶ௕Λݟ͔͚ͨΒԥΕ

    View full-size slide

  27. ࣌ʹ͸େ୾ʹ΍Ε

    View full-size slide

  28. དྷͨΕɺ৽ೖੜʂ
    ݝཱ͓͸͖ͩΕ͍͖Ε͍େֶͰ͸ɺຖ೥݄ʹͲ
    ηϯλʔࢼݧʹΑΔબߟΛߦ͍ͬͯ·͢ɻ
    Ͳηϯλʔࢼݧͱ͸ɺͲΕ͚ͩηϯλʔʹدΕͨ
    ͔Ͱֶੜͷ࣮ྗΛ൑ఆ͢Δબߟํ๏Ͱ͢ɻ
    ຖ೥ɺ⺧ͷࠩͰଟ͘ͷֶੜ͕ྦΛྲྀ͢ɺඇৗʹ
    ೉қ౓ͷߴ͍બߟͱͳ͓ͬͯΓ·͢ɻ
    ࢤئऀ֤Ґʹ͓͔Ε·ͯ͠͸ɺৗ೔ࠒ͔Βηϯλʔ
    ʹدΔֶशΛ৺͕͚͍ͯͩ͘͞ɻ
    ئॻड෇ظؒd

    View full-size slide

  29. དྷͨΕɺ৽ೖੜʂ
    ݝཱ͓͸͖ͩΕ͍͖Ε͍େֶͰ͸ɺຖ೥݄ʹͲ
    ηϯλʔࢼݧʹΑΔબߟΛߦ͍ͬͯ·͢ɻ
    Ͳηϯλʔࢼݧͱ͸ɺͲΕ͚ͩηϯλʔʹدΕͨ
    ͔Ͱֶੜͷ࣮ྗΛ൑ఆ͢Δબߟํ๏Ͱ͢ɻ
    ຖ೥ɺ⺧ͷࠩͰଟ͘ͷֶੜ͕ྦΛྲྀ͢ɺඇৗʹ
    ೉қ౓ͷߴ͍બߟͱͳ͓ͬͯΓ·͢ɻ
    ࢤئऀ֤Ґʹ͓͔Ε·ͯ͠͸ɺৗ೔ࠒ͔Βηϯλʔ
    ʹدΔֶशΛ৺͕͚͍ͯͩ͘͞ɻ
    ئॻड෇ظؒd

    View full-size slide

  30. σβΠϯ্ͷԿ͔ͷಛ௃Λ
    ࡞඼Λ௨ͯ͠܁Γฦ͢͜ͱ

    View full-size slide

  31. ࣌଎ϊοτΛތΔεΫʔϧόεɻӡ
    ༻࣌ࠁݫकͰ஗ࠁ஌Βͣɻ͓͸େੜ
    Ͱ͋Ε͹ແྉͰར༻Ͱ͖·͢ɻ
    ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ฼
    ·ͰԿͰ΋ἧ͏ߪങ෦Ͱ͢ɻੜెʹ
    خ͍͠୯Ґ΋ൢച͓ͯ͠Γ·͢ɻ
    εΫʔϧόε
    ߪങ෦ʮܹ҆ࡾࠃࢤʯ
    ൓෮ͱ͸

    View full-size slide

  32. ࣌଎ϊοτΛތΔεΫʔϧόεɻӡ
    ༻࣌ࠁݫकͰ஗ࠁ஌Βͣɻ͓͸େੜ
    Ͱ͋Ε͹ແྉͰར༻Ͱ͖·͢ɻ
    ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ฼
    ·ͰԿͰ΋ἧ͏ߪങ෦Ͱ͢ɻੜెʹ
    خ͍͠୯Ґ΋ൢച͓ͯ͠Γ·͢ɻ
    εΫʔϧόε
    ߪങ෦ʮܹ҆ࡾࠃࢤʯ
    ൓෮ͱ͸

    View full-size slide

  33. ࣌଎ϊοτΛތΔεΫʔϧόεɻӡ
    ༻࣌ࠁݫकͰ஗ࠁ஌Βͣɻ͓͸େੜ
    Ͱ͋Ε͹ແྉͰར༻Ͱ͖·͢ɻ
    ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ฼
    ·ͰԿͰ΋ἧ͏ߪങ෦Ͱ͢ɻੜెʹ
    خ͍͠୯Ґ΋ൢച͓ͯ͠Γ·͢ɻ
    εΫʔϧόε
    ߪങ෦ʮܹ҆ࡾࠃࢤʯ
    ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ฼
    ·ͰԿͰ΋ἧ͏ߪങ෦Ͱ͢ɻੜెʹ
    خ͍͠୯Ґ΋ൢച͓ͯ͠Γ·͢ɻ
    εΫʔϧόε
    ߪങ෦ʮܹ҆ࡾࠃࢤʯ
    ࣌଎ϊοτΛތΔεΫʔϧόεɻӡ
    ༻࣌ࠁݫकͰ஗ࠁ஌Βͣɻ͓͸େੜ
    Ͱ͋Ε͹ແྉͰར༻Ͱ͖·͢ɻ
    ൓෮ͱ͸

    View full-size slide

  34. ಉ͡Χλνɾ৭ɾ࣭ײͳͲΛ܁Γฦ͠࢖͏͜ͱͰ
    σβΠϯʹҰ؏ੑΛ࣋ͨͤΔ͜ͱ͕Ͱ͖Δ

    View full-size slide

  35. σβΠϯͷ
    جຊ࢛ݪଇ
    ۙ઀
    ੔ྻ
    ίϯτϥετ
    ൓෮

    View full-size slide

  36. ৄ͘͠͸ɺ͜ͷॻ੶Λಡ΋͏ʂ
    ΤϯδχΞքͷʮϦʔμϒϧίʔυʯ
    Έ͍ͨͳॻ੶ͩͧʂ
    ϊϯσβΠφʔζ
    σβΠϯϒοΫ

    View full-size slide

  37. ౰ͨΓલͷ͜ͱ͔͠ॻ͍ͯͳ͍͚Ͳ
    ΊͬͪΌେࣄɺ࣮ફஈ֊Ͱ๨Ε͕ͪ

    View full-size slide

  38. ΋ͪΖΜɺ͜ͷ࢛ݪଇ͚ͩͰσβΠϯ͕
    Ͱ͖ΔΑ͏ʹͳΔΘ͚Ͱ͸ͳ͍ɻ

    View full-size slide

  39. ଞʹ΋ɺ഑৭ɺλΠϙάϥϑΟʔɺ࣭ײʹֶ͍ͭͯͿͱྑ͍
    ωΫετεςοϓ
    Typo
    ഑৭ λΠϙάϥϑΟʔ ࣭ײ

    View full-size slide

  40. ࠷దͳσβΠϯͱ࠷దͳΤϯδχΞϦϯά͕͋ͬͯͦ͜ɺ
    ྑ͍αʔϏε΍ϓϩμΫτ͕ੜ·ΕΔͱ৴ͯ͡Δɻ

    View full-size slide