今日も今日とて
帰宅すると、放置されたゴミを見つけてしまいました。
あれ？ゴミ捨て、頼んどいたよね？？？
って、何度も言うのも、自分も相手も疲れちゃいますよね。
無言の圧力
無言の圧力ってわかりますか？例を出しましょう。
付き合って３年、彼女の家に行くと、机の上にゼクシィが置いてあった。
分かりやすい無言の圧力ですね。
言葉にはしない、けど強めにこの思いを伝えたい。
そんなことを考えてWebアプリを作ってみました。
こんな感じになりました
使い方動画
QRコードの使い方って色々ありますね。
— そってぃ (@sotan115) November 19, 2023
思いついたものを形にしたら、ちょっと尖ってしまった。#protoout #Webアプリ #夫婦円満 pic.twitter.com/EckaAueEvC
アプリはこちら
使用場面
こんなとき、QRコードをそっと置いておきましょう。
- 夫担当のゴミ出しがされてなかったとき
- お願いしてたのに、放置された洗い物を見つけたとき
- 飲みかけのペットボトルがその辺に転がっていたとき etc...
使ったもの
- CodePen
- Bootstrap
- qrcode
- Local Storage
--以下使用言語-- - HTML
- CSS
- JavaScript
コードはこちら
See the Pen 想いはQRコードで by sotan115 (@sotan115) on CodePen.
補足
Bootstrap
有名なCSSフレームワーク（私は今回初めて知りました）
特徴的なUIで簡単に見栄えをよくすることができる。
今回はタイトル部分やボタン部分に使ってみました。
qrcode
動的にその場でQRコードを生成できる。
今回は文字を入れてQRコード生成する機能を取り入れてみました。
使いようによってはゲーム感覚で楽しめるアプリできそう。便利。
Local Storage
ブラウザの中にデータを保持できる機能の一つ。
こちらを使って、相手にコメントを残しておく機能を追加してみました。
口で言えなければこちらにお返事しておきましょう。
反省点・改善点
- Bootstrapが便利だったものの、上手く使いこなせず。もう少し見やすい配置にしたかった。勉強不足。
- お返事機能にタイムスタンプをつけて、いつのコメントか分かるようにしたかった。
- 生成したQRコードを画像保存したい
- QRコードを読み取ったとき、アプリに飛べるようにしたい
疲れているのだろうか？
前回、Webアプリを学んだときに作ったアプリはこれだった↓
今回も、ちょっと尖ってますね。。
でもこのほうが、口で注意されるより、ちょっとクスッってなりませんか？
（とかいってイラッとするほうが大多数だったらどうしよう・・）
家族に見つかったら怒られそうなアプリになっちゃったけど
使い道はいろいろあると思ってるよ！！！！！！
ポジティブに使っていこうぜ！！！！