フロントエンドだけで機械学習

by Aipa

Slide 1

Slide 1 text

ϑϩϯτΤϯυ ΧϯϑΝϨϯεԭೄ2022 ϑϩϯτΤϯυ͚ͩͰػցֶश @aipacommander 2022/11/19

Slide 2

Slide 2 text

ࣗݾ঺հ • @aipacommanderʢΞΠύʔୂ௕ʣ • ԭೄݝͰ࠺ͱࢠڙ2ਓͱݘ2ඖͱೣ1ඖͰੜ׆ • CBCloudגࣜձࣾͰۈ຿͢ΔϑϩϯτΤϯυΤϯδχΞʢݞॻʣ • ೖࣾͯ͠ಡΈॻ͖ͨ͠ݴޠ͸DartʢFlutterʣɺScalaɺRubyɺGASɺPython… • ϑϩϯτΤϯυΤϯδχΞɾɾɾɾʁ • ໿3ϲ݄લ͸ɺͪΎΒσʔλʹ͍·ͨ͠

Slide 3

Slide 3 text

͓΍ɾɾɾʁ

Slide 4

Slide 4 text

લ৬ vs ݱ৬ ʢ͜ͷεϥΠυ͸ൃදޙʹരൃͯ͠ফ͑·͢ʣ

Slide 5

Slide 5 text

ຊ೔࿩͢͜ͱ

Slide 6

Slide 6 text

https://www.tensor fl ow.org/js

Slide 7

Slide 7 text

TensorFlow.jsͱ͸ • ϒϥ΢βʢJavaScriptʣͰσΟʔϓϥʔχϯάͰ͖Δ͍͢͝΍ͭ • Tensor fl owʢPythonʣΛ஌ͬͯͨΒॻ͚ͦ͏ͳงғؾͷ͍͢͝΍ͭ • Ұੲલ͸deeplearn.jsͱݺ͹Εͯͨॏ͍΍ͭʢ๻ͷओ؍ʣͩͬͨ • 2022೥ݱࡏ͸౰࣌ͱൺ΂ͨΒര଎ʹͳ͍ͬͯΔ͍͢͝΍ͭ

Slide 8

Slide 8 text

Ͱ͖Δ͜ͱʢGoogleͷϒϩάΑΓʣ • ͜Ε·Ͱग़͖ͯͨϞσϧ͸͍͍ͩͩΠέΔʢงғؾʣ • BodyPixʢGoogle meetʹ͋Δഎܠ΅͔͠ʣ • BERTΛ࢖ͬͨChrome Pluginʢϖʔδ಺ݕࡧػೳʹ࣭໰Λॻ͘ͱɺ ֘౰ʢճ౴ͱ༧ଌ͞Εͨʣจষ͕ϋΠϥΠτ͞ΕΔʣ

Slide 9

Slide 9 text

͠Ύ͍͝ʢ͍͢͝ʣ

Slide 10

Slide 10 text

ʢվΊͯʣ ຊ೔࿩͢͜ͱ

Slide 11

Slide 11 text

ຊ೔࿩͢͜ͱ •؆୯ͳνϡʔτϦΞϧ • ม਎σϞ → ແཧͰͨ࣍͠ճ • ήʔϜͱউෛ͢ΔσϞ → ࡢ೔׬੒ͤ͞Δ༧ఆ͕ͩͬͨಥવ໺ੜͷҿΈձ͕(ry       ※Nuxt3ͷઆ໌͸͠ͳ͍Ͱ͕͢ɺσϞ͸Nuxt3্Ͱಈ͍͍ͯ·͢

Slide 12

Slide 12 text

؆୯ͳνϡʔτϦΞϧ

Slide 13

Slide 13 text

༻ҙ͢Δ΋ͷ https://avinton.com/blog/2018/03/single-shot-multibox-detector-explained1/

Slide 14

Slide 14 text

TensorFlow Hub https://t fh ub.dev/tensor fl ow/ssd_mobilenet_v2/2

Slide 15

Slide 15 text

εςοϓ 1. TensorFlow.jsͷΠϯετʔϧ 2. WebΧϝϥ͔ΒಈըͷऔಘˠCanvas΁දࣔ 3. ϞσϧͷηοτΞοϓ 4. Ϟσϧʹೖྗ͢Δ 5. Ϟσϧͷग़ྗΛՃ޻͢Δ 6. ݁Ռදࣔ

Slide 16

Slide 16 text

ᶃScriptλάɾnpmɾyarnͰΠϯετʔϧ https://www.tensor fl ow.org/js/tutorials/setup?hl=ja

Slide 17

Slide 17 text

ᶄಈըʢը૾ʣΛೖྗ͢Δ४උ̍

Slide 18

Slide 18 text

ᶄಈըʢը૾ʣΛೖྗ͢Δ४උ̎

Slide 19

Slide 19 text

ᶅϞσϧͷηοτΞοϓ

Slide 20

Slide 20 text

ᶆϞσϧʹΧϝϥ͔Βͷσʔλʢը૾ʣΛ ೖྗ͢Δ̍

Slide 21

Slide 21 text

ᶆϞσϧʹΧϝϥ͔Βͷσʔλʢը૾ʣΛ ೖྗ͢Δ̎

Slide 22

Slide 22 text

ᶆϞσϧʹΧϝϥ͔Βͷσʔλʢը૾ʣΛ ೖྗ͢Δ̏

Slide 23

Slide 23 text

ᶆϞσϧʹΧϝϥ͔Βͷσʔλʢը૾ʣΛ ೖྗ͢Δ̐ 1൪໨͸ϥϕϧ(ཁૉ൪߸)ͱ ༧ଌ֬཰ʢ1ʹ͍ۙ΄Ͳࣗ৴͕͋Δʣ ̎൪໨͸bounding boxͷҐஔ [y, x, yͷେ͖͞, xͷେ͖͞]

Slide 24

Slide 24 text

ิ଍ https://avinton.com/blog/2018/03/single-shot-multibox-detector-explained1/ ̎൪໨͸bounding boxͷҐஔ [y, x, ॎͷαΠζ, ԣͷαΠζ] : [0, 0] 9 [y, x] ԣͷαΠζ ॎͷαΠζ [ ॎͷαΠζ - y, ԣͷαΠζ - x ]

Slide 25

Slide 25 text

ᶇϞσϧͷग़ྗΛՃ޻͢Δˠᶈ݁Ռදࣔ

Slide 26

Slide 26 text

σϞ

Slide 27

Slide 27 text

ͳͥͳͷ͔ ʘiϑΟʔϧυ!!ʗ • ݕग़݁Ռશ෦දࣔ͢Δͱ͜͏ͳΔ • ϑΟϧλͷςΫχοΫʢSSDͷجຊͷ࿩ʣ • ༧ଌ֬཰ʢ৴པ౓ʣͰߴ͍ॱʹιʔτͯ͠ϑΟϧλ • Intersection over UnionʢIoUʣͰϑΟϧλ • 2ͭͷbounding box͔ΒείΞΛܭࢉ͢Δ • bounding box͕׬શʹॏͳ͍ͬͯͨΒ1ʹͳΔ • ͋ΘͤͯɺNonmaximum suppressionʢNMSʣͰ   ॏͳ͍ͬͯͯ׌ͭɺIoU͕খ͍͞bounding boxΛ࡟আ

Slide 28

Slide 28 text

ͳΜͱ࣮૷͞Ε͍ͯΔ

Slide 29

Slide 29 text

࠶ͼσϞ

Slide 30

Slide 30 text

·ͱΊ

Slide 31

Slide 31 text

·ͱΊ • ϒϥ΢βʢJavaScriptʣͰσΟʔϓϥʔχϯά͸Ͱ͖Δ • ࠓ೔͸঺հͰ͖ͳ͔ͬͨͰ͕͢ɺ͍ΖΜͳ͜ͱ͕Ͱ͖Δ • ϒϥ΢βͰֶश΋Ͱ͖ΔɺసҠֶश΋͍͚Δ • όοΫΤϯυʹWASM͕༻ҙ͞Ε͍ͯΔͨΊɺΑΓϙʔλϒϧʹ ʢNode.js͕ಈ͘αʔόͰ΋ಈ࡞͢Δʣ