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

エンジニアがUIデザインをしてみた話

 エンジニアがUIデザインをしてみた話

dachi023

July 29, 2016
Tweet

More Decks by dachi023

Other Decks in Programming

Transcript

  1. ΤϯδχΞ͕6*σβΠϯΛͯ͠Έͨ࿩
    σβΠφʔͱΤϯδχΞ͕ڠྗλοάΛ૊ΜͩαʔϏε։ൃ
    $POOFIJUPJOD'SPOUFOE&OHJOFFS3ZP"EBDIJ
    Ո଒ͷຖ೔Λ΋ͬͱসإʹɻ

    View full-size slide

  2. ͸͡Ί·ͯ͠ʂ
    w ʙ
    w ϑϩϯτΤϯυΤϯδχΞ
    w ͖ͬ͞ϛχϦϡ΢ั·͑·ͨ͠
    ҆ୡྏ !EBDIJ@

    View full-size slide

  3. w ͸͡Ίʹ
    w 6*σβΠϯΛͯ͠Έͨ࿩
    w ෼͔ͬͨ͜ͱɺྑ͔ͬͨ͜ͱ
    w ·ͱΊ
    ࠓ೔࿩͢͜ͱ

    View full-size slide

  4. ͸͡Ίʹ
    σβΠφʔͱΤϯδχΞ͕ڠྗλοάΛ૊ΜͩαʔϏε։ൃ
    Ո଒ͷຖ೔Λ΋ͬͱসإʹɻ

    View full-size slide

  5. w αʔόαΠυ
    w 1)1
    w ϑϩϯτΤϯυ
    w +BWB4DSJQU
    w $44
    ͸͡Ίʹ
    ࢲͷ࢓ࣄ

    View full-size slide

  6. σβΠϯ͸ૉਓʜ
    ͸͡Ίʹ

    View full-size slide

  7. ͔͠΋σβΠφʔ͞Μͱͷ࢓ࣄॳΊͯʜ
    ͸͡Ίʹ

    View full-size slide

  8. 6*σβΠϯΛͯ͠Έͨ࿩
    σβΠφʔͱΤϯδχΞ͕ڠྗλοάΛ૊ΜͩαʔϏε։ൃ
    Ո଒ͷຖ೔Λ΋ͬͱসإʹɻ

    View full-size slide

  9. w Ұॹʹ࢓ࣄΛ͍ͯ͠ΔσβΠφʔ͞Μͷ࢓ࣄΛཧղ͢Δ
    w σβΠϯ͸Կ͕େมͳͷ͔ʁ
    w ΤϯδχΞ͕ख఻͑Δ͜ͱ͸ͳ͍͔ʁ
    w ྑ͍ίϛϡχέʔγϣϯΛऔΔʹ͸ʁ
    6*σβΠϯΛͯ͠Έͨ࿩
    ͳΜͰ΍Ζ͏ͱࢥ͔ͬͨ

    View full-size slide

  10. ᶃ 6*Λࣗ෼Ͱߟ͑Δ
    ᶄ $44Λࣗ෼Ͱॻ͘
    ᶅ (JU)VCͰެ։͢Δ
    6*σβΠϯΛͯ͠Έͨ࿩
    6*σβΠϯΛ࠷ޙ·Ͱ΍ͬͯΈΔ

    View full-size slide

  11. 6*σβΠϯΛͯ͠Έͨ࿩
    ᶃ6*Λࣗ෼Ͱߟ͑Δ

    View full-size slide

  12. w δΣωϨʔλ
    w ίϐϖ
    6*σβΠϯΛͯ͠Έͨ࿩
    ᶄ$44Λࣗ෼Ͱॻ͘

    View full-size slide

  13. w ࠓͷࣗ෼ͷ࣮ྗΛӅ͞ͳ͍
    w ܧଓͯ͠ྑ͍ͯ͘͘͠౒ྗΛ͢Δ
    w IUUQTHJUIVCDPNEBDIJCPJMFSQMBUF
    6*σβΠϯΛͯ͠Έͨ࿩
    ᶅ(JU)VCͰެ։͢Δ

    View full-size slide

  14. ෼͔ͬͨ͜ͱɺྑ͔ͬͨ͜ͱ
    σβΠφʔͱΤϯδχΞ͕ڠྗλοάΛ૊ΜͩαʔϏε։ൃ
    Ո଒ͷຖ೔Λ΋ͬͱসإʹɻ

    View full-size slide

  15. w ΋ͷ͕͔͔࣌ؒ͘͢͝Δ
    w ϩδΧϧʹߟ͑ΒΕͳ͍
    ෼͔ͬͨ͜ͱɺྑ͔ͬͨ͜ͱ
    ෼͔ͬͨ͜ͱ

    View full-size slide

  16. w σβΠϯͷେม͞Λײ͡ΒΕͨ
    w 6*Λߟ͑Δͷָ͕͘͠ͳ͖ͬͯͨ
    ෼͔ͬͨ͜ͱɺྑ͔ͬͨ͜ͱ
    ྑ͔ͬͨ͜ͱ

    View full-size slide

  17. ·ͱΊ
    σβΠφʔͱΤϯδχΞ͕ڠྗλοάΛ૊ΜͩαʔϏε։ൃ
    Ո଒ͷຖ೔Λ΋ͬͱসإʹɻ

    View full-size slide

  18. w ·ͣ͸ࣗ෼͕ࠓͰ͖Δ͜ͱΛߟ͑ͯ΍ͬͯΈΔ
    w ૬खͷ΍͍ͬͯΔ࢓ࣄͷେม͞Λࣗ෼΋ײͯ͡ΈΔ
    w େม͞Λ஌ͬͯΑΓྑ͘͢Δํ๏Λߟ͑Δ
    ͍͞͝ʹ
    ͍͞͝ʹ

    View full-size slide

  19. σβΠφʔ͞Μɺ͍ͭ΋͋Γ͕ͱ͏ʂʂ
    ͍͞͝ʹ

    View full-size slide

  20. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
    σβΠφʔͱΤϯδχΞ͕ڠྗλοάΛ૊ΜͩαʔϏε։ൃ
    Ո଒ͷຖ೔Λ΋ͬͱসإʹɻ

    View full-size slide