Daily UI Challenge #041 to #050
こんにちは！ドイツ在住・DailyUIチャレンジ中のヒトミです！
ついにこのチャレンジも折り返し地点に到達しました！毎日５０日間連続デザインしてますー！さて、今回も自分で自分のデザインをサクッとレビューしていきます。デザインレビューの練習も兼ねてます。
Daily UI 041 Workout Tracker
ワークアウトの記録アプリです。Figmaの波を作るプラグインを見つけて、背景とか、線グラフがめちゃくちゃ簡単にできるようになりました！ワークアウトのタイマー画面のアイコンの位置を中心に水平にすればよかったですかね。なんかあんまり綺麗じゃないですね。毎日続けよう！っていうモチベーションをあげるUIになるように、何日続いてます！っていうメッセージを乗せたり、水平カレンダーのところはワークアウトした日は色がつくようなイメージで作っています。チャートのところももっと作り込みたかったです。。。
Daily UI 042 ToDo List
TO DOアプリです。何をいつ何時にするか、リマインダー機能も入れています。横にスワイプすると完了になって、リストからタスクが消えます。３点ドットでもタスクの編集や削除画面に遷移できます。ドロップシャドウもっとキレイにすればよかったかな。
Daily UI 043 Food Drink Menu
お店のメニューアプリ。リストにもプラスボタン付ければよかったですね。このままだと毎回次のページに遷移しないとオーダーリストに入れられないので、ちょっとめんどくさいかも。私のイメージでは、お店に入って、アプリを開いてここからオーダーできるという使い方です。
Daily UI 044 Favorites
初めてガッツリアニメーションを作りました。インターネットで見つけた例を見ながらやってみたので、自分のアイディアではないんですが、アニメーションアイコンの練習になりました。普段の業務ではなかなかここまでできないので、いいきっかけになりました。もう少しスムーズに動かせたはずなんですが、忍耐力と集中力が切れました。。。
ちなみにこんな感じでアニメーションを作ってます。
Daily UI 045 Info Card
カードコンポーネントです。ここでもアニメーションを付けてみました。旅行系のアプリのイメージです。カードを押したら、全画面になって詳細が確認できます。このタイプの画面遷移が個人的に好きです。
Daily UI 046 Invoice
請求書管理アプリです。お恥ずかしい話なんですが、請求書の発行をしたことがないので、何が請求書に必要なのかかなりググりました。法律とも関係してるので、結構要注意ですよね。Daily UIにあんまり時間をかけないと決めているので、なんだか中途半端になっちゃいました。。。もう一回チャレンジしたい〜！なんかフォームももう少し見やすくなるはず。
Google Material Designのテキストフィールドページを確認して頭に叩き込みますー！
Daily UI 047 Activity Feed
ソーシャルメディアのActivitiy Feedを参考にしました。TwitterとかFacebookとかnoteも参考にしています。ユーザー名がクリック可能、未読と既読が判別可能、いつアクションがあったのかがわかる、どのポストにアクションがあったかわかる、これらがポイントです。最近の時間の表示って、何分前、何時間前、昨日、今日、っていう表現が多いですよね。そんなに前のアクティビティじゃなければ、何時何分じゃない方がもっと直感的でわかりやすいと思います。
Daily UI 048 Coming Soon
アーティストじゃないですが、アート感が出るように頑張りました。タイポグラフィの勉強もっとしないとダメですね。。。写真はUnsplashさんからです。よく使ってます。
Daily UI 049 Notifications
通知コンポーネントです。いろんな通知のコンポーネントがありますよね。通知内容によってどのコンポーネントか適切なものを選ばないといけません。ダイアログウィンドウとか、バナーとか、スナックバーとか。。。この辺ももっと勉強したいです。
Google Material Designの記事でこの辺とかちょっと理解するのに助けになるので、まだ読んでない方は是非ー！
Daily UI 050 Job Listing
お仕事検索アプリです。おすすめのお仕事が横にスワイプで見れるようになっていて、下には新しい仕事から順番に見れるようになっています。お仕事系は検索機能がめちゃくちゃ大事ですよね。みんなどんな仕事でも言い訳じゃないです。フィルターも保存できるようにするとかいろいろアイディアもっと盛り込めそう。履歴書をアプリ内で作っておいて、セーブして、いつでもそこから遅れるとか。LinkedInとかはもうそんな感じですよね。
背景はこの背景ジェネレーターツールを使いました。なんか最近サービス名に日本語使われてる事多くないですか？それはさておき、このツールめちゃくちゃ使えます！SVGでダウンロードできるからダウンロードした後も編集加えまくれます。ダウンロードする前にも、いろいろ設定変えられまくるので、是非使ってみてくださいー！
関係ないんですけど、オンラインツールで海外向けのCVを作れるオンラインツール発見しました。デザインもクリーンなので、いつかチャンスがあったら使ってみたいです。海外転職狙ってる方は使ってみたらどうでしょう？ぜひ感想聞きたいです！
さて、５０まで振り返りました！細かいところがまだまだだなって感じです。１−２時間で作れるようにやってるので、細かいところまでできないっていう言い訳も実はあるんです。もっと時間かけてもいいけど、多分続かなくなっちゃうと思います。。。
後で振り返ってどこがどうだったか、レビューしてたらいいかな？ｗ
というわけで、ここまで読んでいただきましてありがとうございます。参考になった、なるほどねーと思った方はスキボタンを！なんとも思わなかった方もスキボタンを！では良い週末を〜！
Follow me!
こちらでもいろいろ投稿してます！
Instagram | Twitter | dribbble | Facebook | Vimeo
この記事が参加している募集
無料コンテンツ気に入ってくれたら、☕️一杯分ほどの支援をして応援してくれませんか？コーヒーは私にとってクリエイティブな活動の「元気の源」です😆