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

App Clip - in a nutshell

App Clip - in a nutshell

WWDC キャッチアップ会の資料

Avatar for yuichiro_takahashi

yuichiro_takahashi

September 09, 2020
Tweet

More Decks by yuichiro_takahashi

Other Decks in Technology

Transcript

  1. ςΩετ AGENDA ▸ App Clip - in a nutshell ▸

    App Clip? ▸ App Clip ͷҰੜ ▸ ࣮૷࣌ͷ஫ҙ ▸ App Clip ͷઃఆ ▸ αʔόͱϓϩδΣΫτͷઃఆ ▸ App Store Connect Ͱͷઃఆ ▸ Smart App Banner ͷઃఆ ▸ ༏Εͨ App Clip Λ࡞Δʹ͸ʁ ▸ App Clip Card ΛΧελϚΠζ͢Δ ▸ App Clip Λγϯϓϧʹอͭ ▸ ආ͚Δ΂͖͜ͱ
  2. ςΩετ 1. APP ▸ ΈΜͳେ޷͖(?) iOS ΞϓϦ ▸ App Clip

    ͸ΞϓϦͷ Extension ͱ ͯ͠ಈ࡞͢ΔͨΊɺඞͣຊମͱͳΔ ΞϓϦ͕ඞཁ ▸ ιʔείʔυ΍ը૾ͳͲͷΞηοτ ΋ App Clip ͱڞ༗Մೳ
  3. ςΩετ 2. APP CLIP EXPERIENCE ▸ Ϣʔβ͕ App Clip Λݟ͚ͭͯମݧ

    ͢ΔࡍͷΤϯτϦʔϙΠϯτ ▸ NFC λά΍ App Clip Code, QRίʔ υͳͲ༷ʑͳܗࣜͰݟ͚ͭΒΕΔ ▸ ಺෦తʹ͸ Universal Links ͷΑ͏ ͳ URL ͱͳ͍ͬͯΔ ▸ App Store Connect ͔Βొ࿥͢Δ͜ ͱͰ App Clip ͕༗ޮʹͳΔ
  4. ςΩετ 2. APP CLIP EXPERIENCE ▸ App Clip Code ͸֎ଆ͕

    QRίʔυ ͷΑ͏ʹͳ͍ͬͯͯɺਅΜத͸ NFC λάʹͳ͓ͬͯΓɺΧϝϥͰε Ωϟϯͯ͠΋ɺ୺຤Λλονͯ͠΋ ྑ͍ ▸ ଞʹ΋ Web ΍ Siri ͷαδΣετ͔ Β΋୳͢͜ͱ͕Ͱ͖Δ
  5. ςΩετ 3. APP CLIP ▸ ࠓճͷओ໾ ▸ ઌ΄Ͳͷ App Clip

    Experience ͔Βىಈ ͢Δ͜ͱ͕Ͱ͖Δ ▸ ΞϓϦຊମΛΠϯετʔϧ͠ͳͯ͘΋ω ΠςΟϒͷମݧ͕ఏڙͰ͖Δ༏Ε΋ͷ ▸ ΞϓϦຊମͰ࢖͑ΔϑϨʔϜϫʔΫ͸΄ ͱΜͲ࢖͑Δ ▸ App Clip ͱ App ͸ഉଞతͳؔ܎Ͱ͋Γ ซ༻͸Ͱ͖ͳ͍
  6. ςΩετ 3. APP CLIP ▸ ࠓճͷओ໾ ▸ ઌ΄Ͳͷ App Clip

    Experience ͔Βىಈ ͢Δ͜ͱ͕Ͱ͖Δ ▸ ΞϓϦຊମΛΠϯετʔϧ͠ͳͯ͘΋ω ΠςΟϒͷମݧ͕ఏڙͰ͖Δ༏Ε΋ͷ ▸ ΞϓϦຊମͰ࢖͑ΔϑϨʔϜϫʔΫ͸΄ ͱΜͲ࢖͑Δ ▸ App Clip ͱ App ͸ഉଞతͳؔ܎Ͱ͋Γ ซ༻͸Ͱ͖ͳ͍
  7. ςΩετ 1. ग़ձ͍ ▸ ྫ͑͹ίʔώʔγϣοϓ ▸ ݟ͚ͭͨ App Clip Code

    ʹλον ͢Δ͔εΩϟϯ͢Δ ▸ ୺຤ʹΞϓϦ͕Πϯετʔϧ͞Εͯ ͍ͳ͍৔߹͸ࣗಈతʹ App Clip Λ ୳ͯ͠μ΢ϯϩʔυ͠ App Clip Card ͕දࣔ͞ΕΔ
  8. ςΩετ 2. ىಈ ▸ ىಈલʹ͸ຖճ App Clip Card ͱ͍ ͏

    App Clip Λىಈ͢ΔͨΊͷը໘ ͕දࣔ͞ΕΔ ▸ Open ϘλϯΛԡ͢ࣄͰ App Clip ͕ىಈͯ͠ར༻ՄೳʹͳΔ
  9. ςΩετ 3. APP CLIP Λ࢖͏ ▸ ࢖͍উख͸΄ͱΜͲωΠςΟϒͱม ΘΒͳͦ͞͏ ▸ άϩʔόϧφϏήʔγϣϯ͕ͳ͍ͨ

    ΊγϯϓϧʹͳΔ͔΋ ▸ ࢖͑Δػೳ΋ωΠςΟϒͱḮ৭ͳ͘ ▸ Apple Pay Ͱܾࡁͨ͠Γɾɾɾ
  10. ςΩετ 3. APP CLIP Λ࢖͏ ▸ ࢖͍উख͸΄ͱΜͲωΠςΟϒͱม ΘΒͳͦ͞͏ ▸ άϩʔόϧφϏήʔγϣϯ͕ͳ͍ͨ

    ΊγϯϓϧʹͳΔ͔΋ ▸ ࢖͑Δػೳ΋ωΠςΟϒͱḮ৭ͳ͘ ▸ Apple Pay Ͱܾࡁͨ͠Γɾɾɾ ▸ ίʔώʔ͕Ͱ͖ͨ͜ͱΛ௨஌Ͱ஌Β ͤͨΓͰ͖Δ
  11. ςΩετ 3. APP CLIP Λ࢖͏ ▸ ௨஌ʹ͸গ͠ϧʔϧ͕͋Γ ▸ σϑΥϧτͰ 8࣌ؒޙ·Ͱ

    ▸ ࠷େͰ1िؒޙ·Ͱ௨஌ΛૹΔ͜ͱ ͕Ͱ͖Δ(ྫ͑͹ϨϯλΧʔͷฦ٫ ظݶΛϦϚΠϯυ͍ͨ͠৔߹)
  12. ςΩετ 4. ผΕͷ࣌ ▸ ແࣄίʔώʔΛड͚औͬͨΒ App Clip ͷ໾໨͸ऴΘΓ ▸ Ұఆ࣌ؒ(Serval

    day)࢖ΘΕͳ͍ͱ App Clip ͸ࣗಈతʹ୺຤͔Β͍ͳ͘ͳ ΓɺόοΫΞοϓʹ΋࢒Βͳ͍ ▸ App Clip ʹอଘ͍ͯ͠Δσʔλ΍ App Clip ͷ Keychain ͷσʔλ΋Ұॹ ʹফ͑Δ ▸ ຖேίʔώʔΛങ͏ͨΊʹ࢖͍ͬͯΔΑ͏ͳ৔߹͸σʔλ͸࡟আ͞Εͳ͘ ͳΔՄೳੑ͕͋Δ
  13. ςΩετ 5.ͣͬͱҰॹʹɾɾɾ ▸ App Clip Λؾʹೖͬͯɺ͙͢ʹΞ ϓϦΛΠϯετʔϧͯ͠΋Β͑ΔΑ ͏ʹదٓ App Banner

    Λද͓ࣔͯ͠ ͘ͱྑ͍ ▸ App ͷμ΢ϯϩʔυ࣌ʹ App Clip ͷσʔλ͸ফ͑ͯ͠·͏
  14. ςΩετ 5.ͣͬͱҰॹʹɾɾɾ ▸ Ͱ΋ App Clip ͱ App ڞ௨ͷσʔλ ίϯςφʹσʔλΛೖΕ͓͚ͯ͹

    App ͔Βσʔλ͕ίϐʔ͞ΕΔ·Ͱ อ͓͍࣋ͯͯ͘͠ΕΔ ▸ App Clip ར༻࣌ʹڐՄ͞ΕͨΧϝ ϥͳͲͷݖݶ΋ͦͷ·· App ʹҾ ͖ܧ͕ΕΔ
  15. ςΩετ 1. APP CLIP ͸ 10MB ҎԼʹೲΊΔ ▸ App Clip

    ͸ී௨ͷΞϓϦͱҧ͍ૉ ૣ͘ىಈ͠࢖͑Δ͜ͱ͕ॏཁ ▸ ༰ྔΛ 10MB ҎԼʹೲΊɺ͔ͭى ಈʹඞཁͳΞηοτ͸શؚͯ·Εͯ ͍Δඞཁ͕͋Δ ▸ ͦΕҎ্σʔλ͕ඞཁͳ৔߹͸ىಈ ޙʹదٓμ΢ϯϩʔυ͢ΔͳͲͯ͠ όϥϯεΛͱΔ
  16. ςΩετ 2, ϑϨʔϜϫʔΫͷ੍ݶ ▸ جຊతʹΞϓϦຊମͰ࢖͑ΔϑϨʔϜϫʔΫ͸΄ͱΜͲ࢖͑Δ ▸ ͕ HelthKit ͳͲҰ෦ػີੑͷߴ͍Ϣʔβ৘ใʹ͍ͭͯ͸ΞΫηε੍͕ݶ ͞ΕΔ

    ▸ ͳͷͰطଘͷίʔυΛ࢖͏৔߹͸σʔλ΁ͷݖݶ͕͋Δ͔νΣοΫ͢Δॲ ཧΛೖΕΔͷ͕٢ ▸ ػີੑͷߴ͍σʔλ͕ඞཁͳ৔߹͸ΞϓϦຊମΛΠϯετʔϧͯ͠΋Β͏ ▸ Ґஔ৘ใʹ͍ͭͯ͸ App Clip ޲͚ͷ৽͍͠ API ͕͋ΔͷͰͦͪΒΛ࢖͏
  17. ςΩετ 3,ىಈͷ੍ݶ ▸ App Clip ͸ಛఆͷମݧΛఏڙ͢Δ ͜ͱʹूத͓ͯ͠Γɺ Universal Links ΍

    Custom URL Scheme ͔Β ͸ىಈͰ͖ͳ͍ ▸ ΋͠ App Clip ͰαΠϯΠϯͤͨ͞ ͍৔߹͸ Sign in with Apple ΍ ASWebAuthenticationSession Λ ར༻͢Δ
  18. ςΩετ APP CLIP ͷઃఆ ▸ ઃఆͷखॱ͸େ·͔ʹࡾͭ(?) ▸ 1. αʔό্ͷ apple-app-site-

    association ϑΝΠϧͱ App Clip ϓϩ δΣΫτͷ Associated domain ʹઃఆΛ ௥Ճ ▸ 2. App Store Connect ͔Β App Clip Card ͷઃఆΛ௥Ճ ▸ 3. Webϖʔδͷ Smart App Banner ʹ App Clip ͷઃఆΛ௥Ճ͢Δ
  19. ςΩετ 1.αʔόͱ APP CLIP ϓϩδΣΫτͷઃఆ ▸ αʔόଆͰ͸ apple-app-site- association ϑΝΠϧʹ

    App Clip ͷ ઃఆΛ௥Ճ͢Δ ▸ App Clip ଆͰ͸ Associated domains ʹυϝΠϯΛ௥Ճ͠ ▸ ىಈ࣌ʹड͚औΔ NSUserActivity ΛϋϯυϧͰ͖ΔΑ͏࣮૷͢Δ
  20. ςΩετ 1.αʔόͱ APP CLIP ϓϩδΣΫτͷઃఆ ▸ αʔόଆͰ͸ apple-app-site- association ϑΝΠϧʹ

    App Clip ͷ ઃఆΛ௥Ճ͢Δ ▸ App Clip ଆͰ͸ Associated domains ʹυϝΠϯΛ௥Ճ͠ ▸ ىಈ࣌ʹड͚औΔ NSUserActivity ΛϋϯυϧͰ͖ΔΑ͏࣮૷͢Δ
  21. ςΩετ 1.αʔόͱ APP CLIP ϓϩδΣΫτͷઃఆ ▸ αʔόଆͰ͸ apple-app-site- association ϑΝΠϧʹ

    App Clip ͷ ઃఆΛ௥Ճ͢Δ ▸ App Clip ଆͰ͸ Associated domains ʹυϝΠϯΛ௥Ճ ▸ ىಈ࣌ʹड͚औΔ NSUserActivity ΛϋϯυϧͰ͖ΔΑ͏࣮૷͢Δ
  22. ςΩετ 1.αʔόͱ APP CLIP ϓϩδΣΫτͷઃఆ ▸ αʔόଆͰ͸ apple-app-site- association ϑΝΠϧʹ

    App Clip ͷ ઃఆΛ௥Ճ͢Δ ▸ App Clip ଆͰ͸ Associated domains ʹυϝΠϯΛ௥Ճ͠ ▸ ىಈ࣌ʹड͚औΔ NSUserActivity ΛϋϯυϧͰ͖ΔΑ͏࣮૷͢Δ
  23. ςΩετ 2. APP STORE CONNECT Ͱͷઃఆ ▸ App Store Connect

    Ͱ͸ App Clip Card ͷ ઃఆΛߦ͏ ▸ App Clip ؚ͕·ΕͨΞϓϦ͕ App Store Connect ʹΞοϓϩʔυ͞ΕΔͱ App Clip ηΫγϣϯ͕௥Ճ͞ΕΔ ▸ App Clip ηΫγϣϯ͔ΒλΠτϧɺαϒλ ΠτϧɺϔομʔɺΞΫγϣϯͷઃఆΛߦ ͏͜ͱ͕Մೳ ▸ Advanced App Clip Experience ͷ߲໨͔Β ۩ମతͳ URL ͳͲΛઃఆ͢Δ͜ͱ΋Մೳ
  24. ςΩετ 2. APP STORE CONNECT Ͱͷઃఆ(ߴ౓ͳઃఆ) ▸ NFC λάͳͲͰར༻͍ͨ͠ URL

    Λ App Clip Experience ͱͯ͜͜͠Ͱ ొ࿥͓ͯ͘͠ ▸ URL ͸Ұ͚ͭͩͰͳ͘ఏڙ͍ͨ͠ମ ݧʹ߹Θͤͯෳ਺ొ࿥Մೳ ▸ App Clip ͷ URL ͸લํҰகͰϚο ν͢ΔͨΊύϥϝʔλ͝ͱʹ URL Λઃఆ͢Δඞཁ͸ͳ͍
  25. ςΩετ 2. APP STORE CONNECT Ͱͷઃఆ(ߴ౓ͳઃఆ) ▸ ࣍ͷϖʔδͰ͸ App Clip

    Card Λઃ ఆ͢Δ͜ͱ͕Ͱ͖Δ ▸ ಛఆͷମݧʹ߹Θͤͨݟͨ໨ʹ App Clip Card ΛΧελϚΠζ͠· ͠ΐ͏
  26. ςΩετ SMART APP BANNER ͷઃఆ ▸ Smart App Banner ʹ

    App Clip ͷઃఆΛ௥Ճ͢Δͱ Banner ͔Β App Clip ͕ىಈͰ͖ͨΓ ▸ iMessage Ͱ͜ͷ URL ͕γΣΞ͞Ε͍ͨ͞ʹ௚઀ App Clip Λ։͘Α͏ʹ ͳͬͨΓ͢Δ ▸ apple-itunes-app λάͷதʹ app-clip-bundle-id content Λࢦఆ͢Δ͜ ͱͰઃఆ͕Մೳ ▸ iOS 14 ΑΓ΋ݹ͍ΞϓϦͷ৔߹͸ͦΕ·Ͱͱಉ͡Α͏ʹΞϓϦ΁ͷϦϯ Ϋͱͯ͠ػೳ͢Δ
  27. ςΩετ APP CLIP CARD ΛΧελϚΠζ͢Δ ▸ App Clip Card ͸

    App Store ͷ঎඼ දࣔϖʔδͷΑ͏ͳ΋ͷ ▸ ͲΜͳ͜ͱ͕Ͱ͖Δͷ͔Ξϐʔϧ ͠ɺͳͥ࢖͏΂͖͔Λ఻͑Δ৔ॴ ▸ App Clip Card ͸جຊతʹಉ͡ܗͩ ͕ɺ͍͔ͭ͘ΧελϚΠζͰ͖Δͱ ͜Ζ͕͋Δ
  28. ςΩετ 0. σβΠϯͷ੍ݶ ▸ App Clip Card ʹ͸͍͔ͭ͘σβΠ ϯͷ੍ݶ͕͋Δ ▸

    Title ͸ 18 จࣈҎ಺ɺSubtitle ͸ɹ 43 จࣈ͍ͳ͍ʹೲΊΔ ▸ App Clip Card ͸ 3000px X 2000px ͷΞεϖΫτൺ 3:2 ▸ എܠͷಁա͸͠ͳ͍
  29. ςΩετ 1. TITLE ▸ Title ͸ App Clip ͕ԿͰ͋Δ͔Λ఻ ͑Δ΋ͷ

    ▸ ΄ͱΜͲͷ৔߹ʹΞϓϦ΍αʔϏε ͱಉ໊͡લʹͳΔ ▸ Ұͭͷػೳʹয఺Λ౰͍ͯͯΔ৔߹ ͸ͦͷػೳΛλΠτϧʹؚΊΔͷ΋ OK
  30. ςΩετ 2. SUBTITLE ▸ Title ͕ App Clip ͷϒϥϯυͳΒɺ Subtitle

    ͸ App Clip ͷઆ໌ͷ৔ॴ ▸ Ϣʔβ͕ App Clip Λར༻͢Δ࣌͸ େ఍ɺॳΊͯͦͷ App Λར༻͢Δ ࣌ ▸ ॳΊͯར༻͢Δਓ͕ͲΜͳ App Clip ͳͷ͔ཧղͰ͖ΔΑ͏ͳઆ໌Λ ೖΕΔ
  31. ςΩετ 3. HEADER IMAGE ▸ ϔομʔը૾͸ App Clip ͕ͲΜͳ ͜ͱ͕Ͱ͖Δͷ͔Λࢹ֮తʹ఻͑Δ

    ৔ॴ ▸ App Clip ͕ίʔώʔγϣοϓͳͲ ෺ཧతͳ΋ͷʹ෇ଐ͍ͯ͠Δ৔߹͸ ళฮͷࣸਅͳͲ͕ྑ͍ࣸਅ
  32. ςΩετ 4. ACTION ▸ ӈଆʹ͋ΔϘλϯΛԡ͢ࣄͰ App Clip Λ࣮ࡍʹར༻͢Δ͜ͱ͕Ͱ͖Δ ▸ Ϙλϯʹදࣔ͢Δจࣈ͸։͘

    (Open), ݟΔ(View), ࠶ੜ(Play) ͷ3 छྨ͔Βબ΂Δ ▸ σϑΥϧτͰ͸ ։͘(Open)
  33. ςΩετ APP CLIP Λγϯϓϧʹอͭ ▸ ༏Εͨ App Clip ͸γϯϓϧͰ͋Δ ▸

    App Clip ͸ҰͭͷλεΫʹϑΥʔ Χε͠ୡ੒͢ΔͨΊʹ࡞ΒΕ͍ͯΔ ▸ ·ͨ༏Εͨ App Clip ͸ߴ଎Ͱɺಡ ΈࠐΈ΍ىಈ͕଎͍͚ͩͰͳ͘ɺλ εΫͷୡ੒·ͰͷྲྀΕ΋ૣ͘͜ͳͤ ΔΑ͏ʹ߹ཧԽ͞Ε͍ͯΔ΂͖
  34. ςΩετ APP CLIP Λγϯϓϧʹอͭ ▸ App Clip ΛγϯϓϧʹอͭͨΊʹ ҎԼͷࡾͭͷ͜ͱΛߟ͑Δ ▸

    1. App Clip ͷ໨త ▸ 2. λεΫΛୡ੒͢ΔͨΊͷඞཁ࠷௿ ݶͷϑϩʔ ▸ 3. App ຊମΛఏڙ͢Δಋઢ
  35. ςΩετ ࢀরͨ͠ಈը ▸ App Clip ͷ঺հ ▸ https://developer.apple.com/wwdc20/10174 ▸ App

    Clip Λઃఆ͠ɺϦϯΫ͢Δ ▸ https://developer.apple.com/wwdc20/10146 ▸ ༏Εͨ App Clip ΛσβΠϯ͢Δ ▸ https://developer.apple.com/wwdc20/10172