Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Web audio control-webaudio.tokyo

526 views

Published on

Web Audio Controlsの紹介です。
https://github.com/WebMusicDevelopersJP/webaudio-controls

Published in: Technology
  • Be the first to comment

Web audio control-webaudio.tokyo

  1. 1. WebAudio-Controls
  2. 2. HTML5な活動 ● HTML5Experts.jp #55 ● Web Music Developers JP 管理人 Ryoya Kawai google.com/+RyoyaKawai @ryoyakawai 得意技 ● Web Audio/MIDI API ● Polymer (Web Components) ● Web Bluetooth はじめました みでゃっぴー by @g200kg (W3C Unofficial Web MIDI API Mascot) 本日のコードはこちら: https://goo.gl/MEEcrS
  3. 3. 男の子ならワクワクする
  4. 4. つまんで、回せる丸いヤツ!!
  5. 5. スライドさせるヤツ!!
  6. 6. ツマミってカッコイイ! 
  7. 7. ノブは不可欠!
  8. 8. 実装に時間が必要。
  9. 9. ノブ部 by @aike1000さん http://knob.hatenablog.com/
  10. 10. 稀に困るんです。
  11. 11. ▶ 動作、デザイン いろいろ崩れる。
  12. 12. 崩れる原因:スコープがない
  13. 13. Web Components ○ 構成要素技術 ■ Custom Elements ■ HTML Imports ■ Template ■ Shadow DOM HTML, CSS, JavaScriptをセットでスコープ化し、独自のHTML タグにカプセル化する技術の総称
  14. 14. Polymer Web Componentsの煩雑な部分をいい感じにラップして、更に 強力な機能を提供してくれる。
  15. 15. WebAudio-Controls 5分以内にノブ、スライダ、スイッチ、鍵盤を実装が可能な PolymerのElement
  16. 16. またまた、ご冗談を... ということで Live Codingします。 https://github.com/WebMusicDevelopersJP/webaudio-controls
  17. 17. 独自のノブ画像を作りたい場合: WebKnobMan http://www.g200kg.com/en/webknobman/
  18. 18. ご清聴ありがとうございました!

×