【UIアウトプット】DailyUI #011-Flash Message
シルスプのブログにようこそ
Daily UIの11日目の課題は、Flash Messageです。
なかなか聞き慣れない課題で「うっ」となります。
何を作ればいいのかわかりません。とにかく、Flash Messageとはどんなものかをリサーチです。
Daily UI
https://www.dailyui.co/
１．課題
Flash Messageとは、投稿や登録をした後に一時的に表示されるメッセージのことらしいです。
投稿や登録した時に自分の操作が成功したのか、失敗したのか
がわかる仕組みのことです。
成功したときと失敗したときのパターンを作ればいいということと理解しました
２．取り組み
１）想定
せっかくなので、DailyUI #006,007で想定したマッチングアプリを前提として作ってみます。
会員登録をした時にでるメッセージを作ります。
自分がよく遭遇するのは、契約時に住所を入れた時に、
「登録できない文字が使用されています」です。
どの文字が登録できない文字なのかさっぱりわからない。
そうだったら、保存する時に最適な文字に置き換えれば
ストレスなく使えると思うのだけれど、対応しているサービスは
少ないようです。
登録に成功した場合は、次画面に
画面いっぱいに表示しようかと思います。
登録に失敗した場合は、登録画面の下と該当場所に
文字が出るようにしたいです。
今回もスマホ画面を想定します
２）必要項目
・登録に成功しました
・すでに登録済みです。
を作成します。
３．作品
DailyUI #011-Flash Message
４．感想
自分が使っているサービスのイメージで、画面が出来上がってしまっている感じがします。
マッチングアプリの登録画面を前提に作成したので、
以前の課題のDailyUI #008_404 Page Design のように
画面を見たらホッとするように作ってみました。
登録失敗の画面は、失敗すると「いらっ」とするので、
文字を柔らかくしました。カラーもソフトな色を選びました。
５．まとめ
登録するのって、ほんとにめんどくさいです。
項目はいっぱいだし、失敗するとコメントは出てきますがが
理由がわからない。
自分が使っているイメージがしやすかったです。
では、またねぇ～
