30日でWebスキルを獲得して副業で稼ぐことができるようになるための30日チャレンジ!
本日はDAY20!
Envato Elementsの便利さを実感したところで早速今日から2つ目のサイトを作成していきましょう!
それでは、今日も引き続き頑張っていきましょう!

Dave(Xアカウント)
【記事作成者プロフィール】
オーストラリアのラグビーとサッカーのチームでメディカルトレーナーとして活動したのち、Web系フリーランスに加えて、デイトラ公式YouTubeチャンネル運営として活動中。
DAY20のポイント
- 「仮想スポーツジムサイト」ゴールを確認する
- ピンタレストで類似サイトを調査する
- 構成の確認をする
- 画像を用意する



今日から2つ目のサイトを作成していきます!
引き続き作成練習頑張っていきましょう!
「仮想スポーツジムサイト」ゴールを確認する
今回はパーソナルのスポーツジムをイメージしてサイトを作成していきましょう!
基本的にはテンプレートを元にして作成を進めていきますが、追加コンテンツなどもありますので1つずつ確認してましょう!
ピンタレストで類似サイトを調査する
早速今回も、1つ目のサイト制作の時と同様に、以下のような依頼があったと想定して、どのようなサイト構成がいいか、コンテンツを追加すべきかを考えていきましょう!類似サイトの調査も前回同様に「ピンタレスト」を活用していきましょう!
基本情報
詳細 | |
名前 | Dave |
年齢 | 32歳 |
職業 | パーソナルスポーツジムの経営者 |
所在地 | 愛知県 |
ビジネス状況
詳細 | |
規模 | 小・中規模なパーソナルジムを運営(会員50名程度) |
特徴 | 明るい施設づくりをしておりビジネスパーソンの健康に着目した内容を提供している |
現状 | Webサイト自体は持っているが、自分で作ったため見た目も良くない |
Webサイトを制作の目的
詳細 | |
目的 | どんなサービスを提供しているかをわかりやすくして トレーナーの紹介もしっかりと行いたい |
希望するサイトの特徴
詳細 | |
イメージ | シンプルで明るいデザイン |
その他要望 | 動画でも自社の魅力を伝えたいので YouTube動画を出しているのでWebサイトにも 埋め込んでいきたい |
予算と納期
詳細 | |
予算 | 15万円程度 |
納期 | 1ヶ月~1ヶ月半程度 |
懸念点・不安
詳細 | |
懸念点 | 自社で画像等の用意がないので フリー画像などを活用したい |
その他 | セール状況なども定期的に変更したい |
実際のお仕事ではこう言った内容を実際に、制作を行う前にクライアントとMTGを行い内容を決めていきます!
このMTGでいかに共通認識にできるかどうかがで作成のしやすさはもちろんのこと、完成後の修正も少なく済ませることができます。そのため事前打ち合わせはとても大事なところの一つです!
そしてこれらのヒアリングの内容をもとに、構成を考えて行く段階では是非ピンタレストなどを活用してみてください!
構成の確認をする
スポーツジムやパーソナルジムの類似サイトをたくさん見てみてどんな印象を受けましたか?
全体的にカッコ良さやスタイリッシュなサイトが多かったんじゃないでしょうか?
この後、フリー画像を探して行く段階に行きますがここでどんな雰囲気の画像を用意するかも決めておけるといいですね!
構成コンテンツでは、今回上で紹介した要件とピンタレストで見てみた内容を総合して検討をし以下の内容今回は制作を進めてみましょう!
入れ込むコンテンツ
- FV(ファーストビュー)
- 私たちについて
- サービス紹介
- スクールの特徴
- 受講生の声
- 広告欄
- アクセス
カラー設計
- メインカラー:ダークネイビー(#1C1F2B)
- サブカラー:ライトグレー(#F5F5F5)
- アクセントカラー:茶色系(#A37A0A)
フォント
- 日本語フォント:Noto Sans JP
- 英語フォント:Prata
まとめ
ここまで確認と準備ができたところで、いよいよ制作の段階に入っていきます!
明日から実際に制作を進めていきますのでそれまでにWordPressの構築環境を整えていきましょう!
昨日のEnvato Elementsをテスト的に使ったものを活用していただいてもいいですし、Studio by WordPressでしたら1分もあれば新規作成ができますので新しく作り直していただいても大丈夫です!
課題に挑戦!
本日の課題は
- 「仮想スポーツジムサイト」ゴールを確認する
- 要件を確認して画像を用意する
- WordPressの構築環境を整える
明日はデザインの初期設定やテンプレートのインストールなども行なっていきますので、もしやり方忘れている気がする…という方は前のDAYを確認してみてください!
それでは引き続き頑張っていきましょう!