IoTカノジョを作りました。

この記事は、カノジョできないエンジニア Advent Calendar 2015 9日目の記事です。qiita.com

寒い季節になると、時々一人暮らしが寂しくなる時があるものです。
そんな時家に帰ってきて一言声をかけてくれる人がいたら、どんなに暖かいでしょう。

今日はそんな悩みを今流行りのIoTで解決してみました。

用意するもの

• Arduino Uno

どのご家庭にもある一般的なArduino。

• 照度センサ

明るさを測定するセンサー。1個30円。

• LED

とても明るい。

• その他いろいろ

ジャンパー線、ブレッドボード、USBケーブルなど

動かす仕組み

johnny-fiveというフレームワークを使います。
arduinoをjavascriptで動かせるすごいやつです。
あらかじめPC側にNode.jsをインストールしておいてください。

slackにポストする用で slack-node、Botと会話する用で slack-client を導入しました。
部屋が明るくなった＝玄関の電気が点いたと判定して、slackにメッセージをポストします。

回路図

明かりが点いたら

会話もできるよ

ちなみに会話用のスクリプトは数パターン考えるだけで数百行になったので、今回はサンプルだけにしました。
じんこうちのうはむずかしい。

まとめ

• IoTたのしい。
• やっつけコードなので綺麗じゃないところは何卒ご容赦ください。
• 変な話、後悔はしていません。

【SHIROBAKO】りーちゃんの強さと魅力について

この記事は、SHIROBAKOアドベントカレンダー5日目の記事です。www.adventar.org

松亭でこにふぁーさんとくぎみやさんと飲んでいるときに思いついて始まったこの企画、
気づけばたくさんのSHIROBAKOファンの方が集まっていて、書くのも読むのも楽しみに待っていました。
すでに前4日の方々のブログに圧倒されつつも、僕も負けじと精一杯書きたいと思います！

りーちゃんの魅力

SHIROBAKOのキャラクターで誰が好き？って聞かれたらりーちゃんが好きですって答えるのですが、そもそもなんでりーちゃんが好きなんだろう・・・って考えました。
かわいいってのは、もちろんなんですが。（ちなみに、メガネを掛けたりーちゃんはもっとかわいい。7話最高。）

いろいろ考えた結果、りーちゃんの好きな登場シーンが2つあったので、それを紹介したいと思います。

ひとつめは、8話で宮森のお姉さんと東京観光をしている時に言ったセリフ。

「自分ひとりじゃ絶対経験できないことばっかなんで、めちゃくちゃタメになります。頭と心の財産っす！」

この「頭と心の財産」って言葉、すごく好きなんですよね。
りーちゃんの好奇心旺盛な精神がこのセリフに詰まっていると言っても過言ではない、
体験したこと感じたこと全部自分の糧にするぞー！っていう気合を感じます。

ふたつめは、20話のりーちゃんの回想、シナリオライターの舞茸しめじさんに弟子にしてもらおうと食い下がるシーンです。駅の改札で舞茸さんを追いかけるやり取りはこんな感じでした。

舞茸さん「だからもファントムもない！」
りーちゃん「がんばりますマスタング！」「どうかお願いしメッサー！」
舞茸さん「シュミットかよ」

普通の人だったら1回、2回断られて諦めてしまうと思うんです。「やっぱり忙しいよね」「無理言ったら迷惑だよね」って感じで。
そんなことは後回しで、とにかく目の前にあるチャンスに賭けるりーちゃん、めちゃくちゃかっこいい。
舞茸さんもそんな熱意に押されて笑ってしまい、結局折れてしまいました。

もちろん現実だったら前述のように迷惑かもしれませんが・・。
でも、もし自分だったら遠慮しちゃってダメだろなぁって思うと、やっぱり彼女が輝いて見えるのです。

どうしてそんなに前向きなの？

このふたつのシーンからわかるように、りーちゃんはとにかく前向きです。
知らないことを知って誰かの役に立ちたいとか、師匠を見つけてもっと成長したいとか。
ふと、どうしてそんなに前向きなの？って思いました。どうしたらそんなに前向きになれるの？と。

焦りをバネにする力

りーちゃん、ちょっと焦っていたんだと思います。
アニメ業界で働いている先輩と、一方でまだ学生の自分という立場、
「いつかみんなで一緒にアニメーションを作る」という夢から一番遠いのではと不安になりそうな状況です。
13話で公園で宮森と話している時にその焦りを打ち明けるシーンもありました。

「おいちゃん先輩達、アニメの仕事バリバリこなしてて、」
「まだ親のスネ、がぶがぶかじりまくりの自分と全然違うじゃないですか。ちょっと焦ってたんす。」

もしかすると夢が叶わないことに対する焦りや恐怖が、前向きな行動の一番のモチベーションになっているのかもしれません。

「何言ってんスか絵麻先輩。怖いのは脚本家になれないことです！」

そんな焦りの中でも空回らずに前に進むりーちゃんの強さはすごいなと思いました。
焦ったら何からやったらいいか優先順位バラバラになったり、いろんなことに手出したり、迷走してまたさらに焦って・・・と負のループに陥りがちなのですが、りーちゃんはちゃんと自分のなりたい姿、やりたいことを忘れずに、それに向かってとにかく前へ進んでいきます。

「物語が書きたいです。」

さっき挙げた好きなシーンの一つ目に戻ります。
ここで宮森のお姉さんに「夢とか野望ないの？」って聞かれてりーちゃんは「物語が書きたいです。」と答えました。

これが彼女の本音であり原点なんだろうなと思います。
そしてその後の松亭のシーンでは、みんなで叶えたい目標をアツく語る場面もあります。

「ほんとのほんとに、アニメーション同好会のメンバーでアニメ作りましょうね！」
「我々最強メンバーだと思うんす。ポテンシャルは。」

自分のやりたいことの先にみんなの目標があって、みんなの目標のために自分のやりたいことを頑張る。
焦りの中でも遠くにみんなで叶えたいことがあるなら、頑張れる気がします。

りーちゃんだけでなく他の主人公4人もですが、目標までの道のりは楽しいことばかりじゃないという出来事がたくさんありました。
それでも夢を忘れずに頑張り続けるこのチームに惹かれて、僕はSHIROBAKOを好きになったのかもしれません。

来年に向かって、えくそだすっ！

この記事を書きながらSHIROBAKOを全話見直して、また元気をもらいました。
残り少ない今年を駆け抜けて、来年もりーちゃんに負けない勢いで進めるように頑張りたいと思います！

年明け早々に再放送もあるらしいので、これからもSHIROBAKO応援していきたいです。

【年始特別一挙放送】 TOKYO MXにて1/2（土）、3（日）に全24話一挙放送が決定！BSフジでも1/1（金）に9話一挙放送後毎週再放送が開始予定！ 詳細はこちら　https://t.co/OyP5Kdrr7h　#musani めがね

— TVアニメ『SHIROBAKO』公式 (@shirobako_anime) 2015, 12月 2

【arduino】jsでarduino動かしてみた ~Lチカ編~

IoT事始めということでarduinoを買いました。

Arduinoをはじめよう 互換キット UNO R3対応互換ボード 初心者専用実験キット 基本部品セット20 in 1

セールで¥7,200→¥3,780になっててめっちゃお得。
ジャンパー線、ブレッドボード、LED、抵抗、その他各種センサー全部入り。最高。

Arduino IDEの設定

• StandardFirmataを選択

• arduinoとPCをUSB接続して、コンパイル→書き込み。

johnny-fiveのインストール

• node.jsを予めインストールしておく。

• 新規フォルダ作って移動、johnny-fiveをインストール。

npm install johnny-five

johnny-five.io

js書く

• jf_sample.js

var jf = require("johnny-five");
var board = new jf.Board();

board.on("ready", function() {
  (new jf.Led(13)).strobe();
});

• フォルダ構成はこんな感じ

実行

node jf_sample.js 

光る！楽しい！！

【追記: 2015/11/6】
回路図です。めっちょ簡単。

【ラブライブ！】MilkcocoaをつかってまじえんじぇーなWebサービスを作ってみた

MilkcocoaというBaaSを使ってWebサービスを作りました。rinchan.link

どの凛ちゃんが一番まじえんじぇーか総選挙するサイトです。
まじえんじぇー (まじえんじぇー)とは【ピクシブ百科事典】

投票数に制限はありません。好きな凛ちゃんをクリックし放題です。

ドメインは例のごとく、こちらのキャンペーンサイトで取得したもの。www.onamae.com
コンテンツはgithubに置いて、github.io使ってます。

『Milkcocoa』とは

Milkcocoa | リアルタイムアプリ・IoTやるならMilkcocoa
インタラクティブなWebアプリ制作に特化したBaaS（Backend as a Service）です。
フロントエンドにjavascript一行書くだけでサーバを用意せずにデータの保存・取得・更新、安定したリアルタイム通信を実現できちゃいます。めっちゃ便利！
日本発のサービスなので、ドキュメントもわかりやすく充実しています。公式サイトのチュートリアルをやってみるだけでサービスの凄さがわかると思うので、ご興味ある方はぜひ。
あと、途中でわからないことがあったときは開発者コミュニティに質問して助けてもらいました。（中の人のみなさま、その節はありがとうございました。。！
今後iOS・AndroidのSDKもリリース予定とのことで楽しみです。

使ったライブラリとか

masonry.js

masonry.desandro.com
コンテンツをpinterestライクなUIで表示してくれるライブラリです。
ウィンドウサイズの変更にも動的に対応してくれます。

odometer.js

github.hubspot.com
カウンタ部分に使いました。表示する数字をくるくるーっと回転させてアニメーションしてくれます。
ただ数字表示するだけだと見た目味気ないなーと思ってたところにいい感じのライブラリが見つかってよかった。

imgLiquid.js

imgLiquid Jquery Plugin
画像を親要素のサイズに合わせてよしなにリサイズしてくれるライブラリです。
imgフォルダに画像放り込んで読み込むだけで綺麗にリサイズされるので最高。

微妙っぽいこと

・レコードが数千件になってくるとページの読み込みが遅くなる
毎回リロードの度にデータ引っ張ってきてんだからそりゃそうだって感じですが、
何か解決方法がある気がするので、これから改善します。。

やばいっぽいこと

・Milkcocoaと連携しているjsがむき出しなのでやろうと思えばサーバ側にがっつりデータ送って一瞬で総選挙が終わります。（やめて〜〜
（データのpushに関するルールはmilkcocoa側で設定できたはず・・？あとで調べます。）
・自動クリッカーとか仕掛けられたらやばそう。試したことないけど。

これからやりたいこと

・票数ごとに画像順をソート
リアルタイムランキングっぽくしたい。

・一定数票が入ったら画面にアニメーションをカットインさせる
ただポチポチしてもおもしろくないので、50票・100票入ったら画像が一瞬フェードインしてくるとか。

・ユーザが画像をアップロードできるようにする
Milkcocoaに画像もアップロードできるかも・・？そしたら試してみる。

Q&A

これってリアルタイムである必要あるんですか？

ぶっちゃけ全然リアルタイムじゃなくてもいいんですけど、どちらかと言うと今回はデータの入出力がめちゃくちゃ簡単という点でMilkcocoaの利点を発揮できたかなと思います。
でも複数人でサイトに投票していてカウンターが目の前でがんがん上がっていくのを見るのは楽しいです。これはリアルタイムならではだと思います。

凛ちゃん推しなんですか？

一年生のまきりんぱな推しです。にこ先輩も好きです。いつも花陽をディスってくる友達がいるのですが、彼とはよく喧嘩になります。

いよいよ今週土曜から劇場版ラブライブ公開ですね！

めっちゃ楽しみです！！！！！！！！

作ってみて感想

フロントエンド開発はほぼ初めての初心者なのですが、Milkcocoaのおかげでバックエンドの難しいところを考えずにフロント開発に集中することができました。
単純な機能から始めるプロトタイプ開発には本当に向いているBaaSだと思います。

また何かアニメ駆動開発ができるネタが思いついたら作ります〜

参考サイト

qiita.com
app.codegrid.net
www.softel.co.jp
syncer.jp

【ラブライブ！】μ'sメンバーのカラーコードを調べてみた

調べ方

• 画像を用意する

お名前.comコラボの画像を使いました。www.onamae.com

• カラーピッカーで色を取得する

Chromeの拡張機能を使いました。chrome.google.com

色の種類

以下4種です。
A: 瞳の濃いとこ
B: 瞳の濃いとこと薄いとこの真ん中
C: 瞳の薄いとこ
D: 髪色

結果一覧

■こと

	16進数	R	G	B
A	A75A0C	167	90	12
B	F1BB2A	241	187	42
C	FAE09C	250	224	156
D	B69F7F	182	159	127

■ほの

	16進数	R	G	B
A	092D8E	9	45	142
B	3289E3	50	137	227
C	A0E4FA	160	228	250
D	DA822B	218	130	43

■うみ

	16進数	R	G	B
A	652D09	101	45	9
B	CB8129	203	129	41
C	F5D269	245	210	105
D	43487D	67	72	125

■まき

	16進数	R	G	B
A	54259E	84	37	158
B	B571EC	181	113	236
C	E6CBFC	230	203	252
D	D8595A	216	89	90

■りん

	16進数	R	G	B
A	54550A	84	85	10
B	D1D324	209	211	36
C	F3F680	243	246	128
D	F78C51	247	140	81

■ぱな

	16進数	R	G	B
A	412533	65	37	51
B	A36F92	163	111	146
C	E3AED5	227	174	213
D	BC8717	188	135	23

■のぞ

	16進数	R	G	B
A	093A3B	9	58	59
B	1D988C	29	152	140
C	84E9E0	132	233	224
D	675784	103	87	132

■えり

	16進数	R	G	B
A	132FB1	19	47	177
B	9BC9FA	155	201	250
C	E0F2FE	224	242	254
D	F3DC72	243	220	114

■にこ

	16進数	R	G	B
A	800F15	128	15	21
B	DE3846	222	56	70
C	F9A8AF	249	168	175
D	46454B	70	69	75

備考

カラーピックする場所によって微妙に結果が変わるので、あくまで参考としてご使用ください。

暇なんですか？

誕生日。

先週の土曜日に誕生日を迎えました。

去年は転職してガラッと変わった生活の中、正直苦しい時期がたくさんありましたが、
振り返ってみるとなんだかんだで少しずつ前に進めているなぁと思います。

当日はたくさんのメッセージとお祝い、ありがとうございました。

増える日本酒‹‹\(´ω` )/››‹‹\( ´)/››‹‹\( ´ω`)/›

こんなに祝ってもらった誕生日は生まれて初めてでした。楽しかったです。

ということでもうだいぶ日が過ぎてしまったのですが、いつもの作ってみました。（24歳なので24個登録してみた。）
自分の欲しいものを棚卸しするのって楽しいですね。
http://www.amazon.co.jp/registry/wishlist/Q4V6TXVH0XYS

あと今年はプライベートでアプリをたくさん出せるようにがんばります。

今後ともよろしくお願いしますー！

高専の時に使ってた教科書を思い出してみた

この間、エンジニアの友だちがうちの本棚を見て「面白そうな本多いね〜」と言ってくれた。
本と言っても普通の人が見ても興味を示さないような、いわゆる技術書が多いのだけど、そういえばその一部は高専の時に使ってた教科書だったなぁと思い出した。
当時は授業中以外には読んでなかったけど、エンジニアになった今読み返してみると、結構面白かったりする。
僕は「情報工学科」だったので、コンピュータ関係の技術書が主でした。

コンピュータアーキテクチャの基礎

コンピュータアーキテクチャの基礎

高専3年次に使った、コンピュータアーキテクチャの入門書。
レジスタレベルの基本アーキテクチャから始まり、論理回路、演算アーキテクチャ、メモリ管理、最後の方あたりは通信周りの技術も少し説明している。
広く浅くではあるけど、これさえ読めばコンピュータがどうやって動いているのかざっくり理解できる。
知識レベルとしては基本情報技術者試験の午前くらい。
学校卒業してもうすぐ4年経つけど、コンピュータの根底にある基本的な仕組みを知るためには今でも全然使えると思う。

コンパイラ

コンパイラ (情報系教科書シリーズ)

高専4年次に言語処理なんとかという授業で使った。
コンパイラという言葉では知っているけど中身はよくわからないという代物を紐解く。
当時は完全にサッパリだった。今読んでもむむむ・・・って感じ。苦手だったなぁ。。

オペレーティングシステム

オペレーティングシステム (情報処理入門コース 2)

OSの入門書。高専4年次で使用。
そもそもOSとはなんぞや？というところから、プロセスの仕組み、入出力制御、セキュリティ、分散処理などなど。
初版が1992年で、授業で使ってた本が第21刷だった。なんというロングセラー。
それだけコンピュータの普遍的な仕組みを説明している本なんだと思う。

情報理論入門

情報理論入門

高専4年次で使用。
さっきの「オペレーティングシステム」の初版でもかなり前の本だなーと思ってたけど、
これは1969年初版。昭和44年。使ってた時点で第22刷。超ロングセラー。
「情報の本質について簡明にあますところなく記述された、比類なき入門書であり、また情報処理工学に携わる人へのバイブル。」と書かれている通り、コンピュータ以前の「そもそも情報とは。」という部分を数学的に解説している。
この授業でエントロピーという言葉を初めて知った。

半導体のすべて

〈入門ビジュアルテクノロジー〉最新 半導体のすべて

ソフトウェアだけじゃなくてコンピュータそのもの、ハードの基本も理解しましょうということで、半導体の仕組みを勉強した。
イラストが多くて分かりやすい。授業の講師もソニーの半導体部門の人が来てくれて、かなり丁寧に教えてくれた。
今となっては物理的な半導体素子を気にすることなんてそうそうないけど、雑学として知ってても損はないと思う。

通信工学概論

通信工学概論　第2版 (基礎電気・電子工学シリーズ)

高専5年次に使用。
情報通信領域にがっつり特化した入門書。
全部で200ページ弱と他の技術書に比べるとやや薄いものの、情報量、アナログ・デジタル変調、交換システム、通信方式などなど、基本的なことは全部押さえられる。

マスタリングTCP/IP 入門編

マスタリングTCP/IP 入門編 第5版

高専5年次に使用。
ネットワークエンジニアリング入門の決定版。
インターネットの基本からIPアドレスの仕組み、主要ネットワークプロトコルの構造などなど。
ここで勉強したことが社会人になってから一番役に立った知識かもしれない。

学んできたことを思い返してみると、どれも基本に忠実な授業ばかりだったことに気づいた。
流れの早いIT業界と言えども構造の根底にある基本的な知識は陳腐化しにくいし、そういう意味であの頃のシラバスはよく考えられて作られていたんだなー。
あと、学校で学んだことが今も地続きになっているのはかなり幸運なことだなと思った。

今の学生はどんな教科書使ってるんだろう。