ポケモン SV 発売日から一ヶ月以上経過していますがポケモン SV をやっていますか？特にランクマッチ。育成したけどボックスに放置したまま、育成したはずなんだけど全然使えていない、そんなことがあると思います。そのようなことを防止するためにブックマークしやすくかつツイートしたくなる育成ポケモンのメモサイトを開発、リリースしました。
ポケモン育成カードジェネレーター
今回はこちらについて紹介します。
使い方はシンプルです。
上記の URL にアクセスし、フォームを入力して作成するボタンをクリック(タップ)するだけです。
遷移するページに育成情報からカードが作成されます。画像なので保存可能です。そして生成された画像をサイトから直接ツイートすることができます。
生成された画像はそのまま OGP になるので Twitter のタイムライン上で注目されやすくなります。
また、作成したページはブックマークしあとから閲覧することも可能です。URL を控えておくことで育成情報をあとから参照できます。
テラスタイプの設定にも対応しています。
開発中の機能
- 努力値のビジュアライズ化
現在、入力された努力値をもとにグラフ化したイメージを OGP に挿入しようと試みています。
これによって生成された OGP がよりみやすくなる予定です。 - UI の改善
より入力しやすい機構を目指しています。現在、バリデーションが甘かったり入力自体が手間だったりすることがあります。そのためより使い心地がよいシステムに改善しています。
技術的にやっていること
このサイトは Next.js を用いて構成されているのですが、Next.js の API サーバーに OGP 作成用の API を建てて、そのエンドポイントにアクセスされた時の URL のパラメータから動的に DOM を組み立て OGP を生成、返却するようにしています。この時に Next.js の getServerSideProps を通して行っています。
当ブログは Vercel にホスティングしていますが、このジェネレーターサイトもサーバーは Vercel のみで完結しています。
さいごに
もし何か不具合、要望等ありましたらご連絡ください。
また、現在も機能改善、修正を行っている最中です。機能は突然変更され、失われる可能性はあります。