フッターデザイン3案

「もう少し格を上げられないか」を受けて、agete と AHKAH のフッターを実機で見た上で作り直した3案です。中身（決済・お届け・返品・ご案内）は3案とも同じで、変えているのは見せ方だけです。実テーマの CSS をそのまま読み込んでいるので、選ばれた案はこのまま実装できます。

ロゴの大きさ先にこれを決めてください

「①（150px）かな、もっと小さくてもいいくらい」を受けて、さらに小さい側で刻み直しました。基準として、いまのヘッダーのロゴは高さ32px（幅にすると約75px）です。①はそれとぴったり同じ大きさになります。 下の3案のロゴは、いったん②の95pxにしてあります。

① 幅75px（高さ32px）— ヘッダーのロゴとまったく同じ大きさ

② 幅95px（高さ40px）

③ 幅115px（高さ49px）

④ 幅135px（高さ57px）— 前回の①（150px）にいちばん近い

⑤ ロゴを置かない — 濃い色で締めるだけ（agete はこの形）

案Aこげ茶・推奨

背景をブランドのこげ茶（ロゴと同じ色）にして、最下部に qu のロゴを大きく置く。 agete も AHKAH も、フッターだけ濃い色にして締めていたのが共通点で、これが「格」を作っている一番大きな要素でした。決済ロゴは白い枠を外している。アイコン自体が白いカード型なので、濃い背景の上では枠がなくても整然と並びます。白基調のページの最後に濃い色が来ることで、ページ全体が引き締まります。

（ページ本文）

案B明るいまま・余白で見せる

いまのベージュを保ったまま、決済ロゴの白い枠を外して「箱が4つ並んでいる」印象を消し、ロゴを大きくした案。軽さと日常感は残りますが、案Aほどの締まりは出ません。ページ全体を明るく統一したい場合はこちら。

（ページ本文）

案C2トーン

情報の部分は明るいベージュのまま、最下部の帯だけ濃くしてロゴを置く折衷案。読みやすさを保ちつつ、締めの一段だけで格を出します。案Aほど重くならない代わりに、切り替えの線がやや目立ちます。

（ページ本文）

3案に共通していること
・中身（決済4グループ・お届け・返品・ご案内・SHOP）は今のPRのままで、変えていません
・決済ロゴは Shopify 公式素材そのままです。ブランドロゴの色を変えるのは商標のガイドライン上あぶないので、グレーにする案は採っていません
・案Aと案Cのロゴは、KV制作で使っている白ロゴ（qu_logo_white.png）をそのまま置いています

フッター デザイン3案

フッターデザイン3案