Snap onomichi 架空サイト

Overview

デイトラ提供のデザインカンプをもとに、レイアウトや余白、装飾の位置関係を考えながらHTML・SCSS・JavaScriptで実装しました。レスポンシブ対応では、各画面サイズでの見え方を意識して調整しています。

Point

• 大きな背景画像が各画面サイズで自然に表示されるよう、表示領域や位置を調整しました。
• 装飾画像や各要素の配置がレスポンシブでも崩れないよう、画面幅に応じたレイアウト調整を行いました。

Tech

HTML / SCSS / JavaScript

Role

Design：デイトラ提供（課題カンプ）
Coding：HTML / SCSS / JavaScript実装