葵のポートフォリオサイト

aoi.work

【架空Webサイト】
観葉植物専門店

作品について

概要

クリ★スタというサイトで配布されているXDデザインカンプを元にコーディングを行ないました。

XDカンプからのコーディングは初めての経験でしたが、font-sizeやline-heightの数字の取り方などを調べながら、レイアウト部分に関しては正確な再現をモットーにコーディングを行ないました。

配布元様から「ポートフォリオサイトに掲載可」とのご案内がありましたので、掲載をしております。

メインビジュアルのスライダーや、ハンバーガーメニューにはjQueryを使用しています。

コンセプトについて

コンセプトの「観葉植物専門店(フェイクグリーン専門店)」については、自分の部屋を模様替えしたときにフェイクグリーンを置こうと思ったことをきっかけに思いつきました。

カンプ配布元様の案内で「デザイン・コード改変自由」とありましたので、他の同じカンプを基に制作された方々との差別化も兼ねて上記コンセプトを適用いたしました。

画像やテキストにつきましては、自分で選定および制作を行なったものです。

制作時間

約8.5時間

作品イメージ(抜粋)

PC版

フェイクグリーン専門店の架空サイト PC版 1
フェイクグリーン専門店の架空サイト PC版 2

SP版

フェイクグリーン専門店の架空サイト SP版 1
フェイクグリーン専門店の架空サイト SP版 2
フェイクグリーン専門店の架空サイト SP版 3
フェイクグリーン専門店の架空サイト SP版 4