ブラウザ上でボウリングのスコアシートを入力して、画像としてスコアシートをダウンロードできるものを作成しました!
コンセプト
このサイトを作る上で意識したのがこちら
- 入力は手軽に簡単に
- ブログなどに貼るためにも、スコアシートの結果は画像出力
- 簡単に画像として出力できる
というものを実現できるように作成しました
使い方
使い方はかんたん!
- ページ上に表示されるフォームにそれぞれの投球で倒したピンの数を入力します
- すると即座に下のスコアシート(canvas)に反映されるので、最終的なアウトプットはそこで確認できます
- 入力が終わったらsaveをクリックする
以上でボウリングのスコアシートの結果を画像としてダウンロードすることができます。
機能・特徴
もちろん以下のような機能・特徴を盛り込んでいます
- スプリットだった場合はチェックボックスにチェックを入れるだけでスプリットの表示になります。
- スペアやストライクやガーターの記号は自動で変換されますので、かんたんに入力できます。
アウトプット例
では、上の画像でsaveを押したときにダウンロードできたものを見てみましょう。
このように、しっかり必要な情報がわかりやすく表示されていると思います。 もちろんブログの記事に簡単に貼り付けられます。 はてなブログだったら、ダウンロードした画像をドラッグ・アンド・ドロップするだけ!
最後に
これで簡単にボウリングの結果を画像で記録することができるようになりました。これをブログに貼り付けるだけで、ボウリングのスコアを記録する記事が作成できます。 ちなみに今までのハイスコアを貼り付けるとこんな感じ
いいですね!ハイスコア更新できるように頑張らなきゃ!