見出し画像

Daily UI Challenge #041 to #050

こんにちは!ドイツ在住・DailyUIチャレンジ中のヒトミです!
ついにこのチャレンジも折り返し地点に到達しました!毎日50日間連続デザインしてますー!さて、今回も自分で自分のデザインをサクッとレビューしていきます。デザインレビューの練習も兼ねてます。

Daily UI 041 Workout Tracker

画像1

ワークアウトの記録アプリです。Figmaの波を作るプラグインを見つけて、背景とか、線グラフがめちゃくちゃ簡単にできるようになりました!ワークアウトのタイマー画面のアイコンの位置を中心に水平にすればよかったですかね。なんかあんまり綺麗じゃないですね。毎日続けよう!っていうモチベーションをあげるUIになるように、何日続いてます!っていうメッセージを乗せたり、水平カレンダーのところはワークアウトした日は色がつくようなイメージで作っています。チャートのところももっと作り込みたかったです。。。


Daily UI 042 ToDo List

画像2

TO DOアプリです。何をいつ何時にするか、リマインダー機能も入れています。横にスワイプすると完了になって、リストからタスクが消えます。3点ドットでもタスクの編集や削除画面に遷移できます。ドロップシャドウもっとキレイにすればよかったかな。

Daily UI 043 Food Drink Menu

画像3

お店のメニューアプリ。リストにもプラスボタン付ければよかったですね。このままだと毎回次のページに遷移しないとオーダーリストに入れられないので、ちょっとめんどくさいかも。私のイメージでは、お店に入って、アプリを開いてここからオーダーできるという使い方です。

Daily UI 044 Favorites

画像4

初めてガッツリアニメーションを作りました。インターネットで見つけた例を見ながらやってみたので、自分のアイディアではないんですが、アニメーションアイコンの練習になりました。普段の業務ではなかなかここまでできないので、いいきっかけになりました。もう少しスムーズに動かせたはずなんですが、忍耐力と集中力が切れました。。。

画像12

ちなみにこんな感じでアニメーションを作ってます。

Daily UI 045 Info Card

画像5

カードコンポーネントです。ここでもアニメーションを付けてみました。旅行系のアプリのイメージです。カードを押したら、全画面になって詳細が確認できます。このタイプの画面遷移が個人的に好きです。

Daily UI 046 Invoice

画像6

請求書管理アプリです。お恥ずかしい話なんですが、請求書の発行をしたことがないので、何が請求書に必要なのかかなりググりました。法律とも関係してるので、結構要注意ですよね。Daily UIにあんまり時間をかけないと決めているので、なんだか中途半端になっちゃいました。。。もう一回チャレンジしたい〜!なんかフォームももう少し見やすくなるはず。

Google Material Designのテキストフィールドページを確認して頭に叩き込みますー!

Daily UI 047 Activity Feed

画像7

ソーシャルメディアのActivitiy Feedを参考にしました。TwitterとかFacebookとかnoteも参考にしています。ユーザー名がクリック可能、未読と既読が判別可能、いつアクションがあったのかがわかる、どのポストにアクションがあったかわかる、これらがポイントです。最近の時間の表示って、何分前、何時間前、昨日、今日、っていう表現が多いですよね。そんなに前のアクティビティじゃなければ、何時何分じゃない方がもっと直感的でわかりやすいと思います。

Daily UI 048 Coming Soon

画像8

画像9

アーティストじゃないですが、アート感が出るように頑張りました。タイポグラフィの勉強もっとしないとダメですね。。。写真はUnsplashさんからです。よく使ってます。

Daily UI 049 Notifications

画像10

通知コンポーネントです。いろんな通知のコンポーネントがありますよね。通知内容によってどのコンポーネントか適切なものを選ばないといけません。ダイアログウィンドウとか、バナーとか、スナックバーとか。。。この辺ももっと勉強したいです。

Google Material Designの記事でこの辺とかちょっと理解するのに助けになるので、まだ読んでない方は是非ー!

Daily UI 050 Job Listing

画像12

お仕事検索アプリです。おすすめのお仕事が横にスワイプで見れるようになっていて、下には新しい仕事から順番に見れるようになっています。お仕事系は検索機能がめちゃくちゃ大事ですよね。みんなどんな仕事でも言い訳じゃないです。フィルターも保存できるようにするとかいろいろアイディアもっと盛り込めそう。履歴書をアプリ内で作っておいて、セーブして、いつでもそこから遅れるとか。LinkedInとかはもうそんな感じですよね。

背景はこの背景ジェネレーターツールを使いました。なんか最近サービス名に日本語使われてる事多くないですか?それはさておき、このツールめちゃくちゃ使えます!SVGでダウンロードできるからダウンロードした後も編集加えまくれます。ダウンロードする前にも、いろいろ設定変えられまくるので、是非使ってみてくださいー!

関係ないんですけど、オンラインツールで海外向けのCVを作れるオンラインツール発見しました。デザインもクリーンなので、いつかチャンスがあったら使ってみたいです。海外転職狙ってる方は使ってみたらどうでしょう?ぜひ感想聞きたいです!

さて、50まで振り返りました!細かいところがまだまだだなって感じです。1−2時間で作れるようにやってるので、細かいところまでできないっていう言い訳も実はあるんです。もっと時間かけてもいいけど、多分続かなくなっちゃうと思います。。。

後で振り返ってどこがどうだったか、レビューしてたらいいかな?w

というわけで、ここまで読んでいただきましてありがとうございます。参考になった、なるほどねーと思った方はスキボタンを!なんとも思わなかった方もスキボタンを!では良い週末を〜!

Follow me!
こちらでもいろいろ投稿してます!

Instagram | Twitter | dribbble | Facebook | Vimeo

いいなと思ったら応援しよう!

Hitomi Bremmer UI UX
無料コンテンツ気に入ってくれたら、☕️一杯分ほどの支援をして応援してくれませんか?コーヒーは私にとってクリエイティブな活動の「元気の源」です😆

この記事が参加している募集