2022.10.05 DroidKaigi 2022 https://droidkaigi.jp/2022/timetable/364496
Practical Glass EE2app development@shanonim1࣮ફ Glass EE2 ͚ΞϓϦ։ൃ
View Slide
2
ࠓ͢͜ͱ● Google Glass ͷྺ࢙● Glass EE2 ʹ͍ͭͯ● ಋೖࣄྫ● σβΠϯΨΠυϥΠϯͷղઆ● ϢʔβʔΠϯλʔϑΣʔεͷղઆ● αϯϓϧϓϩμΫτͷղઆ3
ࠓ͞ͳ͍͜ͱ● Glass EE2 Ҏ֎ͷεϚʔτάϥεʹ͍ͭͯ● ߪೖํ๏ͱηοτΞοϓํ๏● Glass EE2 ͚ΞϓϦͷӡ༻ʢϦϦʔεΞοϓσʔτʣʹ͍ͭͯ4
Google Glass5
6ref: https://www.youtube.com/watch?v=9c6W4CCU9M4
● 2013: ൃച։࢝○ HMD/ARσόΠεͷઌۦ͚○ Glassware ͷੜ● 2015: ൢചऴྃ○ ϓϥΠόγʔ○ σΟεϓϨΠࢹʹΑΔ҆શੑͷݒ೦7Google Glass
8Glass Enterprise Edition● 2017: Enterprise Edition (EE) ൢച։࢝○ toB ͚σόΠεͱͯ͠ϦχϡʔΞϧ● 2019: Enterprise Edition 2 (EE2) ൢച։࢝○ EE ͷεϖοΫ্൛○ ։ൃऀ͚αϙʔτͷॆ࣮○ 2020ʹҰൠ։ൃऀ͚ͷൢച։࢝
9Glass Enterprise Edition● 2017: Enterprise Edition (EE) ൢച։࢝○ toB ͚σόΠεͱͯ͠ϦχϡʔΞϧ● 2019: Enterprise Edition 2 (EE2) ൢച։࢝○ EE ͷεϖοΫ্൛○ ։ൃऀ͚αϙʔτͷॆ࣮○ 2020ʹҰൠ։ൃऀ͚ͷൢച։࢝
Tech spec10
● ӈͷલʹ͋ΔϓϦζϜ͕σΟεϓϨΠͱͯ͠ػೳ͢Δ● ؟ڸͷϨϯζ͕σΟεϓϨΠʹͳ͍ͬͯͨΓɺບʹө૾ΛӨ͢ΔܗࣜͰͳ͍11Tech spec
12ref: https://www.youtube.com/watch?v=cJA0E19REHQ
13Tech Spec● Android 8.1 (Oreo)● Memory 3GB / Storage 32GB● Display (640x360)● WiFi / Bluetooth● Camera / Microphones / Audio-out● Touchpad
14Tech Spec● Android 8.1 (Oreo)● Memory 3GB / Storage 32GB● Display (640x360)● WiFi / Bluetooth● Camera / Microphones / Audio-out● Touchpad
15Tech Spec● Android 8.1 (Oreo)● Memory 3GB / Storage 32GB● Display (640x360)● WiFi / Bluetooth● Camera / Microphones / Audio-out● Touchpad
● ӈଆͷଆ෦͕λονύουʹͳ͍ͬͯΔ16Touchpad
17GlassGestureDetectorref: https://github.com/googlesamples/glass-enterprise-samples● λονύουͷδΣενϟʔΛఆٛ● جຊδΣενϟʔ4બ○ TAP○ SWIPE_FORWARD○ SWIPE_BACKWARD○ SWIPE_DOWN
18TAP● ຊମͷଆ໘Λλοϓ○ બࢶͷ֬ఆ○ ೖྗͷܾఆ
19SWIPE_FORWARD● ຊମͷޙΖ͔ΒલεϫΠϓ○ ࣍ϖʔδͷදࣔ○ બࢶΛਐΊΔ
20SWIPE_BACKWARD● ຊମͷલ͔ΒޙΖεϫΠϓ○ લϖʔδͷදࣔ○ બࢶΛ͢
21SWIPE_DOWN● Touchpad ͷதԝ͔ۙΒԼεϫΠϓ○ Android εϚʔτϑΥϯͷ back Ωʔʹ૬͢ΔΞΫγϣϯ○ લʹΔ○ ऴྃ͢Δ
Demo22
Demo● 🤔 Glass ΞϓϦ͕ͲͷΑ͏ʹಈ͘ͷ͔○ 🃏 CardSample■ ͍͔ͭ͘ͷจষ͕ॱ൪ʹදࣔ͞ΕΔΞϓϦ○ 📷 Camera + Gallery■ Glass ͰࣸਅΛࡱӨ͢Δ■ ࡱӨͨࣸ͠ਅΛӾཡ͢Δ23
Don't try to replace smartphone, tablet, or laptop featureswith Glass.24
25● Glass EE2 ɺεϚʔτϑΥϯΛશʹସ͢ΔσόΠεͰͳ͍● εϚʔτϑΥϯλϒϨοτͦͷଞͷσόΠεͱڠௐ͠ɺͦΕΒͷػೳΛ ʮิʯ͢ΔσόΠεͱͯ͠ར༻͢Δ͜ͱ͕ਪ͞ΕΔGlass is …?
Case studies26
27● ྲྀݿͰͷՙཧ○ QRίʔυϦʔμʔͰಡΈऔͬͨใΛ Glass ͷσΟεϓϨΠʹදࣔͯ͠࡞ۀ͢Δ○ ՙͷ͚ɾνΣοΫϦετͷ֬ೝCase studiesref: https://www.google.com/glass/case-studies/
28● େܕػցͷอकϝϯςφϯεۀ○ Glass ͷΧϝϥө૾ΛԕִͱϦΞϧλΠϜʹڞ༗͠ɺ࡞ۀࢦࣔΛड͚Δ○ ϚχϡΞϧΛ Glass ͷσΟεϓϨΠʹදࣔ͠ͳ͕Β࡞ۀ͢ΔCase studiesref: https://www.google.com/glass/case-studies/
Good case👍● ϋϯζϑϦʔ○ ͷલʹৗʹը໘͕͋Δঢ়ଶ■ ը໘Λݟͳ͕Β࡞ۀ͢ΔݱͰಛʹޮՌΛൃش͢Δ○ ԻʹΑΔૢ࡞29
Not good case 🥲● ࡉ͔͍จࣈͷӾཡ○ σΟεϓϨΠαΠζͷ߹্ɺݟ͍͢จࣈαΠζ͕ݶΒΕΔ○ طଘͷ Web ϖʔδΛͦͷ··ϒϥδϯά͢Δͷࠔ● ෳࡶͳը໘ૢ࡞○ 1ը໘ͰෳͷΞΫγϣϯΛ࣮ߦͤ͞Δͷࠔ30
Design guidelines31
32● Glass ͚ΞϓϦ։ൃʹಛԽͨ͠σβΠϯΨΠυϥΠϯ● σΟεϓϨΠͷࢹೝੑͱૢ࡞ੑΛଛͳΘͳ͍ͨΊͷϧʔϧDesign guidelines
● ͻͱͰΘ͔Δ○ Ϣʔβʔ͕ը໘ͷϝοηʔδΞϓϦͷૢ࡞Λ͙͢ʹཧղͰ͖Δ○ ΛࡉΊͯݟΔඞཁͷͳ͍ใ33Glanceable✅❌
34Timely● దͳλΠϛϯάͰใΛఏڙ͢Δ○ ݱࡏͷঢ়ଶͱɺΞΫγϣϯͨ͠ޙͷঢ়ଶΛཧղͯ͠Β͏TAP
35Easy to tap● λοϓ͍͢͜͠ͱ● λοϓͰ͖Δ͜ͱ͕Θ͔Δ͜ͱ
36Time saving● ࣌ؒͷઅ○ Ϣʔβʔ͕λεΫΛૉૣྃ͘Ͱ͖ΔΑ͏ʹ͢Δ○ ͜ͷը໘ͰԿ͕Ͱ͖Δͷ͔ॠ࣌ʹཧղͰ͖ΔఏҊΛߦ͏TAPTAPҰཡৄࡉૢ࡞
User interface37
User interface● Theme● Layout○ Main Layout○ Left column layout38
● ActionBar ͷͳ͍શը໘දࣔ● ࠇ৭ͷഎܠ○ ిফඅͷ੍● ന৭ͷςΩετ39Theme
● body○ ϝΠϯςΩετΛஔ͢ΔྖҬ○ .fontSize = 40.sp● footer○ ิ༻ͷαϒςΩετΛஔ͢ΔྖҬ○ ϝΠϯςΩετͱൺͯࢹೝੑ͕͍ͷͰҙ͕ඞཁ○ .fontSize = 14.sp40Main Layout
● left-body○ ը૾Λஔ͢ΔྖҬ○ .width(240.dp)● right-body○ ϝΠϯςΩετΛஔ͢ΔྖҬ○ .fontSize = 30.sp● footer○ ิ༻ͷαϒςΩετΛஔ͢ΔྖҬ○ .fontSize = 14.sp41Left column layout
App development42
Glass EE2 App development43● ։ൃڥ○ εϚʔτϑΥϯ͚ͷ Android ΞϓϦ։ൃͱಉ༷■ ✅ Android Studio■ ✅ Jetpack Compose■ ⚠ GMS (Google Mobile Services) ར༻ෆՄ
sample: GlassRecipe44● ྉཧϨγϐΛӾཡ͢Δ Glass ΞϓϦ○ Recipes■ 🍳 ྉཧΛબ͢Δ○ Steps■ 📝 ྉཧͷखॱΛӾཡ͢Δ
45Recipes● Left column layout○ left body■ ࣸਅϓϨϏϡʔ○ right body■ λΠτϧͱࡐྉ○ footer■ ࣍ͷը໘ભҠͰ͖Δ͜ͱΛهࡌGlanceableTime savingGlanceable
46Steps● Main layout○ body■ ྉཧखॱͷઆ໌○ footer■ Πϯδέʔλʔ■ ྉཧखॱ͕͍ͭ͋͘Δ͔Λ͍ࣔͯ͠ΔTime savingTimelyGlanceable
Demo47
Jetpack Compose in Glass App48● Glass ΞϓϦͰ Horizontal ViewPager ͕ଟ༻͞ΕΔ● Jetpack Compose Λ͏͜ͱͰ؆ܿʹ࣮Մೳ○ accompanist-pager○ accompanist-pager-indicators● Preview Λͬͯ Glass UI Λ࠶ݱ
Jetpack Compose in Glass App49● Glass ΞϓϦͰ Horizontal ViewPager ͕ଟ༻͞ΕΔ● Jetpack Compose Λ͏͜ͱͰ؆ܿʹ࣮Մೳ○ accompanist-pager○ accompanist-pager-indicators● Preview Λͬͯ Glass UI Λ࠶ݱ
50
Jetpack Compose in Glass App51● Glass ΞϓϦͰ Horizontal ViewPager ͕ଟ༻͞ΕΔ● Jetpack Compose Λ͏͜ͱͰ؆ܿʹ࣮Մೳ○ accompanist-pager○ accompanist-pager-indicators● Preview Λͬͯ Glass UI Λ࠶ݱ
52
Conclusion53
Glass Enterprise Edition 254● Android OS ͕ಈ͘εϚʔτάϥε○ ։ൃऀ͕ࣗ༝ʹεϚʔτάϥεΞϓϦΛ։ൃͰ͖Δ● εϚʔτϑΥϯλϒϨοτΛશʹସ͢ΔσόΠεͰͳ͍͕ɺͦΕΒͱΈ߹ΘͤΔ͜ͱͰ৽͍͠ମݧΛ࡞ΕΔՄೳੑ͕͋Δ
Google Glass ͷະདྷ55● Enterprise Edition ͷීٴ○ ϋʔυΣΞͷՁ֨ͱௐୡͷ○ ޙܧػछ● toC ͚ Glass ͷ࠶དྷ○ ϓϥΠόγʔͷղܾ○ εϚʔτϑΥϯΛʮิʯ͢ΔσόΠε͔Βɺʮସʯ͢ΔσόΠε
56@shanonim @cookpad_jp
Appendix57● Project Glass: One day…○ https://www.youtube.com/watch?v=9c6W4CCU9M4● Google Glass (Glass EE2) ߪೖϨϙʔτ○ https://medium.com/@shanonim/glass-ee2-buying-guide-5e84f55496ce
Appendix58