- デモ
- ホームページ制作
「うちのチーム」デモサイト なりなりマイティーズ
Overview概要
子どものスポーツチーム向けホームページ制作サービス「うちのチーム」の2つ目のデモとして作った、架空の少年野球チームのサイトです。機能はサッカーのデモと同じ土台を使い、見た目は新しいデザインの型「slugger」で、極太の文字と野球場のモチーフで力強さを出しました。
Challenge課題
このデモでは、なりなり市の少年野球チームを想定しました。子どものスポーツチームによくある悩みを元にしています。
- 入団を考えている家庭から「野球をしたことがなくても大丈夫?」「グローブやユニフォームでいくらかかる?」と、同じ質問が何度も来る
- 練習試合の申し込みが電話や知り合いづてで、空いている日を何度もやりとりする
- 子どもの写真や名前を載せたいが、載せてよい子とよくない子がいる
- 試合の会場や集合時間は保護者に伝えたいが、誰でも見られる場所には出したくない
あわせて、同じ土台から、サッカーのデモとはまったく違う見た目のサイトを作れるかを確かめることも、このデモの目的です。
Approach取り組んだこと
機能は「うちのチーム」の共通の土台(WordPress の親テーマ)をそのまま使い、チームの名前・カテゴリ・色・エンブレム・写真を子テーマに入れました。見た目は、サッカーのデモの型「stadium」と反対の性格を持つ、2つ目のデザインの型「slugger」を作りました。
デザインの型「slugger」
- パワフル感:stadium の「前に傾けた形・駆け込む動き」に対して、まっすぐ立った極太の文字、厚い帯、上からどしんと着地する動きにしました
- 野球場のモチーフ:外野フェンスと黄色いホームランライン(トップ・見出しの帯・スポンサー)、スコアボード(練習試合の空いている日・試合結果)、ホームベースの形(よくある質問の印)
- チームカラーとエンブレム:赤・紺・黄でまとめ、エンブレムは交差したバットとボールの丸いバッジにしました
土台から使える機能
- 練習試合の予定表:NG 日をカテゴリ(ジュニア・Bチーム・Aチーム)ごとに付けると、空いている日がカレンダーに出ます。日付を押すと、申し込みフォームにその日が入ります
- 写真と名前の公開の許可:許可のない子は、背番号入りの野球のユニフォームのイラストとイニシャルで紹介します。切り替えられるのはチームの代表だけです
- 試合の予定・戦歴:会場と集合時間は、保護者の合言葉を入れた人だけに見えます(デモの合言葉は baseball2026。ページにも出ています)。結果を保存すると、LINE に貼る文をボタン1つでコピーできます
- 学年の自動の進級と、使い方つきの管理画面:4月に自動で学年とカテゴリが変わります。管理画面の各画面の上には「この画面の使い方」があります
架空のチームなので、全ページに「デモサイト」の帯を出し、検索結果には出ない設定にしています。子どもの写真はすべて AI で作った画像で、実在の子どもは写っていません。チーム名・人物・住所も架空のものです。
Result結果
同じ土台のまま、サッカーのデモとはまったく違う印象のサイトになりました。チームは機能の作りを気にせず、デザインの型と色・エンブレム・写真を選ぶだけで、チームごとに作った感じのホームページを持てます。
制作期間は1日です(共通の土台は、サッカーのデモで作ったものを使いました)。
Galleryギャラリー
-
トップ(極太のスローガンと、着地するエンブレム) -
入団を考えている方へ(親の当番・費用などに先に答える) -
練習試合の空いている日(スコアボードのマス目。押すと申し込みへ) -
次の試合・最近の結果・お知らせ -
選手紹介(許可のない子は、野球のユニフォームのイラストとイニシャル) -
団員募集:費用と1日の流れ -
試合の予定(合言葉を入れた保護者だけに会場・集合時間。スマホは入れる前) -
戦歴(年度ごとの勝敗とスコア) -
練習試合の予定表(PC)と、日付を押して開いた申し込みフォーム(スマホ) -
試合結果の記事のスコアボード -
管理画面:練習試合の予定表(カテゴリごとに NG 日を付ける) -
管理画面:試合の予定・結果(LINE に貼る文をコピー) -
管理画面:選手(写真と名前の公開の許可を切り替える)
//contact
このような制作について相談する
お問い合わせフォームに、この実績をご覧になっての相談だと書き添えてお送りします。
相談する