DESIGN STUDY · TSG
TSG白い余白と立体表現で、素材の印象を伝える
白い背景の中に異なる質感の立体物を並べ、縦方向の文字を添えた画面です。製品を説明する前に、素材への関心を引く構成を読み解きます。
このデザインから考えること
異なる質感を同じ画面で比較させる
保存画面には、透明感のある青い形、骨組みのような形、多面体の形が並んでいます。背景を白く抑えることで、それぞれの表面や輪郭の違いが目に入りやすくなっています。製品の写真を整列させる構成とは異なる、素材の印象から関心を持たせる見せ方です。
余白を情報の分離に使う
ロゴ、短い文字、ビジュアル、問い合わせの入口が画面内で離れて配置されています。余白は単に空いている場所ではなく、要素を読み分けるための距離として働きます。どの文字を先に読ませたいかを決めてから、画像と文字の間隔を調整する考え方が参考になります。
制作に取り入れるなら
素材や加工、技術の特徴を伝える企業サイトを検討するときの比較対象になります。抽象的な表現だけでは扱う製品が伝わりにくいため、自社で使う場合は本文に製品名、用途、具体的な強みを置きます。スマートフォンでは縦書きと横書きが混在しても読む順序が途切れないようにします。
確認しておきたいこと
静止画から3Dの実装方法や描画負荷は判断できません。大きなビジュアルを採用する場合は、表示までの時間、代替画像、キーボードで到達できる問い合わせ導線を別々に確認します。
