１０％の確率でドオーしか表示されないポケモン生成サイトを作った
PokeAPIを使って10%の確率でドオーしか表示されないポケモン生成サイトを作成。
目次
背景
PokeAPI を使ってみた一心から始まり、ポケモンをランダムに 6 匹表示するサイトを考え始めた。
作成中にランダムでポケモンを表示していると、あまりにもドオーが可愛すぎたので一定の確率でドオーしか表示されないポケモン生成サイトにすることにした。
可愛くないですか？？？
目的
- PokeAPI を使ってみる
- Next.js の勉強を軽くしたので、AppRouter を使用して API を叩く
- なんちゃってレスポンシブデザインを実現する
できたもの
poketter(https://poketter.vercel.app/)
感想と考慮したところ
ポケモンSVで内定しているポケモンに絞った
なにかのバグで ランダムでポケモン育成してみようぜ!!! みたいなことが起きたとき、内定しているポケモンだと決めるのが楽かなと思った。
最新の DLC(12 月配信)には対応できていませんが、一個前の DLC には対応できています。
10%でドオーは光る
10%引いたあと更に 10%引くと嬉しくなりますね！！！！
画面デザインとレスポンシブデザイン
画面の色や UI については事前に Figma で設計をしました。
検討当初のボタンがそのまま入っていたりしますが..。
ボタンの色や背景色、カラーコードなどはピカチュウ大先生を連想しながら coolors で見つけて実装しました。
最後に
本当はドオーしか出なかったときにアニメーションをつけようと思ったけど、画面負荷が高くなるとのいい感じのアニメーションが思いつかなかったのでボツになりました。
またなにか思いついたら作ります。
おわり。