works
制作実績
こじちゃん農園様WEBサイト
go to site
サイトについて
「安心安全な農産物を子供に」をテーマに、無農薬栽培、平飼い養鶏を行っている伊豆の国市浮橋地区にある農園様のWEBサイトです。
目的 /
農園についてより多くの人に知ってもらうきっかけ…看板のような存在としてのサイト構築を行い、認知度の向上や新規顧客の開拓を行っていきます。
ターゲット /
安心安全な食べ物を子供に食べさせてあげたいと願う、20代後半～40代の子育て世帯。無添加、オーガニックなどを日常に取り入れている人。
農園ご家族の温かさが伝わるような優しい雰囲気の、農園からご紹介いただいた地元イラストレーターさんのイラストをWEBサイト全体に使用しています。
WEBサイト構築と同時に、Instagramアカウントを作成し運用開始し、日々の出来事やイベント情報などリアルタイムな情報はInstagramで発信し、WEBサイトに組み込んで情報を連動させています。
制作範囲
- ヒアリング／要件定義／ワイヤーフレーム／デザイン／コーディング
- TOPページ、下層4ページ
- 制作期間 / 4週間
- 使用ツール / figma,photoshop,VS cord
- 使用言語 / HTML,CSS, java script
デザインで
意識したところ
- 平飼い養鶏と無農薬栽培という2本の柱、「安心安全な農産物を子供たちに」という想い、農園の様子が分かる写真をスライドで配置して見せることで、どのような農園であるかファーストビューでしっかり訴求できるデザインとしました。
- ボタンやタイトルに卵の形を使用し、農園らしさを演出。カラーは卵のイエローをメインに、農作物や鶏の色を使用しました。
- セクション間や写真を曲線や円で描くことにより、柔らかいく優しい印象に。地元イラストレーターさんオリジナルのイラストを配置することで、親しみやすい雰囲気を演出しました。
- topページ以外からの流入も考え、全てのページにInstagramとお問い合わせを設置しました。
コーディングで意識したところ
- CSSグリッドレイアウトを使用して、イラストや写真の配置、タイトル文字の配置などがレスポンシブで崩れないよう制作しました。
- WEBサイト自体の更新を行わなくても、最新の情報をユーザーが得られるように、instagram埋め込みウィジェットを使用し、instagramの投稿をリアルタイムで発信できるようにしました。
- SNSななどサイトのURLが共有された際、タイトルや画像、説明文などが表示されることで、ユーザーに対してページの内容を詳しく伝えらるよう、OGP設定を行いました。
制作実績一覧に戻る