AV Foundation × Core MotionでiPhoneを“楽器”にしよう

Transcript

1. AV Foundation × Core Motion で iPhoneの楽器アプリを作ろう iPhoneを“楽器”にしよう 非エンジニアでもできるっ！ 初心者枠


2. ▪Name : 　木下 雄策(30歳・福岡出身) @afroscript10 ▪Career : 　九州大学大学院　宇宙の研究 　2013年 ~　Leverages（Levtech→teratail）

   　2019年 ~　Mecari ▪Work : 　日本発のグローバルテックカンパニーをつくる！ 　　→ Mercari Engineering Gateway ▪Others : 　・Gs'ACADEMY2期生/WebGLスクール3期生 　・Engineering Onboarding Meetup / Swift愛好会 / Kotlin愛好会の運営 　・Like：スノボ、バスケ、宇宙、 Three.js 自己紹介

3. Background なぜつくったか？ ~僕とSwift~

4. Background ・ Swift 愛好会の運営： 　　立ち上げからもう 3 年半くらいやってるな〜

5. Background ・ Swift 愛好会の運営： 　　立ち上げからもう 3 年半くらいやってるな〜 ・ try! Swift

   2019 ： 　　 Organizer に加え、司会までやらせてもらったな〜

6. Background ・ Swift 愛好会の運営： 　　立ち上げからもう 3 年半くらいやってるな〜 ・ try! Swift

   2019 ： 　　 Organizer に加え、司会までやらせてもらったな〜 ・でも僕、実は Swift ほぼ書けないんだけどな〜

7. 「いや、それまずくないか？」

8. と、ようやく思い始めてきた

9. というか、Swift書けたら、 もっとtry! Swiftも楽しいだろうな〜 というのが正直なところ。

10. あと、エンジニアでない僕が談義することで、 Swift愛好会の談義は、 どんなレベルの発表でもいいんですよ！っていうのを 改めて発信していきたい気持ちもある エンジニアじゃなくても発 表していいんだよ！

11. Ideation さて、何つくろう？

12. Ideation ・でも何つくろうかな〜、作りたいものないんだよな〜

13. Ideation ・でも何つくろうかな〜、作りたいものないんだよな〜 ・ Three.js とか WebAudio で 3D や音を扱ったものをつくるのが好きだけどな〜 　→楽器アプリとか？

14. Ideation ・でも何つくろうかな〜、作りたいものないんだよな〜 ・ Three.js とか WebAudio で 3D や音を扱ったものをつくるのが好きだけどな〜 　→楽器アプリとか？

    ・でもすでにいっぱいあるしな〜

15. そうだ！ 「楽器アプリ」じゃなくて、 iPhoneを「楽器」そのものにしよう！

16. ということで作ってみた。

17. Demo

18. (当然&普通だけど) ボタンを押すと音が出る 左右に傾くとビュー ンって 音が出る 上下に降ると スクラッチ音

19. How to develop ※初心者目線での解説になります

20. How to develop 再入門する

21. How to develop: 再入門する ・ GW を使って、まずは 1 冊読んだ ・

    655 ページ。。。。心折れる。。。

22. How to develop: 再入門する ・ GW を使って、まずは 1 冊読んだ ・

    655 ページ。。。。心折れる。。。 ・ iPhone って機能めちゃくちゃ多い！！ 　なので、全部読む必要ないじゃん

23. How to develop: 再入門する ・ GW を使って、まずは 1 冊読んだ ・

    655 ページ。。。。心折れる。。。 ・ iPhone って機能めちゃくちゃ多い！！ 　なので、全部読む必要ないじゃん 　→ Swift の文法だけちゃんと読んで、 　　あとはこんな機能を使えるんだ〜 　　くらいで流し読みすることにした

24. How to develop: 再入門する ・ GW を使って、まずは 1 冊読んだ ・

    655 ページ。。。。心折れる。。。 ・ iPhone って機能めちゃくちゃ多い！！ 　なので、全部読む必要ないじゃん 　→ Swift の文法だけちゃんと読んで、 　　あとはこんな機能を使えるんだ〜 　　くらいで流し読みすることにした

25. How to develop 音を鳴らす

26. How to develop: 音を鳴らす ・ Xcode に音源を取り込む（ドラッグ & ドロップで OK

    ） ・音を扱うフレームワーク「 AV Foundation 」を import ・ AVAudioPlayer のインスタンスを用意 ・音源ファイル再生の下準備 ・音源再生 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

27. How to develop: 音を鳴らす ・ Xcode に音源を取り込む（ドラッグ & ドロップで OK

    ） ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

28. How to develop: 音を鳴らす ・音を扱うフレームワーク「 AV Foundation 」を import ※参考記事：

    https://picolica.com/2017/02/25/swift3-play-sound/

29. How to develop: 音を鳴らす ・ AVAudioPlayer のインスタンスを用意 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

30. How to develop: 音を鳴らす ・音源ファイル再生の下準備はこんな感じ ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

31. How to develop: 音を鳴らす ・音声ファイルのパスを生成 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

32. How to develop: 音を鳴らす ・さっき用意した audioPlayer のインスタンスを生成 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

33. How to develop: 音を鳴らす ・音源をいつでも再生できるように準備 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

34. How to develop: 音を鳴らす ・音源を再生する ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

35. How to develop: 音を鳴らす ・再生開始位置を 0 秒にして、 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

36. How to develop: 音を鳴らす ・再生 ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

37. How to develop: 音を鳴らす ・あとは、 Button 押したときなどで関数呼べば OK ※参考記事： https://picolica.com/2017/02/25/swift3-play-sound/

38. How to develop モーションセンサーを使う

39. How to develop: モーションセンサーを使う ・フレームワーク「 Core Motion 」を import ・モーションマネージャーを作成

    ・モーションセンサーをスタート

40. How to develop: モーションセンサーを使う ・フレームワーク「 Core Motion 」を import ※書籍の通りに書いただけ

41. How to develop: モーションセンサーを使う ・モーションマネージャーを作成 ※書籍の通りに書いただけ

42. How to develop: モーションセンサーを使う ・モーションセンサーをスタート（ここよく分かんない笑。） ※書籍の通りに書いただけ

43. How to develop: モーションセンサーを使う ・ motionAnimation 関数内で、 　音源再生関数を実行する ・回転角速度や加速度が一定数時を 　越えたときに音源再生するようにする

    ・そのラインは何度も調整 ※書籍の通りに書いただけ

44. How to develop: その他のTips ・ボタン素材とかどうすんねん　→　これ便利だった 　 https://www.draw.io/ 　 ・楽器音は？　→　ここからお借りしました 　

    https://maoudamashii.jokersounds.com/core.cgi?page=1&field= 効果音素材 <> 楽器 ・効果音は？　→　ここからお借りしました 　 https://soundeffect-lab.info/sound/anime/

45. コードはこちら↓ http://afroscript.hatenablog.jp/entry/2019/06/26/201453

46. Next Step ・モーション増やしたい ・モーションの on/off できるようにしたい ・ボタンとモーションでそれぞれ好きに音を設定できるようにしたい ・録音して、音重ねられるようにしたい ・パフォーマンスの 1

    つの分野になるとおもしろそうだなー 　→ iPhone 持ってダンスとか？動きに合わせて音がなる的な。

47. ご静聴ありがとうございました 合宿来てね！：）

48. 理想像 （本当はここまでやりたい） ※ビデオ入れる？