TRIPULL株式会社 ご担当者様 お世話になっております。 Webデザイナーをしている Yuru Design と申します。 お声がけいただきありがとうございます。 バンコク市内貸切観光のアイキャッチをご提案させていただきます。 一覧ページに並んだときに埋もれないことを最優先に設計しました。 ■ 縮小表示を前提にした文字量 ツアー一覧では横300px前後まで縮小されます。 この状態で写真を主役にすると 文字が読めなくなるため、文字が占める面積を全体の約5割まで増やしました。 実際に一覧ページの表示サイズに縮小して確認し、「バンコク市内貸切観光」が 最初に目に入る大きさに調整しています。 ■ 階層を3段に分けています ・最大:バンコク市内貸切観光(ご指定どおり最も目立たせています) ・中:行き先自由!(リボンで独立させ、タイトルと混ざらないようにしました) ・小:4時間・6時間チャーター(帯に収め、条件として読ませています) 「行き先自由!」をタイトルと同じ処理にすると全体が重くなるため、 形と色を変えて別の役割に見えるようにしています。 ■ 左上のバッジを避けたレイアウト カードの左上に催行状況のバッジが重なる仕様でしたので、 左上文字も装飾も置いていません。 ■ 既存アイキャッチとの統一 現在掲載されている画像を確認し、太い縁取り・金と赤の暖色・大きなジャンプ率 という共通の傾向に揃えました。1枚だけ浮くことがないよう、 明朝体や余白を活かした方向はあえて採っていません。 ■ 写真の扱い 文字が乗る左側と中央を明るく起こし、右側の仏塔はそのまま残しています。 縮小表示では建物の細部までは伝わらないため、 「タイの寺院」と一目で分かる要素だけを残す形にしました。 文字サイズ・配色・トリミング位置など、細かい調整はご希望に応じて対応いたします。 ご検討よろしくお願いいたします。 Yuru Design
メンバーからのコメント
TRIPULL株式会社 ご担当者様
お世話になっております。
Webデザイナーをしている Yuru Design と申します。
お声がけいただきありがとうございます。
バンコク市内貸切観光のアイキャッチをご提案させていただきます。
一覧ページに並んだときに埋もれないことを最優先に設計しました。
■ 縮小表示を前提にした文字量
ツアー一覧では横300px前後まで縮小されます。
この状態で写真を主役にすると
文字が読めなくなるため、文字が占める面積を全体の約5割まで増やしました。
実際に一覧ページの表示サイズに縮小して確認し、「バンコク市内貸切観光」が
最初に目に入る大きさに調整しています。
■ 階層を3段に分けています
・最大:バンコク市内貸切観光(ご指定どおり最も目立たせています)
・中:行き先自由!(リボンで独立させ、タイトルと混ざらないようにしました)
・小:4時間・6時間チャーター(帯に収め、条件として読ませています)
「行き先自由!」をタイトルと同じ処理にすると全体が重くなるため、
形と色を変えて別の役割に見えるようにしています。
■ 左上のバッジを避けたレイアウト
カードの左上に催行状況のバッジが重なる仕様でしたので、
左上文字も装飾も置いていません。
■ 既存アイキャッチとの統一
現在掲載されている画像を確認し、太い縁取り・金と赤の暖色・大きなジャンプ率
という共通の傾向に揃えました。1枚だけ浮くことがないよう、
明朝体や余白を活かした方向はあえて採っていません。
■ 写真の扱い
文字が乗る左側と中央を明るく起こし、右側の仏塔はそのまま残しています。
縮小表示では建物の細部までは伝わらないため、
「タイの寺院」と一目で分かる要素だけを残す形にしました。
文字サイズ・配色・トリミング位置など、細かい調整はご希望に応じて対応いたします。
ご検討よろしくお願いいたします。
Yuru Design