企画
以前noteで欲しい服よりも要らない服の情報が自分にとって有益という話を書きました。
今回はじめてWebアプリを作るにあたり、捨てた（売った）服＝「自分にとって有用でない服」の色をカウントするアプリを作ってみます。
服にもいろいろ属性があるので、まずは「色」からチャレンジです。
ベース
こちらのcodepenをパクr使用させていただきました。リスペクト
ライブラリは「jQuery」「jQueryUI」が使われています。
試作品
ベースをもとに以下の修正を加えました。
①ボックスのバリエーションをアルファベットから色に変更
②１ボタンで1と0を行き来する仕様だったところ、カウントアップし続けるよう変更（「嫌い」を累積）
③各ボタンに個別のカウンターを追加
④各ボタンをそれぞれのカラーに変更
⑤ボックスの大きさや文字の大きさを調整
https://codepen.io/taka_xedge/pen/abyVbyp
See the Pen
disliked color by TAKA (@taka_xedge)
on CodePen.
。。。
と、ここまで作って気づきましたが、
買ってない色の服はそもそも捨てないんですよね。。。
これだと、買っていない色のほうが優位ということになってしまう。
（スキルも大概ですが、そもそもがアホすぎました。。。）
ので、継続して修正します。
完成品
試作品をもとに以下の修正を加えました。
①ボタンを２つに増設
②全体的に日本語に変更し、用途が分かるように変更
プレビューがひどい。笑
0.25倍率でお願いします
https://codepen.io/taka_xedge/pen/yLopOEq
See the Pen
その色の服、大体捨ててますがな by TAKA (@taka_xedge)
on CodePen.
Netlifyにも公開してみました。
以下、反省点
・人に使ってもらうならLINEチャットボットとかと組みわせたほうが良さそう
・そもそも情報をストックするようなアプリにしないと役に立たない
・もっとざっくばらんに服の属性を集めれるような仕様を考えないとダメ
・（ちゃんとできてからでいいけど）コードをきれいに
番外編
最近６歳の長女がポケモンにハマっています。（Switchでポケモンスナップしてます）
あまり遊んであげられない日々が続いているので、娘にゲームを作ってあげました。
公開されているpenをマルパクリで写真を差し替えただけなので所要時間は5分もかかりません。
とてもとても喜んでもらえたので、小さなお子様がいらっしゃる方にはオススメです。
（取得するイメージのポケモンのナンバー部分を置き換えるだけでお子様の好きなポケモンに即効変えることができます。）
https://codepen.io/taka_xedge/pen/JjyMbLQ
See the Pen
test(pokemon) by TAKA (@taka_xedge)
on CodePen.
以下を参考にさせていただきました。リスペクト（2回目）
使った時間は番外編のほうが圧倒的に短いです。
人を喜ばせられたのはどっち？と考えると悶々としますね。
↧