Club Q’buサイト

提供素材は写真とワイヤーフレームだけ、といった連連の依頼の最終作になったと記憶しています。ロゴのほか、とりあえず目を通すテキストから”ノリ”を想定して製作にあたる前に、前回くらいからbootstrapのグリッドレイアウトを投入しており、PC /スマホ側の移行も容易に行えるデザインになりました。
bootstrapのパディングに囚われすぎ、コンテンツエリアの両端にスペースがあるのが気になります。今ならスペースは作らないでしょうね。ない方が安定感生まれますよね？

スマホ版は大きく進化しています。やはりグリッドレイアウトの使い方に慣れてきたのが主因でしょう。何より待望の”ハンバーガーアイコン(右上)”が登場しました。当時から賛否があった？気がしますが、ボクは全面支持でした。それまでは上下移動のアンカー矢印が設置されて気がしますが最近はあまり見ませんよね。誤タップで画面遷移しがちなのでボクは苦手です。コンテンツエリアは横並び２ブロックとなっていますが、現在は１ブロックで文字を少し大きめにして読みやすさを重視するでしょう。その場合だと、縦長になりすぎるもののそれを解決するのが”追従してくるハンバーガーアイコン”です。理にかなってますね。

PC版の固定ぺージですが、こちらはすでにスマホ対応でスマホとPCで見た目や印象が変わらないデザインになっています。見出し＋コンテンツ(この場合は文章)で、１ブロック縦長に配置していますね。見出しエリアの背景はロゴマーク「Q`bu」にイメージを寄せた幅広フォントに、ラグジュアリー感を少しだけ追加したイメージを想定しています。

求人募集は、せっかく素材が良いのでキャスト(女の子)と、スタッフ(男性)で二つ製作。こちらはPC側のレイアウト。

スタッフ募集(スマホ版)。いずれもイメージ統一されているのと、PC/スマホで違和感のない関連デザインにしてあるのがポイント。実はこのヘッダー背景の部分、左にある”変則角丸四角形”デザインは、本当に好きなので好きアラバ投入したいところです。もちろん、ホバーで合体・分離するアニメーションとかも想定しています。今回は日産のフェアレディーZ(33型)のエンブレムにインスピレーションをもらって中に三角矢印をデザイン。こういうわかる人にしかわからない遊びが大好きです。