refluster's blog

スマホで触れる水

2017-09-23T13:26:00.000+09:00

水を触る体験をWebアプリで実現してみました。
http://lab.schememono.net/code/js/062/

3種類のプリセットを用意しています。個別にスライダを調整して、重力の強さや、水の量、背景画像などを切り替え可能です。

過去に実装した粒子シミュレーションのアプリに対し、水の表現と、フリック（ドラッグ）で動かす機能を追加しました。

水の表現は、具体的には、光の反射、屈折をシミュレーションしています。Javascriptでは処理量過多でコマ落ちするため、反射・屈折処理はWebGLを利用しています。

クリスマスツリーのイルミネーション開発

2016-12-27T23:04:00.000+09:00

先週末にraspberry piでクリスマスイルミネーションを作りました。Unkaiのプラットフォームを活用して、合計0.2人日程度で仕上がりました。資産はこうやって活用しないとですね。

Unkaiのプラットフォームはこちら
http://refluster.blogspot.jp/2015/07/unkai.html

twitterのデータでbotを作ってみた

2016-11-23T21:03:00.000+09:00

twitterのデータを使ってbotを作ってみました。大量の学習データを短期間で集めやすく、マシンラーニングの初学者としては良い題材ではないかと思います。

tensorflowに付属の翻訳のサンプルコード（seq2seq_model）を用いて、学習データを「英語→フランス語」から「tweet → リプライtweet」に置き換えると実現できます。日本語を使ったので、形態素解析も必要になります。学習リソースを有効に活用するため、前処理として絵文字、句読点、タグなどは除去しました。

語彙数を1.5万とし、RNNを3層にスタックして学習しました。awsのt2.large（このときメモリ8GB）を用いたところ、メモリ不足で2万語の学習は不可能でした。

ソースコードを下記に置いております。

https://github.com/refluster/jupyter/tree/master/003.simple_bot

技術的な理解は、下記資料が参考になります。

http://www.slideshare.net/tak9029/tensorflowai

学習の仕組み

学習開始から2時間経過

1日経過

4日経過

1週間経過

手書き数字認識アプリ

2016-03-30T13:25:00.000+09:00

ディープラーニングを使ったサンプルアプリを作りました。
http://lab.schememono.net/code/js/057/

使い方：スマホで上記URLを開き、枠内に1個の数字を書くだけです。

書いた数字が0～9のいずれの確立が高いか、各々の結果が示されます。学習アルゴリズムの違いを見るために、簡単なsimpleと、少し高度なconvolutionの2種類表示します。

手っ取り早いため、学習データが揃いやすい数字を扱いました。学習の構造は数字に特化してないため、物体認識など応用はやりやすいです。

工夫した点は、tensorflowのチュートリアルを参考に予測部分を改良したのと、Webアプリ化してUIを設置したことです。

VRコンテンツもDIY

2015-11-21T23:56:00.000+09:00

VRのコンテンツのサンプルを作ってみました。とりあえず以前作った魚を泳がせてます。
http://lab.schememono.net/code/js/051/

スマートフォンで表示させて、専用ゴーグルでVR体験できます。専用ゴーグルの過去記事はこちら。
http://refluster.blogspot.jp/2015/11/vrdiy.html

3D fish

2015-11-15T21:09:00.000+09:00

魚と一緒に遊泳する様子を描いてみました。ダイビング時の光景になってますかね。そもそも魚と分かりにくいですが。。
リロードすると魚の位置や色が変わります。
http://lab.schememono.net/code/js/049/

VRゴーグルDIY

2015-11-14T23:03:00.000+09:00

VRを体験するデバイスをDIYしてみました。ダンボール機でも全然問題無く楽しめることが分かりました。製作費200円、ダイソーは偉大です。
中身はレンズとダンボールだと分かるように、組立から動画に入れてみました。けれども、動画ではVRの体験を伝えられないのが残念です。
googleの g.co/cardboard を参考にしました。が、レンズの焦点距離の違いにより、焦点合わせの作業が苦労したポイントとなりました。

[Web アプリ] ダイビングの光景

2015-11-01T23:13:00.000+09:00

友人のアドバイスをもらい、魚と一緒に遊泳する様子を描いてみました。ダイビング時の光景になってますかね。そもそも魚と分かりにくいですが。。リロードすると魚の位置や色が変わります。

http://lab.schememono.net/code/js/049/

Bracketed OL-systems

2015-09-27T13:20:00.000+09:00

アルゴリズムで木などを生成するwebアプリを作ってみました。
http://lab.schememono.net/code/js/047/

アルゴリズムの名称は Bracketed OL-systems と呼ばれます。数式をちょっと変えるだけで色々遊べて、結構おもしろいです。

Bracketed OL-systems:
http://algorithmicbotany.org/papers/abop/abop.pdf
1.6.3 節

jsで3Dフラクタル

2015-09-12T14:10:00.000+09:00

フラクタルを作ってみました。テキトーに作ればそれなりに綺麗になるかと思ってたけど、そうでもなく。

http://lab.schememono.net/code/js/046/

いくつかパラメタを変更できるようにしてみました。ただ、動作がモッサリしていくので、そのときはリロードしてください。(たぶんメモリリーク。。)

フラクタル：ある形状の相似形を再帰的に生成したもの

写真管理サーバ + デモアプリ

2015-08-29T21:58:00.000+09:00

夏休み中に作っていた写真管理サーバとWebアプリを一通り作り込みました。デジカメで撮った写真を、スマホ操作で保存・閲覧します。

せっかくなので、操作の流れを撮影してみました。なんやかんやで全11テイクかかりました。

Raspberry Pi 2 を買いました

2015-08-23T22:34:00.005+09:00

ラズパイ2を買いました。せっかくなので、開発環境も立ち上げました。Macが壊れた場合の繋ぎ役ができた。

左が旧機種、右がraspberry pi 2。

USBのWifiの調子がとても良い。旧機種はUSBの共有電力が不足してたのだろうか (2で電力upしている)。

写真管理サーバ開発中

2015-08-14T21:35:00.000+09:00

写真の取り込み、サムネイル作成、DB登録まで自動化しました。しかし、元々の予定に全然達していない。。

この2日間でやったこと
- RPiに外付けHDD認識確認
　→電流不足で使えず、代替案検討中
- 写真ビューアを作成(AngularJS)
- 写真サムネイル自動生成(ImageMagick)
- データベース登録(sqlite3/node-sqlite3)
- nginx + fastcgiのテスト
　http://qiita.com/jey0taka/items/b961110a95d6edc2d870
　→面倒なのでnodeに変更
- nodejsでcgiクエリ取得
　http://stackoverflow.com/questions/6912584/how-to-get-get-query-string-variables-in-express-js-on-node-js

ホワイトボードと化した冷蔵庫

写真管理サーバ

2015-08-12T21:48:00.000+09:00

写真管理サーバのスマホのI/Fを作りました。写真保存用の外付けHDDが、電流不足によりRPiで利用できず断念。解決策検討中。。
http://lab.schememono.net/code/js/045/

WebRTCテスト

2015-08-11T12:42:00.000+09:00

WebRTCでビデオ通話アプリを作りました。Mac PC <-> Windows PC で通信させてみました。(iPhoneはブラウザ未対応とのことで断念)
http://lab.schememono.net/code/js/044/

WindowsではUSBカメラ(画面左下のテーブルの上)、Macは標準の付属カメラ(Mac画面の中央上)を使用しています。

左ディスプレイがWindows画面、右がMac画面です。Windows画面には、Windows映像(左)、Mac映像(右)が表示されています。Mac画面には、Mac映像(左)、Windows映像(右)が表示されています。

傘を動している様子が4個の映像で見れますので、Windows - Mac 間で映像が通信されていることが分かります。動画で表れてませんが、音声も通信されていました。分かりにくいデモでごめんなさい。

AngularJS のサンプル作成

2015-08-10T22:36:00.003+09:00

AngularJS とチュートリアルを参考に、todoアプリを作りました。
http://lab.schememono.net/code/js/043/

感想
Webアプリで多用するjavascriptの泥臭い実装をAngularJSが肩代りしてくれています。開発が効率的、コード保守性が良いといったメリットがある印象を受けました。

夏休みの自由研究

2015-08-09T07:32:00.000+09:00

夏休み中の自由研究の計画を決めました（決めたのは昨日）。

material designを少しだけ適用してみた

2015-07-29T08:15:00.001+09:00

material designをコードラボの一部のページに適用してみました。
適用したのはガイドラインのほんの一握りですが、元と比べれば結構印象違うんですね。。
#元々見た目には力を入れてなかったせいもありますが、、

適用後ページ
http://lab.schememono.net/code/
http://lab.schememono.net/code/js/
http://lab.schememono.net/code/unity/

適用前ページ
http://lab.schememono.net/code/index_conv.html
http://lab.schememono.net/code/js/index_conv.html
http://lab.schememono.net/code/unity/index_conv.html

web components サンプル動かしてみた

2015-07-22T23:18:00.001+09:00

web components の勉強用に、polyfills を使ってみました。ほぼサンプルを動かしただけですが。
http://lab.schememono.net/code/js/042/

ソフトウェアを効率的に開発・保守するための思想が、htmlの世界にも展開された感覚です。Web アプリとの相性も良さげ。ただし、未だにシェアの高いIEのサポートが不十分であるところが難点です。モバイル向けに割り切れば、無視できるかも。。

unkaiソフトリリース

2015-07-04T23:54:00.000+09:00

unkai のソースコード 0.1.0 をリリースしました。schememono×Kyoto にて展示した版です。
https://github.com/refluster/unkai/releases/tag/v0.1.0

使用方法を以下にまとめました。
https://github.com/refluster/unkai/wiki

0.1.0 のソフトウェアスタックを以下にまとめました。

schememono×Kyoto

2015-07-04T23:45:00.000+09:00

schememono×Kyotoにて、schememonoの作品数点を展示しました。

私は上記写真のプロダクトのソフトウェア開発を担当しました。LEDやミスト発生の自動調節機能や、モバイル端末でマニュアル制御するためのWebアプリを実装しました。

上記のプロダクトについての詳細情報は以下を参照ください。
https://plus.google.com/+SchememonoNetLab/

schememonoサイト立ち上げ

2015-05-10T23:45:00.000+09:00

schememonoグループのweb siteを立ち上げました。
グループの名称は "Scheme Mono" から "schememono" に変更しました。
https://sites.google.com/site/schememonolab/

Famo.us を試す

2015-02-28T22:22:00.000+09:00

Famo.us を使ってみました。
クリックすると次のスライドを描画します。
http://183.181.8.119/test/js/038/

ソースコード
https://github.com/refluster/test/tree/master/js/038

railsのインストール

2014-10-17T20:26:00.000+09:00

下記コマンド．

# gem install rails

cygwin で次のエラーではまった場合の対処。

ERROR:  While executing gem ... (ArgumentError)
    invalid byte sequence in US-ASCII

エンコードを変更すると治ります。

# export LANG=ja_JP.ShiftJIS
# export LC_ALL=ja_JP.ShiftJIS
# gem install rails

Javascriptで1/fゆらぎ

2014-03-10T07:07:00.000+09:00

「1/fゆらぎ」のシミュレーション
http://183.181.8.119/test/js/031/

ソースコードはこちら。
https://github.com/refluster/test/tree/master/js/031