部屋の照明を操作するかっこいいWebアプリを作った - MANA-DOT
GW中に上記画像のような見た目と操作感で部屋の証明をコントロールできるWebアプリを作ったので紹介します。 概要 ページを開くと上記アニメgifのような部屋の間取りのUIが表示されます。 青いエリアは照明がOFFのエリア、緑のエリアは照明がONのエリアとなっています。 照明をON/OFFしたいエリアをクリックすると、そこのON/OFFが逆転します。また、全部ONにするボタンと全部OFFにするボタンもあります。 今回部屋のすべての照明をコントロールできましたが、単に照明を操作するボタンを並べるだけだとどのボタンがどこに対応してるのか難しいため、このように部屋の間取りをUIとすることでわかりやすくしてみました。 また、最初はただ地図をクリッカブルにするだけのつもりだったのですが、それだとつまらないので無駄に近未来っぽいかっこいいデザインにしてみました。 Webアプリは自宅内のサーバーで稼働して
Slack上でインタラクティブに倉庫番を遊べるhubot-slack-soukobanを作った - MANA-DOT
Slack 上でリアクションを操作ボタンとして利用して倉庫番を遊べる、 hubot-slack-soukoban を作りました。 その昔、 Hubot-slack で絵文字でアニメーションする8パズルゲームができるbotを作った という記事を書きました。 この記事では、Slackの編集をbotに叩かせまくり、Slack上で動くパズルゲームを作ったことを紹介しました。 しかしこのパズルゲームには謎のコマンド列をタイプしてbotとやり取りしなければ遊べないという弱点がありました。 そこで今回、Slackのリアクション機能で配置されるボタンを操作ボタンとして利用することで、よりプレイヤーが直感的に遊べるゲームをSlack上に実現しました。 soukoban という文字列に反応してbotがランダムに選ばれた倉庫番のマップと、操作するためのリアクションボタンを表示します。 操作法は上記画像のままです
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
tmuxのタブ名を今いるディレクトリのリポジトリ名にする - MANA-DOT