WordPressとJavaScriptではじめる 音声コミュニケーション入門 / wb-kyoto-201710

WordBench京都 in 舞鶴 2017/10/21

Alexaはいいぞ

Transcript

1. Wo rd P re s s ͱ J a v a S c r i p t Ͱ ͸ ͡ Ί Δ Ի ੠ ί ϛ ϡ χέ ʔ γ ϣ ϯ ೖ ໳ Wo rd B e n c h ژ ౎ i n ෣ ௽ 2 0 1 7 / 1 0 / 2 1
2. ࠓ ೔ ͷ ࿩ • ҙ֎ͱ؆୯ʹ࡞ΕΔԻ੠UI • WordPressͷίϯςϯπΛԻ੠Ͱ • Node.js + WP APIͰԻ੠ΞϓϦΛ࡞੒͢Δ • Alexa͸͍͍ͧ
3. H i d e t a k a O k a m o t o • Digitalcube Co. Ltd. • WordCamp Kyoto 2017࣮ߦҕһ௕ • React / ASK / WordPress / CloudFormation
4. W h a t i s A m a z o n A l e x a ?
6. https://www.youtube.com/watch?v=bpR7xzr7ipM https://www.youtube.com/watch?v=bpR7xzr7ipM https://www.youtube.com/watch?v=bpR7xzr7ipM
7. A l e x a S k i l l s • Skill = AlexaͰ࢖͑ΔΞϓϦέʔγϣϯ • amazon.comʹܝࡌՄೳ • χϡʔεϦʔμʔ΍ΫΠζetc… • ཁdeveloperΞΧ΢ϯτ https://amimoto-ami.com/amimoto-ninja/ https://www.amazon.com/Daily-New-York-Times/dp/B01MY9B5BB/ https://www.amazon.com/Digitalcube-Inc-Shifter-man/dp/B07572D7N8/
8. https://www.amazon.com/s/ref=nb_sb_noss?url=search-alias%3Dalexa-skills&field-keywords=
9. https://amazon-press.jp/Top-Navi/Press-releases/Presselist/Press-release/amazon/jp/ Devices/2017/Amazon-Alexa-1002/
10. ҙ ֎ ͱ ؆ ୯ ʹ ࡞ Ε Δ Ի ੠ U I
11. A u d i o C a p t u re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h
12. A u d i o C a p t u re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h A l e x a S k i l l s K i t
13. A u d i o C a p t u re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h AW S L a m b d a w e b A P I A l e x a S k i l l s K i t
14. A u d i o C a p t u re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h w e b A P I ͩ ͚ ࡞ Ε ͹ ͍ ͍ A l e x a S k i l l s K i t
15. F l a s h B r i e f i n g S k i l l s ( F e e d ಡ Έ ্ ͛ Ξ ϓ Ϧ )
16. χ ϡ ʔε ΍ Π ϯ λ Ϗ ϡ ʔ ه ࣄ Λ A l e x a ͕ ಡ Έ ্ ͛ ͯ͘Ε Δ Ξ ϓ Ϧ έ ʔ γ ϣ ϯ A Flash Briefing provides a quick overview of news and other content such as comedy, interviews, and lists that a customer discovers and enables in Skills section of the Alexa app https://developer.amazon.com/public/solutions/alexa/alexa-skills-kit/docs/understanding-the- flash-briefing-skill-api F l a s h B r i e f i n g S k i l l s
17. F l a s h B r i e f i n g S k i l l ʹ ඞ ཁ ͳ ΋ ͷ w 1SFBNCMFɹɹɹɹɹɹɹɹ
    ɿલจ
    z'SPN
    999z·ͨ͸
    l*O
    999z
    w /BNFɹɹɹɹɹɹɹɹɹɹ
    ɿ໊લ
    w $POUFOU
    VQEBUF
    GSFRVFODZɿߋ৽ස౓
    )PVSMZ
    
    %BJMZ
    
    8FFLMZ
    ͔ΒબͿ
    w $POUFOU
    UZQFɹɹɹɹɹɹ
    
    ɿίϯςϯπͷܕ
    5FYU
    
    "VEJP
    ͔ΒબͿ
    w $POUFOU
    HFOSFɹɹɹɹɹ
    
    
    ɿΧςΰϦ
    w 63-ɹɹɹɹɹ
    ɹɹɹɹɹ
    
    ɿ'FFEͷ63-
    w 'FFE
    *DPOɹɹɹɹɹɹɹɹ
    ɿQY࢛ํ
18. F l a s h B r i e f i n g S k i l l ର Ԡ ͷ F e e d ( R S S o r J S O N ) <item> <guid>urn:uuid:1335c695-cfb8-4ebb-abbd-80da344efa6b</guid> <title>λΠτϧ</title> <description>هࣄ֓ཁ</description> <link>ݩهࣄURL</link> <pubDate>ߋ৽೔</pubDate> </item>
20. A m a z o n A l e x a ͷ F l a s h B r i e f i n g S k i l l ͸ Wo rd P re s s ͷ R S S ϑΟʔ υ ʹ ର Ԡ ͯ͠ ͍ Δ
21. d e v e l o p e r. a m a z o n . c o m ʹ ϩ άΠ ϯ
22. A l e x a S k i l l s K i t Λ Ϋ Ϧ ο Ϋ
23. S k i l l Ty p e Λ F l a s h B r i e f i n g S k i l l A P I ʹ
24. I n t e r a c t i o n M o d e l ͸ ল ུ Ͱ ͖ Δ
25. ಡ Ή ه ࣄ ͕ ͳ ͍ ৔ ߹ ͷ ϝ ο η ʔ δ Λ ܾ Ί Δ
26. ಡΈ্͛ΔϑΟʔυΛొ࿥͢Δʢෳ਺Մʣ
27. α ϯ ϓϧ ʹ ͭ ͔͑Δ Wo rd P re s s ͷ R S S F e e d w 5IF
    /FX
    :PSL
    5JNFT
    IUUQSTTOZUJNFTDPNTFSWJDFTYNMSTTOZU)PNF1BHFYNM
    w 8JSFE
    IUUQTXXXXJSFEDPNGFFE
28. ςε τ Ϟ ʔ υ Λ Φ ϯ ʹ ͢ Δ
29. h t t p : / / a l e x a . a m a z o n . c o m / Ͱ ςε τΞ ϓ Ϧ Λ ༗ ޮ Խ ͢ Δ
30. h t t p : / / a l e x a . a m a z o n . c o m / Ͱ ςε τΞ ϓ Ϧ Λ ༗ ޮ Խ ͢ Δ
31. e c h o s i m . i o ͳ Β σόΠ ε ͳ ͠Ͱ ΋ ςε τ Մ ೳ
32. J a v a S c r i p t Ͱ ࡞ Δ Ի ੠ Ξ ϓ Ϧ έ ʔ γ ϣ ϯ
33. A u d i o C a p t u re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h
34. A u d i o C a p t u re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h AW S L a m b d a w e b A P I A l e x a S k i l l s K i t
35. J S O N Λ ಡ ΜͰ J S O N Λ ฦ ͢
36. [ ج ຊ ] A l e x a S k i l l ͸ J S O N Λ ड ͚ औ ͬͯ J S O N Λ ฦ ͢ { " v e r s i o n " : " 1 . 0 " , " s e s s i o n " : { } , " c o n t e x t " : { " S y s t e m " : { " d e v i c e " : { } , " a p p l i c a t i o n " : { } , " u s e r " : { } , " a p i E n d p o i n t " : " h t t p s : / / a p i . a m a z o n a l e x a . c o m " } , } , " re q u e s t " : { " t y p e " : " I n t e n t R e q u e s t " , " re q u e s t I d " : " s t r i n g " , " t i m e s t a m p " : " s t r i n g " , " d i a l o g S t a t e " : " s t r i n g " , " l o c a l e " : " s t r i n g " , " i n t e n t " : { } } #getshifter
37. [ ج ຊ ] A l e x a S k i l l ͸ J S O N Λ ड ͚ औ ͬͯ J S O N Λ ฦ ͢ { " v e r s i o n " : " s t r i n g " , " re s p o n s e " : { " o u t p u t S p e e c h " : { " t y p e " : " s t r i n g " , " t e x t " : " s t r i n g " , " s s m l " : " s t r i n g " } , " c a rd " : { " t y p e " : " s t r i n g " , " i m a g e " : { " s m a l l I m a g e U r l " : " s t r i n g " , " l a rg e I m a g e U r l " : " s t r i n g " } … #getshifter
38. S p e e c h S y n t h e s i s M a r k u p L a n g u a g e ( S S M L ) < s p e a k > I w a n t t o t e l l y o u a s e c re t . < a m a z o n : e ff e c t n a m e = " w h i s p e re d " > I a m n o t a re a l h u m a n . < / a m a z o n : e ff e c t > . C a n y o u b e l i e v e i t ? Yo u s a y, < p h o n e m e a l p h a b e t = " i p a " p h = " p ɪ ˈ k ɑ ː n " > p e c a n < / p h o n e m e > . I s a y, < p h o n e m e a l p h a b e t = " i p a " p h = “ ˈ p i . k æ n " > p e c a n < / p h o n e m e > . < s a y - a s i n t e r p re t - a s = " t e l e p h o n e " > 0 1 2 0 - 0 0 0 - 0 0 0 0 < / s a y - a s > < / s p e a k > #getshifter
39. S S M L ͷ Ұ ෦ • amazon:effect : ࿩͠ํΛΧελϚΠζʢݱࡏ͸͞͞΍͖੠ͷΈʣ • audio: srcʹࢦఆͨ͠.mp3ϑΝΠϧͳͲΛ࠶ੜ͢Δ • break: ࢦఆͨ͠ϛϦඵ or ඵؒΛ։͚Δ • emphasis / p / phoneme / say-as / etc …
40. A l e x a S k i l l s K i t S D K f o r N o d e . j s E x a m p l e s • Hello World • RSS / ATOM Feed ͷಡΈ্͛ • ΫΠζήʔϜ • γςΟΨΠυ • etc… https://github.com/alexa/
41. A l e x a S D K Λ ࢖ ͏ ( 1 ) - Π ϯε τ ʔ ϧ $ n p m i n i t - y $ n p m i n s t a l l — s a v e a l e x a - s d k #getshifter
42. A l e x a S D K Λ ࢖ ͏ ' u s e s t r i c t ' ; c o n s t A l e x a = re q u i re ( ' a l e x a - s d k ' ) ; m o d u l e . e x p o r t s . h e l l o = ( e v e n t , c o n t e x t , c a l l b a c k ) = > { c o n s t a l e x a = A l e x a . h a n d l e r ( e v e n t , c o n t e x t , c a l l b a c k ) ; a l e x a . re g i s t e r H a n d l e r s ( h a n d l e r s ) ; a l e x a . e x e c u t e ( ) ; } ; #getshifter
43. A l e x a S D K Λ ࢖ ͏ ' u s e s t r i c t ' ; c o n s t A l e x a = re q u i re ( ' a l e x a - s d k ' ) ; m o d u l e . e x p o r t s . h e l l o = ( e v e n t , c o n t e x t , c a l l b a c k ) = > { c o n s t a l e x a = A l e x a . h a n d l e r ( e v e n t , c o n t e x t , c a l l b a c k ) ; a l e x a . re g i s t e r H a n d l e r s ( h a n d l e r s ) ; a l e x a . e x e c u t e ( ) ; } ; S D K ͷ ಡ Έ ࠐ Έ ϋ ϯ υ ϥ ͷ η ο τΞ οϓ ϋ ϯ υ ϥ ͷ ઃ ఆ ࣮ ߦ #getshifter
44. Πϕ ϯ τϋ ϯ υ ϥ ͸ O b j e c t ܗ ࣜ Ͱ v a r h a n d l e r s = { ' L a u n c h R e q u e s t ' : f u n c t i o n ( ) { t h i s . e m i t ( ' : t e l l ' , ' H e l l o ' ) ; } , } , ' N a m e I n t e n t ' : f u n c t i o n ( ) { c o n s t s l o t s = t h i s . e v e n t . re q u e s t . i n t e n t . s l o t s ; c o n s t n a m e Va l u e = s l o t s . N a m e S l o t . v a l u e ; t h i s . e m i t ( ' : t e l l ' , ` N i c e t o m e e t y o u , $ { n a m e Va l u e } . E n j o y A l e x a w o r l d ! ` ) ; } , } ; I N T E N T ໊ Λ Ω ʔ ʹ ͢ Δ S L O T ͷ ৘ ใ Λ औ ಘ ͢ Δ t h i s . e m i t ʹ Ϩε ϙ ϯε ͳ Ͳ Λ ॻ ͘ #getshifter
45. W P R E S T A P I ͔ Β ͷ ه ࣄ ݕ ࡧ ΍ औ ಘ ΋ Մ ೳ ' G e t N e w s I n t e n t ' : f u n c t i o n ( ) { c o n s t s e l f = t h i s / / A P I ί ʔ ϧ ʢ ϥ Π ϒ ϥ Ϧ Λ ࢖ ͏ ʣ h t t p G e t ( ' h t t p s : / / g e t s h i f t e r. i o / w p - j s o n / w p / v 2 / p o s t s ' , f u n c t i o n ( re s p o n s e ) { / / A P I Ϩε ϙ ϯε Λ Α ͠ ͳ ʹ ੔ ܗ ͢ Δ c o n s t re s p o n s e D a t a = J S O N . p a r s e ( re s p o n s e ) ; c o n s t o u t p u t = re s p o n s e D a t a [ 0 ] . t i t l e . re n d e re d ; / / A l e x a Ͱ ͷ ಡ Έ ্ ͛ Λ ࣮ ߦ ͢ Δ s e l f . re s p o n s e . s p e a k ( o u t p u t ) ; s e l f . e m i t ( ' : re s p o n s e R e a d y ' ) ; } ) } , #getshifter
46. ஌ ͬͯ ͓ ͖ ͨ ͍ A l e x a S k i l l ༻ ޠ • Intent: Alexaʹ࿩͔͚ͨ͠಺༰ͷ෼ྨ݁Ռ • Slot:ɹAlexaʹ࿩͔͚ͨ͠಺༰ͷม਺෦෼
47. A l e x a , ࡢ ೔ ͷ ࡕ ਆ ઓ ͷ ݁ Ռ Λ ڭ ͑ͯ • <໺ٿͷ݁Ռݕࡧ> {೔෇}ͷ{ର৅ήʔϜ}ͷ݁ՌΛڭ͑ͯ • Intentɹɹɹɹɹˠɹ<໺ٿͷ݁Ռݕࡧ> • ೔෇Slotɹɹɹɹˠɹࡢ೔ • ର৅ήʔϜSlotɹˠɹࡕਆઓ http://dev.classmethod.jp/cloud/summary-about-built-in-intent-and-built-in-slot-type/
48. I n t e n t ຖ ʹ h a n d l e r s ͱ ͯ͠ ొ ࿥ ͢ Δ v a r h a n d l e r s = { ' L a u n c h R e q u e s t ' : f u n c t i o n ( ) { t h i s . e m i t ( ' : t e l l ' , ' H e l l o ' ) ; } , } , ' N a m e I n t e n t ' : f u n c t i o n ( ) { c o n s t s l o t s = t h i s . e v e n t . re q u e s t . i n t e n t . s l o t s ; c o n s t n a m e Va l u e = s l o t s . N a m e S l o t . v a l u e ; t h i s . e m i t ( ' : t e l l ' , ` N i c e t o m e e t y o u , $ { n a m e Va l u e } . E n j o y A l e x a w o r l d ! ` ) ; } , } ; I N T E N T ໊ Λ Ω ʔ ʹ ͢ Δ S L O T ͷ ৘ ใ Λ औ ಘ ͢ Δ t h i s . e m i t ʹ Ϩε ϙ ϯε ͳ Ͳ Λ ॻ ͘ #getshifter
49. Ϩε ϙ ϯε ΋ ෳ ਺ छ ྨ ͔ Β બ ΂ Δ ( Ұ ෦ ) • emit(‘:tell’, speech) : Alexa͕{speech}Λ࿩͢ • emit(‘:ask’, ask, again) : {ask}Λ࿩͠ɺฦ౴Λ଴ͪɺ{again}Ͱ࠶౓ฉ͘ • tellWithCard / askWithCard:ɹalexa.amazon.comͰͷදࣔ΋੍ޚ͢Δ • confirmSlot / delegate / saveState / saveStateError / and more..
50. Tr y E x a m p l e s ! • αϯϓϧεΩϧ͸શͯηοτΞοϓΨΠυ෇͖ • εΫγϣ΋͋ΔͷͰӳޠۤखͰ΋҆৺ • ࡞Γ͍ͨεΩϧͷαϯϓϧΛϕʔεʹ ɹσʔλΛॻ͖׵͑ͯ ɹࣗ෼ͷεΩϧʹ͠Α͏ʂ http://bit.ly/2vSAZhB
51. ࣮ ࡍ ʹ A l e x a S k i l l Λ ࡞ ੒ ɾ ެ ։ ͯ͠ Έͯ
52. ࣮ ࡍ ʹ S k i l l Λ ެ ։ ͠ ͨ ྫ h t t p s : / / w w w. a m a z o n . c o m / D i g i t a l c u b e - I n c - S h i f t e r- m a n / #getshifter
53. A l e x a S k i l l ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • ೔ຊޠ͸΋͏ͪΐ͍զຫ
54. A l e x a S k i l l ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • ೔ຊޠ͸΋͏ͪΐ͍զຫ
55. g i t h u b . c o m / a l e x a ͸ ΋ ͬ ͱ ஌ Β Ε Δ ΂ ͖ • ̍̌छྨۙ͘ͷαϯϓϧεΩϧ͕ެ։ࡁΈ • ίʔυʹ͸ίϝϯτͰώϯτ͕͋Δ • ηοτΞοϓΨΠυ෇͖ • ϢχοτςετͳͲ΋ • ΈΜͳελʔ෇͚Α͏ http://bit.ly/2vSAZhB
56. h t t p s : / / g i t h u b . c o m / a l e x a / s k i l l - s a m p l e - n o d e j s - q u i z - g a m e / b l o b / m a s t e r / s rc / i n d e x . j s ʮ͜͜Λॻ͖׵͑Ζʯͱ͍͏ίϝϯτ͕͍͍ͭͯΔ
57. A l e x a S k i l l ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • ೔ຊޠ͸΋͏ͪΐ͍զຫ
58. ӳ ޠ ɾ υ Π π ޠ Ҏ ֎ ͸ Ϩ Ϗϡ ʔ Ͱ ஄ ͔ Ε Δ ( 2 0 1 7 / 1 0 ࣌ ఺ ) Issue with the feed “AMIMOTO News”: What went wrong? All feed content must be presented in a language currently supported by Alexa. The current supported languages are English and German. Note: Please note that the home card and the URL is displaying in Japanese language. What to do next. Please refer to our documentation for more information.
59. ४ උ ͩ ͚ ͯ͠ ਃ ੥ ͸ ͪ ΐ ͬ ͱ զ ຫ https://amazon-press.jp/Top-Navi/Press-releases/Presselist/Press-release/amazon/jp/Devices/2017/Amazon-Alexa-1002/
60. S h i f t e r m a n S k i l l ͸ O S S h t t p s : / / g i t h u b . c o m / g e t s h i f t e r / a l e x a - s h i f t e r m a n #getshifter
61. ա ڈ ͷ εϥ Π υ ΋ ͍ Ζ ͍ Ζ ͋ Γ · ͢ • Serverless FW·ΘΓ: http://bit.ly/2yNmrOF • WordPressͰAlexa: http://bit.ly/2qvOtvg • Testͷ͜ͱͳͲ: http://bit.ly/2xYb8GN
62. https://www.youtube.com/watch?v=bpR7xzr7ipM http://jft2017.jaws-ug.jp/
63. ࠓ ೔ ͷ ࿩ • ҙ֎ͱ؆୯ʹ࡞ΕΔԻ੠UI • WordPressͷίϯςϯπΛԻ੠Ͱ • Node.js + WP APIͰԻ੠ΞϓϦΛ࡞੒͢Δ • Alexa͸͍͍ͧ
64. A l e x a ͸ ͍ ͍ ͧ