ころくる
球技のボールを比較するWebサイト
概要
これは何?
球技で使用されているボールの大きさなどをわかりやすく比較するサイト。
背景と目的
- 背景
昨年オリンピックが日本国内で行われたり、スポーツ漫画の影響、また中学校の部活動でスポーツに興味を持つ機会が多い。またスポーツの中でも球技は野球やサッカー当のスポーツ中継、漫画の題材や体育の授業に取り入れられることが多く目にする機会が多い。しかし新たに興味を持っても競技するために必要なボールがどのような大きさなのかということがネットで調べても文字情報だけでの説明や数種目で比べるサイトが少なく分かりにくい。そこで様々な競技のボールを視覚情報を用いて説明をすることで、新たに関心を持った競技に触れやすくなるのではないかと思った。
- 目的
画像などを用いて視覚的に分かりやすい情報で直感的に理解でき、その後文字情報での詳細説明をするWebサイトを作成することで、クラブ活動や習い事で球技を始めようとしている小学生などの球技に関心を持ち始めた人が、より球技に関心を持ったり始めるときのきっかけになりたい。
コンセプト
画像などを用いて視覚的に分かりやすい情報で伝えることで、クラブ活動や習い事で球技を始めようとしている小学生などの子供にも分かりやすくする。それから、文字情報などでの詳細説明をすることで、より詳しく知ろうとしている人も利用できるようにする。また3Dモデルも使用することでただ見て読むだけではない動きのあるものにして、もともと興味のある競技だけでなく、より多くの競技にも関心を持ち参考にし、運動を始めるきっかけになれるサイト。
成果物の仕様
Webサイト
制作ツール
Belnder, GitHub, ibisPaint X
プロジェクトの期間
2022.04.08~2022.12.23
まとめ
調査
現状調査
先行事例
- ボールの大きさ比較
〇ボールの説明書きが詳しく、どのように使い分けられているのか分かりやすい
△文字だけでの説明で想像しにくい
- ボールの大きさ比較2
〇それぞれのボールの大きさや重さがグラフ化されており違いが分かりやすい
△実際の大きさは想像しにくい
- ボールの大きさ比較3
〇画像での比較が分かりやすく、文字での説明も詳しく記載してある
△他の競技のボールとは比べられない
全体的に文字での説明が多いように感じ、直感的に違いを感じ取ることが難しいと感じる。
また、同じ競技の違う大きさのボールを比べるものは多いが、異種競技のボールを比べているサイトは少なかった。
上記のことから、異種競技や身近なものを直感的に比較し想像することが難しいと感じた。
技法・技術情報
プロジェクト管理
スケジュール
スケジュール ◁ここから見れます
ToDo
- サイト制作
- どのように比較させるのか
---頭文字検索
- サイトの枠組み作り
---ボールが流れるように
- 画像制作
- ボール
- 比較するもの(スマートフォン等身近なもの)
- ボールのリストアップ
進捗記録
2022.11.22
イラスト
- 4~16cmのボールイラストの画像サイズ変更→差し替え
サイト
- サイズ変更したボール画像の差し替え
- ボールイラストのスライドの仕様を変更(wideslider→slick)
- スライドの画像にカーソルを合わせると競技名を表示
- いままで
スライドの画像をクリックしてボールの詳細表示させることでボールのことを知ってもらう。文字情報は一覧でも見られるようにしておく。
↓
スライドを興味を引くきっかけとし、競技名を見てサイト内の索引から探して詳細を見てもらう。
2022.11.11
イラスト
サイト
- リストにボールを追加
- ボールイラストのスライドindexを追加(wideslider)
- 前回の仕様のまま挿入しても画像をクリックしてもボールの詳細が表示されない
2022.11.05
サイト
リストにボールを追加
2022.10.29
イラスト
ボールイラスト追加
2022.10.22
イラスト
ボールイラスト追加
2022.10.17
イラスト
ボールイラスト追加
2022.10.11
サイト
2022.10.01
サイト
https://katsukinarita.github.io/korokuru/
2022.09.23
サイト
2022.09.16
サイト