見出し画像

無料添削デザインスクール #195「スマホファーストビュー」

イライジャ｜WEBデザイナー　デザイン添削おじさん

添削

お花のサブスクサービスのスマホサイトですね。
シンプルでいいですね。

■UIをまず決めてあげる

デザインはアートではないので奇抜なものを作ればいいというものではないです。
派手に作りつつも基本のUIなどは使いやすいようにしてあげるといいです。
デザインを作る段階でコーディングや使う人のことを考えて作る必要があります。

ファーストビューの課題だとは思いますが、スクロールしたらロゴやメニューをどこに出すかを考える必要があります。

メニューは右上というのが一般的ではあるのですが、最近の動きとしては、親指で操作しやすいようにUIが下になりつつあるというのも聞きます。
人差し指で見るけどなぁ…とかも思うのですが、UIは常に時代に合わせて変化するので、そのあたりも見ながらデザインするといいです。

■メイン

サブスクだと分かりにくいのもありますが、メインの文字が小さいです。
最近はスマホに慣れてきたのか文字のサイズは少し小さくなりつつありますが、それでも程よい大きさがないと読みにくいのがスマホです。

横20～25文字くらいにすると読みやすいと昔聞いたことがあります。
20文字だとちょっと文字が大きいようにも思えますが万人に見やすい印象ですね。
25文字だとちょっと小さい印象ですが、若者向けだったらこのサイズでもいいかな。

ただ、ここはメインの文章でもあるので、読める読めないの次元ではなくて、分かりやすく「月額500円でお花が届く」ということを説明する必要があります。
キャッチなどの情緒的な情報は十分見せることができているので、サービスとして内容を紹介する必要があります。

バナーとかだったら情緒的なものだけでもいいのですが、バナーをクリックして詳細ページに飛んできたと考えると、サービスの説明をもう少し具体的にする必要があります。

■特典

全体的におとなしい感じにまとまっていていいのですが、商業として考えると特典などをもっと大きな声で言いたいです。

何度か書いていますが、サイトもバナーも物を売る場合に共通している方法が通販の売り方です。

「月500円でお花が届きます！」
「え～でも花瓶が…」
「そんなお客様のために今だけ！花瓶をプレゼント！」
「まぁ嬉しい！」
「さらに今だけ特別価格！初月無料！」
「買うわ！」

よく見る光景ですよね。
世界でこの方法が一番いいとされていて、もう40年くらい前からずっと変わらない方法です。

デザインに答えがないと言いますが、ある程度のものは答えが出ていて、その方法に従って作れば8割はうまくいくものです。

■ボタン

Webサイトだと大きすぎるボタンは邪魔になりますが、スマホの場合は逆で、小さくする必要がないので、目立たせたいボタンは横100％で作るとまとまり感も出るのでいいです。

サイトの印象を決めるのにボタンはかなり大きな枠割を持っています。
ボタンとフォントだけで印象は大きく変わります。
ボタンの形状や色にもこだわって作ってみてください。

絶対にベタやグラデーションでないといけないというわけではないです。
バナーみたいなボタンもあります。
ただ、サイト内でバナーのようなのを入れると広告だと思わせて自動的に脳内で見ないような動きになることもあるので注意が必要です。

デザイン添削のご依頼はTwitterから！

Twitterで投稿された作品を添削しています。
添削を希望される方はTwitterにハッシュタグ「#デザイン添削希望」を付けて投稿してください。


この記事が気に入ったらサポートをしてみませんか？