駆け出しデザイナーのDaily UI #001「SIGN UP」

どうもとぴです。
今日からDaily UIを始めたのでその記録を毎日つけていきます。

Daily UIとは?

Daily UIとは100日間毎日届くお題に対して、UIデザインをTwitterに投稿するというチャレンジです。

Twitterで#DailyUIのハッシュタグを見てもらえば
たくさんの方が投稿されているので、雰囲気が分かると思います。
Twitter-#DailyUI

僕の作業環境

  • UIデザイン「Adobe XD」
  • Windows PC
  • 画像編集「GIMP」

正直これが正解なのか分かりませんがとりあえずこれでやってみます。
(Photoshop欲しい…)

Daily UI #001

記念すべき一日目のお題は、SignUpです。
何かしらのWebサービスの登録画面を作れってことですね。

実際に作ってみたのがこちら↓

架空のTHISというスマホアプリでの会員登録画面を想定し、デザインしました。

まず、デザインするにあたり参考にしたのは大手サイトの会員登録画面です。

Daily UIは登録をした時点から100日スタートするので、すでに#001のチャレンジをこなしている方はいます。なのでその方々のデザインを参考にしようとも考えたのですが、どうしてもパクってしまいそうだったので我慢しました。

参考にしたSpotifyのサインアップ画面はこんな感じ。

出典:Spotify

極力シンプルな形にしたかったので、入力する情報は

  • メールアドレス
  • ユーザー名
  • パスワード

のみとしました。

また、カラーはこのサイトでも使用している落ち着いた青緑を基調とし、背景には薄く木目調の画像を使用しました。

反省点としては少しフラットなデザインにしすぎて、単調にチープになってしまったことです。アイコンや影なども付けるとよかったように感じます。

他の方の#001を覗く

デザインを始める前は、他の人の#001の作品を見ることは避けていましたが、復習と次回からの参考にするためにもデザインを終えてから他の方の作品を見てみました。その中から気になったものを少し紹介します。

可愛い。。。斬新なフォーム配置とかわいい犬のイラストがいいですね。全体が太めの線で統一されているのもポップな雰囲気が出ていて美しいです。

この方の作品は色選びに統一感があっていいなと感じました。大人っぽいリッチな印象を受けます。それでいて見やすくシンプルに仕上げられています。