シルスプのブログ
50代女性の生き方
UIアウトプット

【UIアウトプット】DailyUI #01 – Sign Up ,#02-Credit Card Checkout

UI/UXデザイン

【UIアウトプット】DailyUI #01 – Sign Up ,#02-Credit Card Checkout

シルスプのブログにようこそ

新しいWeb事業を模索中。
Webサービスは、使いやすさが鍵だと思っています。

使いやすさといえばUI/UXという言葉がヒットします
書店で関連書籍を眺めているとなんやら、
文字いっぱいで小難しい。

体験しながら理解する方法はないかと探してみると、
ありました。「Daily UI」

Daily UI
https://www.dailyui.co/

Daily UIは、UIデザインを学ぶ学習サイトです。
100日の間に1日1課題が送られてきます。
できた課題を#DailyUIとしてXに投稿する流れです。

早速登録! 備忘録としてブログにアップしていきます。
いつまで続くやら・・・・

1.1,2日めの課題

1日目の課題は「Sign Up」
2 日目の課題は「Credit Card Checkout」

何のサービスでもいいので登録画面を作ろう!ということです。
はて?どうしたものか?

2.取り組み

デザインは、何にましても「誰に、何を、どうして、どのように」ですね。
私の場合のWebサービスのターゲットは、
購買意欲の強い20~30代女性。
ECサイトの登録画面にしよう。

  1)コンセプト作り

消費者庁の 令和4年版消費者白書によると、
若者(10代後半~20代としています)の消費者行動の特徴があげられています。
①「食べること」等にお金をかけつつ、
②「参加型のイベント」、
③「有名人やキャラクター等を応援する活動」にお金をかけている
とのこと。
確かに最近のはやりは、推し活やら界隈ですね。

図表Ⅰ-2-2-5 現在意識的にお金をかけているもの(年齢層別)を見てみると、
理美容・身だしなみ、ファンションが30%を超えていると見ると
重要な要素だなぁ

20代女性の会社員。食事はなるべく自炊して、ファッションに気を使うと
設定。情報は、SNSの口コミら専門サイトから入手。

第1部 第2章 第2節 (1)若者の消費行動
https://www.caa.go.jp/policies/policy/consumer_research/white_paper/2022/white_paper_131.html

  2)既存サービスの調査

コンセプトから、スマートフォンでの登録を決定!
既存サービスの登録画面を調査。するとタイプが2つに別れた
・とにかく簡単な登録を済ませてから商品検索させる
・最初から詳細な個人情報を求める

推測するに、有名サービスはここで買うという意識が高いので、
詳細な個人情報を入力しても離脱しないと思っているような気がします。
新規ブランド等の場合は、検索してもらてどのようなものに興味があるかをみたいと思うので、メールかSNSの登録済ましている可能性がありそうだ。

メインカラーをどうしようか?
今回はファッションの購入サイトを想定。
20代女性のファッションの方向性は、シンプル&モード系。
テーマカラーは、グレーベージュとする。

ショップ名は、「本物の・真の」という意味のVéritable(ヴェリターブル)とします。

4.作品

ショップ名Véritableをイメージするロゴを決定。
日本の場合のサインアップは何かなぁと考える。
LINE、Apple、Google、とメールアドレスは決定。
Yahoo、Facebook、Xはどうするか。。。
一旦、すべてのボタンを並べてみる。

何のサービスにサインアップするかわからなくなるので、
ロゴ、店名、イメージ画像を入れておく。

DailyUI #01 – Sign Up

できたものがこちら

画面ができたので、モックアップにしました!

DailyUI #01 - Sign Up

#02-Credit Card Checkout

できたのがこちら。3画面並べてみました!

DailyUI #02-Credit Card Checkout

5.感想

サインアップのサービスが多くて、一旦6つ並べてみたが、
やはり、5つまでにすべき。
20代女性のサービスだから、YahooとFacebookは不要かもしれない。

クレジットカードでの支払いの課題は、
日本では、クレジットカード以外の銀行振込やコンビニでの支払いも
多用されているので、一旦選べるようにした。

6.まとめ

Sign Up もCredit Card Checkoutも利用する人を想定して、
サービスを選ぶ必要があると感じました。