ITエンジニア/デザイナ向けにオープンソースを毎日紹介

ハードウェア - Webカムの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2018/06/16

jeelizFaceFilter - Webカメラで使える顔認識&トラッキング

Webカメラやスマートフォンのカメラはリアルとデジタルの入り口です。そのため、写し出された映像を加工したり、そこにある情報を解析する類のソフトウェアはとても人気があります。スマートフォンアプリにある、動画チャットしながらリアルタイムに情報を付与する、それと同じことがWeb上でできるのがjeelizFaceFilterで...

List

  • 2018/06/10

FacePause - 顔を認識してYouTubeの再生/停止を制御

Webの進化が止まらないのと同様に、Webブラウザ自身もどんどん進化しています。新しく出てくるAPIを実装し、それらが徐々にWeb標準として使えるようになっていきます。こうしたAPIは広まらない可能性もありますが、試してみる価値は十分あります。今回はGoogle Chromeに実装されたFaceDetector API...

List

  • 2018/05/15

pico.js - わずか200行の顔認識プログラム

画像の中から抽出される情報として、最も多いのは人の顔ではないでしょうか。セルフィはもちろん、集合写真であったり、友達や家族と撮影した写真には必ず顔が存在します。顔を見つけることで、様々な情報と結びつけられるでしょう。今回紹介するpico.jsは、Webカメラから取り込んで人の顔を認識するコードをわずか200行で実現して...

List

  • 2018/04/26

Matrix Vision - Webカメラの映像をマトリックス風に

マトリックスと言えば黒バックに緑の文字が流れるシーンが有名です。あの文字は実は寿司のメニューだった、なんて話があります。コンソールっぽい雰囲気がデジタルの世界を感じさせるものになっています。そんなマトリックスの世界観をWebカメラを使ってリアルタイムに再現するのがMatrix Visionです。## Matrix Vi...

List

  • 2017/11/15

moziplayer - 動画/Webカメラの映像をアスキーアート化

videoタグを使えばWeb上で動画をそのまま再生するなんて簡単にできます。そんな簡単にできることをただやるだけでは面白くありません。その映像をリアルタイムに加工するのが面白いのです。そこで使ってみたいのがmoziplayerです。動画やWebカメラの映像をテキストアート化します。## moziplayerの使い方変換...

List

  • 2017/11/07

Temporalis - Webカメラの映像をスライスして描画

Webカメラの映像はHTMLからgetUserMediaで取り込むことができます。そのままvideoタグに当てはめたり、一部だけ切り出してCanvasや画像のソースに当てることも可能です。しかし見たまま使っても面白くありません。そこで一例としてTemporalisを紹介します。Webカメラの映像に面白い効果を施してくれ...

List

  • 2017/03/10

Diffy.js - JavaScriptでモーション検知

例えば監視カメラなどで、定常的に流れている情報を常に記録し続けると容量がどんどん大きくなってしまいます。そこで使われるのがモーション検知です。動きがあった時だけ記録するようにすれば容量が削減されます。Webカメラでモーション検知を可能にするのがDiffy.jsです。JavaScriptだけで実現できます。## Diff...

List

  • 2016/09/10

JpegCamera - Webカメラの映像を画像化

最近のノートPCではWebカメラが搭載されるのも当たり前になっています。そしてHTML5ではWebカメラから映像の取り込みが可能です(Safariはできませんが)。しかしなかなか活用事例は多くありません。そこにはWebカメラから取り込んだ映像を画像ファイル化したりするのが面倒という問題があります。そこで使ってみたいのが...

List

  • 2016/08/21

Diff Cam Feed - Webカメラを使ったモーションディレクト&Twitter投稿

Webカメラを使うと手軽にセキュリティカメラを実現できます。大事なのは物体の動きがあった時にちゃんとそれを捉える機能と、その後どこかに通知する機能ではないでしょうか。そんな機能を実現してくれるのがDiff Cam Feedです。Webカメラを使ってモーションディテクションを実現しつつ、スナップショットをTwitterに...

List

  • 2016/08/09

WebGazer.js - WebカメラとJavaScriptによるアイトラッキングシステム

ユーザテストでユーザの視線がどこに移動しているのかチェックするのは必要です。ただし、アイトラッキングシステムを使うのはとても複雑ですし、コストもかかります。手軽にするため、マウスのトラッキングで済ましてしまっているケースもあります。そこで使ってみたいのがWebGazer.jsです。JavaScriptとWebカムを組み...

List

  • 2016/06/07

face to gif - Webカメラを使って簡単にアニメーションGIF作成

アニメーションGIFを作る方法は幾つかありますが、多くの場合は動画を用意して、それを変換して作成します。すでに動画があればいいですが、イチから作成する際にスマートフォンを使ったりするのは面倒です。何よりスマートフォンは高画質なので動画のサイズが大きくなってしまいます。そこで使ってみたいのがface to gifです。W...

List

  • 2015/08/23

kawaii – HTML5/Webカムを使った顔認識

ソフトウェア名については気にしないのが良さそうです。kawaii

List

  • 2014/10/20

Gifshot – Webカム/動画/画像からアニメーションGIF生成

アニメーションGIFは今なお人気です、というかここ数年さらに人気が高まっているのではないでしょうか。動画とは違いプラグインもCPUパワーも殆ど使わずに再生できますし、音がないのが逆に創造性を働かせてくれます。そんなアニメーションGIFを各種リソースから生成してくれるソフトウェアがGifshotです。Yahoo! Inc...

List

  • 2014/06/15

eyeLike - Webカムでアイトラッキング

コンピュータの入力と言えばキーボードとマウスが一般的ですが、この二つが使われるようになってとても久しいです。もっと進化してもおかしくはないはずです。最近では腕輪やLeapMotionなど新しい入力デバイスも増えています。昔からありつつも一般化はあまりしない入力デバイスとしてアイトラッキングがあります。理由としては精度と...

List

  • 2014/04/10

JavaScript OCR demo - クライアントサイドだけで実現するOCR

JavaScriptでOCR!HTML5にはカメラにアクセするAPIが用意されています。それによってWebカメラを使った動画チャットが幾つか作られています。しかしその使い方しかないのでしょうか。もっと面白い使い方が考えられるはずです。Webカメラの映像を動画として捉えるのではなく、撮影した画像として考えるともっと利用で...

List

  • 2013/10/11

レッツトライ!パーツまで認識できる顔認識「Face Tracker」

Face TrackerはJavaScript製のオープンソース・ソフトウェア(MIT License)です。OpenCVで人の顔を認識するデモは多数ありますが、さらに一歩進めて目、口、鼻、輪郭の認識までできてしまうソフトウェアがFace Trackerです。Webカメラをお持ちの方は遊んでみてください。こちらはデモの...

List

  • 2013/10/09

ここまでやるか。ルービックキューブを3Dで解く「cubr」

cubrはPython製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。ルービックキューブは1977年に登場以来、みんなに愛されているおもちゃです。そんなルービックキューブをプログラマーに渡すとどうなるか…それがよく分かるのがcubrです。3D空間にルービックキューブが浮かんでいま...

List

  • 2013/09/28

Webカムジェスチャー認識ライブラリ「gest.js」

gest.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。WebカメラとWebブラウザを使ってどんなことができるでしょうか。単純に映像を取り込んで映し出しても面白いのですが、さらに映像を解析できると面白いサービスが作れそうです。今回はジェスチャー操作を提供するgest.jsを紹...

List

  • 2013/07/14

Webカメラを使って簡単にアニメーションGIF作成「face to gif」

face to gifはHTML5/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。HTML5を使ったデモは色々ありますが、その中で面白いと感じるのはこれまでFlashでしか触れなかったWebカメラの映像を取得できることがあるのではないでしょうか。今回はWebカメラを使ったアニメーショ...