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

bodymovin × Lottie - マルチデバイスに対応した SVG アニメーション・エコシステム

82ed567f8497acfed7f7b464225dd536?s=47 wakamsha
May 27, 2017
Technology
2
660

bodymovin × Lottie - マルチデバイスに対応した SVG アニメーション・エコシステム

2017年5月27日 『初夏の JavaScript 祭 in mixi』にて発表した資料です。

82ed567f8497acfed7f7b464225dd536?s=128

wakamsha

May 27, 2017
Tweet

More Decks by wakamsha

See All by wakamsha
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
0
420
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
0
190
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
6
2.4k
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
4
2.4k
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
1
1.4k
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
9
12k
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
1
370
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
1
6.4k
82ed567f8497acfed7f7b464225dd536?s=48 wakamsha
2
1.4k

Other Decks in Technology

See All in Technology
4e7f712e4bba241f579d3dc0eaf130d4?s=48 mito201
2
110
53850955f15249a1a9dc49df6113e400?s=48 line_developers
PRO
3
370
A64ac825509279a770c13c6fc517f11a?s=48 kawaguti
3
590
332f89cc697355902a817506b6995f2b?s=48 ytaka23
4
710
188f29ae188160423d48acc1f563dd86?s=48 osappy
0
370
7e6a435700dda6cdb22105d601f20892?s=48 picardparis
4
2.7k
380bcd2ab751f5838abd8219df53e5fe?s=48 tomoki10
5
2.9k
9c551bfc52665c832b89e2748e33cf60?s=48 hitomi___kt
1
240
A07bf430b58349d4c0c88dabcd4c21f3?s=48 iam326
0
210
Eeac2f3b51b69b3cd6fb14ed348f0c6e?s=48 flushpot1125
0
100
D65bdfdd4762c763f71d08fd4d9fa511?s=48 sky_joker
1
260
4756285958b3bd553b49ed5ba544ec23?s=48 fasahina
0
200

Featured

See All Featured
245cee81a9c424266e5e401d844ea881?s=48 lara
25
3.2k
Af6a12710770ad9a7cfd08c97efd40d3?s=48 pedronauck
653
120k
96270e4c3e5e9806cf7245475c00b275?s=48 addyosmani
496
110k
A9179349dd2bdc67f377719f56d85656?s=48 garrettdimon
291
110k
027d1ebf66cc039a0bd3b55eeadbe75d?s=48 sachag
269
17k
F716e5f737fcfb03f2cf8d1a184f1dbe?s=48 nonsquared
83
3.6k
B3ace07412a5178ea778e7eec161fc0a?s=48 jcasabona
10
700
Fe6b81005d1553accd6b2a28f6a2bef1?s=48 phodgson
92
4.1k
25c7c18223fb42a4c6ae1c8db6f50f9b?s=48 mojombo
364
63k
282d599b414022eba5096510f675b6e2?s=48 chrislema
231
16k
Ae14cc4491ac334f9cd23f9f93b4305e?s=48 orderedlist
PRO
331
36k
56c4053438af8e8b90d6f53cbb7573be?s=48 jakevdp
777
200k

Transcript

  1. CPEZNPWJO º -PUUJF ϚϧνσόΠεʹରԠͨ͠47(ΞχϝʔγϣϯɾΤίγεςϜ - SVG animation ecosystem supporting multiple

    devices -  /BPLJ:"."%" !XBLBNTIB ॳՆͷ+BWB4DSJQUࡇJONJYJ

  2. - What’s bodymovin ? - - bodymovin ͬͯԿʁ -

  3. - What’s bodymovin ? - "EPCF"GUFS&⒎FDUTͰ੍࡞ͨ͠ΞχϝʔγϣϯσʔλΛ +40/ܗࣜͰॻ͖ग़͢"GUFS&⒎FDUTϓϥάΠϯ

  4. - What’s bodymovin ? - ॻ͖ग़͞Εͨ+40/Λ47(Ξχϝʔγϣϯͱͯ͠࠶ੜͰ͖Δ +BWB4DSJQUϥΠϒϥϦ

  5. - Basic Example - - ಈ͔ͯ͠ΈΑ͏ -

  6. - Basic Example -

  7. - Basic Example -

  8. CPEZNPWJO w "&ͷ֤छϒϨϯυϞʔυʹରԠ w ςΩετσʔλͷϨϯμϦϯάʹ΋ରԠ w 47(͸ϕΫλʔσʔλͳͷͰղ૾౓ʹґଘ͠ͳ͍ w "GUFS&⒎FDUTͷߴ͍දݱྗΛͦͷ··XFCϒϥ΢β্Ͱ දݱͰ͖Δ

  9. 0OFNPSFUIJOHʜ ͔͜͜Β͕ຊ൪ ͔Βͷʜ

  10. - What’s Lottie ? - - Lottie ͱ͸Ұମʁ -

  11. -PUUJF w CPEZNPWJOͰॻ͖ग़͞Εͨ+40/ΛωΠςΟϒΞϓϦέʔ γϣϯͰಈ࡞ͤ͞ΔϓϥάΠϯ w J04"OESPJE3FBDU/BUJWFʹରԠࡁΈ w "JSCOCʹΑΔΦʔϓϯιʔε

  12. None

  13. - Basic Examples - - ಈ͔ͯ͠ΈΑ͏ -

  14. - Basic Examples -

  15. "TBQPJOUPGOPUF w ϏοτϚοϓσʔλؚ͕·Ε͍ͯΔͱਖ਼ৗʹಈ࡞͠ͳ͍ w ίϯϙδγϣϯ͕ωετ͍ͯ͠ΔͱΞχϝʔγϣϯ͕ਖ਼ৗʹ ಈ࡞͠ͳ͍ ˞-PUUJFʹͯ  w ϓϦϩʔμʔ΍ΞΠίϯͱ͍ͬͨখن໛ͳΞχϝʔγϣϯ͕

    ༻్ͱͯ͠ద੾

  16. *OUSPEVDFNZTFMG Զͷ໊લΛݴͬͯΈΖ ࣗݾ঺հ

  17. גࣜձࣾϦΫϧʔτϚʔέςΟϯάύʔτφʔζ XFCϑϩϯτΤϯυΤϯδχΞ ࢁా ௚थ /BPLJ:"."%" *OUSPEVDFNZTFMG !XBLBNTIB

  18. https://tech.recruit-mp.co.jp NET BIZ DIV. TECH BLOG

  19. None

  20. https://tech.recruit-mp.co.jp 3.1 ϒϩά

  21. 5IBOLZPV