凹みTips

C++、JavaScript、Unity、ガジェット等の Tips について雑多に書いています。

HTML5

Unity WebGL x WebSocket でみんなで自由にブロックを置いて遊べるブラウザゲームを作ってみた

はじめに Unity WebGL x WebSocket でたくさんのオブジェクトを同期する前回の仕組みを利用して、データの永続化の実験をしてみました。 デモ マイクラもどきです。全員がログアウトしてもデータをサーバに保持しておくようにしました。みなさんのご協力のお…

Unity WebGL x WebSocket で複数クライアント間の大量のオブジェクトを簡単に同期できる仕組みを作ってみた

はじめに まだ実験中なのですが、Unity WebGL x WebSocket で大量のクライアント間で大量のオブジェクトを同期できる仕組みを作っています。UNET や Photon によって近いうちに対応されると思うのですが、現状では使えないのと、制限なく扱えたりチューニン…

Unity 5 の WebGL で WebSocket を利用した通信をする方法について調べてみた

はじめに Unity の WebGL では現状ではネットワーク機能に制約がありますが、WebSocket は使えるようです。 (English) On the future of Web publishing in Unity – Unity Blog 以前の記事では外側の JavaScript で Socket.IO を通じて通信した内容を用いま…

Unity 5 の WebGL で外部からテクスチャを与える方法について調べてみた

はじめに Unity 5 の WebGL 出力で、外部(自分で書いた JavaScript のコード)からテクスチャを与えたいと思い、色々調べてみましたので情報を共有したいと思います。通常の画像をテクスチャとして指定する方法と、base64 エンコードした画像をテクスチャと…

Unity 5 x WebGL について詳しく調べてみた

はじめに 本エントリは Unity Advent Calendar 2014 8日目の記事になります。 Unity 5 からは Build ターゲットに WebGL が追加されます。Unity 5 プリオーダ向けベータ版で現在試すことが出来ます。 Unity 2020.2b - Unity 今年の 3/18 に行われた GDC2014 …

WebRTC でスクリーンキャプチャ(動画)をしてみた

はじめに WebRTC ではカメラからの映像だけでなくスクリーンキャプチャも可能です。イメージとしては Google Hangouts の画面共有のような形です。余り解説を見かけなかったので調べてみましたので紹介します。 デモ https://html5-demos.appspot.com/static…

Chrome の音声認識を Unity で利用してみた

はじめに 前回のエントリ(http://d.hatena.ne.jp/hecomi/20131201/1385907047)にて、Chrome に実装されている Web Speech API を利用した音声認識を Unity 上で利用することについて触れました。本エントリではその内容を紹介します。 概要 Chrome で Web …

結婚式二次会用に Node.js x ブラウザでタイピング対決アプリを作ってみた

はじめに 先月、友人の結婚式の二次会でタイピング対決をしたいとの企画を、幹事の友人から受けました。面白かった要件としては、 二人の顔を 2 台のカメラで映したい タイピングしてる様子をリアルタイムで見たい というものです。これをサーバは Node.js …

Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の伍 -

はじめに 1年間更新していなかったのですが、先日コメントを頂きまして再開しました。ゲーム用 JS ライブラリを使わずに弾幕シューティング作ってみる企画です。今回が最終回で、弾幕シューティングゲーム一番の醍醐味の弾幕を作ってみる回です。 第1回 〜 …

SimSimi API x Web Speech API x OpenJTalk x mmd.gl.enchant.js でブラウザ上で音声対話できるヤツ作った

はじめに SimSimi とは巷で噂の凄いチャットロボットです。 参考: simsimiってアプリが凄すぎてワロタwwwwww : 無題のドキュメント 例 で、この SimSimi さんですが、API を公開しています。 SimSimi API 無料では使用制限があるようで 1ヶ月しか使え…

Web Speech API で遊んでみた

はじめに “Web Speech API”をサポートした「Google Chrome 25」のベータ版が公開 - 窓の杜 2013/01/14 公開の Google Chrome v25.0.1364.29 beta-m から Web Speech API が実装されました。これで JavaScript から音声認識が出来ると言うわけで、ユーザビリ…

mmd.gl.enchant.js を使ってミクさんと音声認識で会話してみた

はじめに 本記事は、東京 Node 学園祭 2012 の LT 枠 - 6番目で発表したデモ内容の紹介になります。スライドは以下になります。(2012/11/25 20:57 貼り間違えたので修正) 構成としては、発表で紹介した Julius の Node.js アドオンから得た音声認識結果を …

Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の肆 -

はじめに Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の壱 - - 凹みTips Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の弐 - - 凹みTips Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の参 - - 凹みTips とやってきて第4回目…

Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の参 -

はじめに 前回、敵を表示したので、今回はプレイヤーを表示して操作するところまで作ります。↓のような感じです。 プレイヤーの表示 こんな画像を用意しました。 まずは今までと同じように、 Player の画像やその他情報を Materials に登録 Player クラスを …

Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の弐 -

はじめに 前回、N-way 弾を発射するところまでやりました。今回は敵を表示するところを書いてみたいと思います。 用意する画像 オリジナルサイズ 拡大 こんな敵の画像を用意しておきます。横方向は時間経過によるアニメーション、縦方向が向きです。 ではこ…

Canvas を使ってみんなもお手軽に弾幕作ろうぜ!! - 其の壱 -

はじめに 勉強がてら Canvas を使ってなにか作りたいなーと思いまして、昔作っていた STG のドット素材を利用して、簡単なマルチタッチ対応 STG を作ってみました。 だんまくてすと 触った指の数だけゆっくりが出てきます。マウスでもプレイ出来ます。死んだ…