視覚言語とUI

Transcript

1. גࣜձࣾ͸ͯͳ
   
   ҏ౻୓ ࢹ֮ݴޠͱUI
2. ҏ౻୓ גࣜձࣾ͸ͯͳ
   Mackerel AD, Designer @takuwolog
3. ௚ײతαʔόʔ؂ࢹαʔϏεMackerelͰ͢ɻ
7. ࢹ֮ݴޠ͔Βߟ͑Δ
8. 6*ͳͲͷཁૉΛߏ੒͢Δ࠷খ୯Ґͷ
   ࢹ֮తʹҙຯΛ࣋ͬͨελΠϧΛ
   ࢹ֮ݴޠͱݺΜͰ͍·͢ɻ ࢹ֮ݴޠͱ͸ʁ
9. Mackerelͷࢹ֮ݴޠ
10. border: 2px solid #cccccc
11. border: 2px solid #cccccc
12. border: 2px solid #cccccc
13. border: 2px solid #4dbddb
14. border: 1px dashed #aaaaaa
15. border: 1px dashed #aaaaaa
16. border: 1px dashed #aaaaaa
17. border: 2px solid #4dbddb
18. border: 1px solid #edeeef
19. border: 1px solid #edeeef
20. border: 1px solid #edeeef
21. ࢹ֮ݴޠΛ૊Έ߹ΘͤΔ
22.  ϑΥʔϜͷઢ എܠ ΞΠίϯ จݴ VJTFMFDUCPY ྫ͑͹ηϨΫτϘοΫε
23. ྫ͑͹ηϨΫτϘοΫε
24. ઢͱഎܠ VJDMJQCPBSE ྫ͑͹ΫϦοϓϘʔυ IPWFS͢ΔͱUPPMUJQग़Δ ΞΠίϯ ΫοϦϓϘʔυͷ಺༰  ʢ
    
    DPEF
    
    ʹ΋࢖͏ελΠϧʣ
25. ྫ͑͹ΫϦοϓϘʔυ
26. ྫ͑͹
    ηϨΫτϘοΫεͱ
    Πϯϓοτ  ϑΥʔϜͷઢ എܠ ΞΠίϯ จݴ VJTFMFDUCPY ϑΥʔϜͷઢ ϓϨʔεϗϧμʔ
27. ηϨΫτϘοΫε Πϯϓοτ ྫ͑͹
    ηϨΫτϘοΫεͱ
    ΫϦοϓϘʔυ
28. ͍Ζ͍Ζ߹Θ͞Δͱ͜Μͳײ͡
29. ·ͱΊ
30. αʔϏεͷ৘ใʢػೳ΍ੈք؍ʣΛ
    ઢ΍ΞΠίϯͱ͍ͬͨࢹ֮ݴޠʹͯ͠
    ҙຯΛϢʔβʔʹ఻͑Δ͜ͱͰ͢ɻ ࢹ֮ݴޠͷ໾ׂ
31. ࢹ֮ݴޠͱUI ࢹ֮ݴޠΛҰఆͷϧʔϧͷ΋ͱ࢖༻ͯ͠6*Λ࡞Δ͜ͱͰ
    ϢʔβʔͱαʔϏεͷεϜʔζͳର࿩Λ໨ࢦ͍ͯ͠·͢ɻ
32. ৽εςοΧʔຊ๜ॳ഑෍ ཉ͍͠ํ͸੠͔͚͍ͯͩ͘͞ɻ
33. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ