URL

https://k-akao-web.com/goto-farm/

担当

コーディング

サイトの目的

架空企業の紹介 / EC / お問い合わせなど

制作期間

コーディング：4日間

コーディングについて

Figmaデザインカンプよりコーディングを行っております。
HTML、CSS、JavaScriptでの静的コーディングを行なっております。
JavaScript (JQuery)で、ハンバーガーメニュー、お問い合わせセクションの必須項目未記入時のボタン非活性(送信機能なし)、ページ内スクロール、スライドなどを実装しております。

The post 蓼科ごとう農園（架空サイト） first appeared on Kaname's Portfolio.

URL

https://k-akao-web.com/igatta-group/

担当

コーディング

サイトの目的

架空企業の採用募集 / 条件などの提示のため

制作期間

コーディング：1週間

コーディングについて

Figmaデザインカンプよりコーディングを行っております。
HTML、CSS、JavaScriptでの静的コーディングを行なっております。
JavaScript (JQuery)でエントリーページのモーダル、お問い合わせページの必須項目未記入時のボタン非活性、ページ内スクロールなどを実装しております。

The post Igatta Group（架空サイト） first appeared on Kaname's Portfolio.

URL

https://k-akao-web.com/

担当

デザイン / コーディング / WordPress

サイトの目的

制作物および製作者の紹介 / 制作依頼の募集 / お問い合わせ手段のご提供

制作期間

デザイン: 2日間
コーディング + WordPress：14日間

デザインについて

作品や制作者などサイト利用者にとって必要な情報にのみフォーカスを当てるため、情報ごとにページを分け、白背景に必要なイメージのみを並べたミニマルなデザインにしました。

コメント

HTML、CSS、JavaScriptによりコーディングを行い、WordPressを実装しました。
表示速度や見やすさを優先してトップページに掲載する作品数は最低限に抑え、サムネイルにはカテゴリ名ラベルを付与しております。また投稿ページにはカテゴリ別アーカイブページへのリンクと関連記事を表示することで、作品の見落としがないようにしております。お問い合わせページにはWordPressのプラグインを使用し、メールの自動返信機能を実装しております。

The post ポートフォリオサイト（当サイト） first appeared on Kaname's Portfolio.

URL

https://k-akao-web.com/engress/

担当

コーディング / WordPress

サイトの目的

語学スクールへの勧誘 / プランの紹介等

制作期間

コーディング + WordPress：2週間

コーディングについて

XDデザインカンプよりコーディングを行っております。
フロントページの事例部分と料金ページの金額部分はカスタムフィールドでクライアント様からも変更しやすくしており、お知らせ部分についてはカスタム投稿タイプで対応しました。また記事ページでは関連記事やおすすめ記事へ遷移が可能で、各記事にはSNS共有機能も実装いたしました(サンプルサイトのためリンクはつなげておりません)。
最後に公式テーマユニットテストデータを用いて、動的処理による表示崩れがないかを確認しております。

The post Engress (架空サイト) first appeared on Kaname's Portfolio.

URL

https://ms-toi.com/

担当

企画 / デザイン / コーディング / WordPress

サイトの目的

音楽教室のプランの紹介 / 体験レッスンの申し込み・お問い合わせの促進

制作期間

デザイン：1週間
コーディング＋WordPress：2週間

デザインについて

主なターゲットはピアノの初学者〜音大受験生である10代から、声楽・ピアノを趣味として始めるシニア世代です。
ターゲットの幅の広さを考慮して、過剰な装飾や複雑な構造を避け、ピアノ教室の紹介からコース紹介、お問い合わせまでをフロントページ1枚でデザインしました。
またクライアント様の要望により、透明感と親しみやすさのあるイメージと、音楽へのこだわりが伝わるサイトの作成を心がけました。

コーディングについて

HTML、CSS、JavaScriptを用いてコーディングをし、WordPressを実装いたしました。
基本的にクライアント様がサイトを更新することは想定していませんが、お問い合わせの自動返信メールの機能やSEO面の強化、拡張性の向上のためにWordPressで実装しております。
今後、クライアント様よりご要望があった場合に備えてブログ投稿ページやアーカイブページなども制作いたしました。

The post toi音楽教室 様 first appeared on Kaname's Portfolio.

URL

https://wakasa-2dm.com/

担当

デザイン／コーディング

サイトの目的

イベント情報の発信 / イベント参加の促進 / イベント申し込みサイトとの連携

制作期間

デザイン + コーディング：3週間

デザインについて

ウオーキングイベントはあらゆる世代の男女がターゲットとなるため、過剰な装飾や複数ページのサイト構成となることを避け、見やすさを優先してトップページ1枚で完結するようにデザインを制作しました。
またウオーキングという体験型イベントの特性から、実際に参加したくなるような若狭地方の魅力が伝わる写真素材を多数使用しています。

コーディングについて

HTML、CSS、JavaScriptでのコーディングです。
スマートフォン、タブレット、PCなど全てのデバイスで快適に閲覧できるようにレスポンシブ対応やユーザビリティに配慮したコーディングを心がけました。アニメーション部分はJavaScriptのライブラリの使用とJQueryの記述で実現しております。

コメント

サイトの公開後もGoogleサーチコンソールやアナリティクスを活用し、効果的なサイトの運用を試みました。

The post 若狭・三方五湖ツーデーマーチ first appeared on Kaname's Portfolio.