不思議な円グラフを描くウェブサービス作ったよ
最近ツイッター界隈で不思議な円グラフを見かけました。こんなやつです。ちょっと調べてみると昨年の報道番組からキャプチャした映像のようです。...
View ArticleHTML5でワードアートするJSライブラリ作った
以前は商店街のチラシや自治会のお知らせなんかでよくワードアートが使われていました。もう最近は目にすることも少なくなりましたが、ワードアートのレトロで独特の雰囲気は見る人をなごませるように思います。そんなわけで、最新のウェブ技術の粋を集めてワードアートを再現するライブラリwordart.jsを作りました。http://aikelab.net/wordart/...
View Article明日また来てください、本物のExcel方眼紙をお見せしますよ
「俺はェスァイ」「SIって?」「お客様のビジネスに最適なソリューションをインテグレートするんだ」「でたっ、富士通っぽいことば!!」「標準機能を組み合わせたパッケージは使いにくいからだよっ!!」ドス、ドス、ドス、バッ「この仕様書を作ったのは誰だあっ!!」「Excelの文書がなにかございましたか」「なぜセルをこんなに細かくした!!計算など必要のない連中がスプレッドシートを使うからだ。馬鹿どもにExcel...
View Articleツクツクホーシにギターとベースとドラムを重ねてみた
もう夏も終わりな感じであれですが。少し前にツクツクホーシのサビの部分がどうのとか鳴き声が「おじいちゃん!」に聞こえるとかちょっと話題になって、じっくり聞いてみたもののよくわかりませんでした。 僕からしてみればあれはどうみてもメロスピのギターリフに聞こえるんですが、言葉で言っても伝わらないと思うのでバッキングを重ねてみました。聞いてください。メンバー紹介 リードギター...
View ArticleWeb MIDI APIを使ってMIDI鍵盤からブラウザコントロール
ウェブブラウザにWeb MIDIAPIが少しずつ実装されてきて、Mac OS XのChrome Canary版だとプラグインなしで普通に使えるくらいになってきました。 Web...
View ArticleWeb Audio APIとWeb MIDI APIでパターンシーケンサー風楽器作った
Web Audio APIとWeb MIDIAPIの応用例として楽器を作ってみました。適当にボタンを押すだけでもそれっぽい曲になるので遊んでみてください。 http://aikelab.net/webrhy/http://github.com/aike/webrhy...
View ArticleRICOH THETA画像を表示するJavaScriptライブラリ作った
絶賛通常営業中。普段からいろいろプログラムは作っているもののこのところ仕事が立て込んでいてブログが全然書けなかったので休み中に棚卸し的に書いていきます。 RICOH...
View Article全天球パノラマ動画を表示するJavaScriptライブラリ作った
複数台のGoProを組み合わせて360度上も下も撮影できる動画カメラが一部で流行りつつあるようです。こんなやつ。http://home360.co.jp/freedom360.htmlhttp://freedom360.us/ 要はRICOH THETAの動画版なんですが、動画ということで機材の価格もだいぶ違うし、複数の動画を合成する作業もまだまだけっこう手間も時間もかかります。...
View Article片手間のJavaScriptでもテストがしたい!
テストしたくないでござる。テストしたくないでござる。いやまあきちんと環境が整ってたらテスト書くのもわりと楽だし、プログラム本体書いているときの安心感が全然違うので、それなりの規模のプログラムを書く時は良いんだけど。でも、2〜3日で書くようなちょっとしたブラウザ側だけのJavaScriptプログラムとか、開発環境がインストールされていないPCでも気軽にテストできないかなあというのが今回のテーマ。...
View Articleブラウザで波紋エフェクト出すやつ作った
最近プレゼンとかでウェブベースのアプリを実演する機会がわりとあったりします。そのときちょっと不便なのは、マウスをどのように操作して、どこでどういう風にクリックしたのかがいまいち伝わりにくいということで。まあしょうがないかと思ってたんですが。...
View ArticleMMDの全天球パノラマ動画を作ってみた
THETAからはじまって最近は動画にいたるまで、このところ全天球パノラマに興味を持っていたところ、先日こんなツイートを見かけました。 GoPro 6台からの映像を合成することで全球映像ができるのであれば、MMDのカメラを6パターンで出力すれば、できるのかな?— なヲタ級flagship - SKB06 (@nawota1105) 2014, 7月 20...
View Article全天球ビューワーPaView.jsの動作環境とパノラマ飛行動画
先日作った全天球ビューワーPaView.jsですが、できるだけ多くのブラウザで表示できるよう調べてみました。クロスブラウザで問題になるところは、マウスイベント、WebGLで動画のテクスチャマッピングしているところ、対応動画フォーマットあたりです。 ■WindowsWindows...
View ArticleWebでポリシンセ作るときのテンプレ作った
もう半年以上前に作ったやつですけどせっかくなので解説。 JavaScriptでプログラミングをやっていると人は誰しもシンセを作りたくなるかと思います。僕も3年くらい前にWeb Audio Synthというのを作りました。...
View ArticleブラウザでVJプログラム書くときのフレームワーク作った
JavaScriptでオーディオとビジュアルの扱い方をおぼえると、人類はみなVJアプリを作るようになります。ぼくの周りの5人くらいの人類はそうでした。...
View ArticleIR録ろうぜ!2
DTMでよく使われるコンボリューションリバーブやアンプシミュレーターは、現実世界の音響的特徴をWAVファイルのかたちに記録したIR(Impulse Response、インパルス応答)を使って周波数特性や残響をシミュレートします。 最近はWeb Audio APIにもコンボルバーがあるので、気軽にIRを使える環境も広がってきたように思います。...
View ArticleRICOH THETAとJavaScriptでハコスコ用コンテンツを作るの巻
ハコスコは、iPhoneさえあればわずか1000円で実現できてしまうヘッドマウントディスプレイです。ただまだ視聴できるコンテンツがそれほど多くありません。 そんなわけで今回はRICOH THETAを使ってハコスコ用のコンテンツを自作してしまおうという企画です。...
View ArticleiPhoneでワウペダルを作ったった
ワウペダルが好きです。ギターのカッティングにかけて遊んでいるとあっというまに時間が過ぎていきます。そんなわけでどこのご家庭にもあるiPhoneとJavaScriptでワウペダルを作ることにしました。こんなやつ。 JavaScriptでiPhoneの加速度センサーとWeb Audio APIを使ったワウペダル作った。...
View ArticleWebGLでかっちょいいシンセできたよー
ちょうど3年前に当時出始めのWeb Audio APIを使ってウェブブラウザで動くシンセを作りました。その後ブラウザのAPIもいろいろと進化したので、それに合わせてバージョンアップをしてみました。 http://aikelab.net/websynthv2/https://github.com/aike/webaudiosynthv2...
View Article超簡単に3DCGできるJavaScriptライブラリ作った
ブラウザでWebGLが使えるようになって3DCGプログラミングはずいぶん身近なものになりました。と書いてるそばから違和感を感じるくらい生のWebGLをJavaScriptで書くのは敷居が高かったりします。できなくはないけど前提となる知識がかなり必要な感じ。...
View ArticleWebページに丸を描く5つの方法
ひまなのでWebで丸を描く方法についていろいろ考えてみました。TMTOWTDI。http://aikelab.net/circle ▪文字<divid="mychar">●</div>#mychar{color: #00f; font-size: 120px; } ▪CSS<divid="mydiv"></div>#mydiv{width:...
View Article