Tablet-first thinking - タブレットファーストの考え方

タブレットデバイスからUIを設計するメリットのお話です。

Transcript

1. λϒϨο
   τϑΝʔετͷߟ͑ํ
   %FTJHO)BDL/BHPZB
   
   

   View Slide

2. ϑϦʔϥϯε
   σβΠφʔσϕϩούʔ
   :"5ͷCMPHΛӡӦ
   :"5
   

   View Slide

3. ͓࢓ࣄ
   ϒϥϯσΟϯά
   σβΠϯ
   ઃܭ
   ίʔσΟϯά
   ϥΠςΟϯά
   όοΫΤϯυ
   αʔόʔαΠυ
   ϑϩϯτΤϯυ
   8PSE1SFTT
   

   View Slide

4. ͓࢓ࣄ
   ϒϥϯσΟϯά
   σβΠϯ
   ઃܭ
   ίʔσΟϯά
   ϥΠςΟϯά
   όοΫΤϯυ
   αʔόʔαΠυ
   ϑϩϯτΤϯυ
   8PSE1SFTT
   

   View Slide

5. ͜Μͳ͜ͱͳ͍Ͱ͔͢ʁ
   

   View Slide

6. λϒϨοτͷσβΠϯ͕ͳ͍
   w εέδϡʔϧͷ౎߹
   w ༧ࢉͷ౎߹
   w λϒϨοτϢʔβʔ͕গͳ͍
   

   View Slide

7. λϒϨοτϢʔβʔ͕গͳ͍
   

   View Slide

8. ༧૝͞ΕΔݟղ
   ࢖͍ͮΒ͍
   εϚʔτϑΥϯͰॆ෼
   ͔ͬ͠ΓݟΔͳΒ1$
   

   View Slide

9. ͦͷઌΛߟ͑Δ
   w λϒϨοτͰ͸࢖͍ͮΒ͍ͩΖ͏ͱ͍͏ϢʔβʔͷԱଌ
   w ෳ਺ਓͰݟΔࡍʹλϒϨοτ͸ݟ΍͍͢͸ͣ
   w Ͳ͏͍͏γʔϯͰͦͷαʔϏεΛར༻͍ͯ͠Δ͔
   

   View Slide

10. ௚ײతͳ6*Λ
    ߟ͑ͯΈΑ͏
    σϞ
    

    View Slide

11. w ΩʔϘʔυΛ࢖͏λΠϛϯάͰ΋λοϓͰ͖Δ΋ͷΛ༻ҙ͢Δ
    w ͳΔ΂͘νΣοΫϘοΫε΍ϥδΦϘοΫεͳͲΛ༻ҙ͢Δ
    w ਺ࣈೖྗʹมΘΔ෺Λߟ͑Δ
    

    View Slide

12. ࢖͏γʔϯΛ૝ఆ͢Δ
    

    View Slide

13. View Slide

14. View Slide

15. View Slide

16. ϚϧνσόΠεΛߟ͑΍͍͢
    

    View Slide

17. View Slide

18. ·ͱΊ
    w Ϣʔβʔ͕গͳ͍͚ͩͰ൑அ͍͍͔ͯ͠͸Α͘ߟ͑Δ
    w λονσόΠε޲͚ͷ6*͸1$Ͱ΋༏Ґ
    w ֤σόΠεʹΑͬͯϢʔβʔͷγʔϯ͸ҟͳΔ
    w ϨεϙϯγϒͷࠩҟΛߟ͑΍͍͢
    

    View Slide

19. ࠂ஌
    DESIGNFRONT
    

    View Slide

20. σβΠϯϑϩϯτ
    wσβΠϯ͕޷͖
    wσβΠϯʹڵຯ͕͋Δ
    ͦΜͳਓୡ͕ू·ΔίϛϡχςΟ
    

    View Slide

21. σβΠϯϑϩϯτ
    IUUQTEFTJHOGSPOUDPOOQBTTDPNFWFOU
    

    View Slide

22. GBDFCPPLϖʔδ
    IUUQTXXXGBDFCPPLDPNHSPVQT
    

    View Slide

23. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
    !ZBUKQ
    IUUQTXQZBUOFUDPN
    ϒϩά
    

    View Slide