DailyUIまとめ:#001〜#010
さて、7月の初め頃にDailyUIを始めたのですが、やっと10個作り終えたのでまとめたいと思います!
全然毎日続けることできなかった😅けどマイペースに進めていきます!
以下のソーシャルにもまとめてあります!
tiwtter:https://twitter.com/i/moments/1016678861436698625
dribbble:https://dribbble.com/tsubasa_sris
#001
画像を使ったページを作ってみたかったので、こんな感じにしました。
シンプルだけどわかりやすく、を意識しました。
ロゴもちゃんと作りたかったけど時間かかりそうなのでやめました…
#002
これはリサーチに時間かかってしまいました…
他のdailyui見てると、クレカ情報入力して即購入!みたいな感じ多いけど、購入完了までのステップを視覚的にも操作的にもわかりやすくしました。1回クレカ情報入力したら、次からはそのカードを選択するだけ、みたいになると良さそう〜
#003
基本的にスマホ縛りで行こうと思ったんですが、PCにしちゃいました😅
最初は映画のLPにしようとしてたけど、最近練習したイラスト作成の成果をLPに載っけてみた!LPのファーストビューでどう見せるか、というのが肝な感じするのでもっと実用的なのも作りたい。
#004
ひねりづらくて難しかったので無難にしました。
昔デコ電卓みたいなアプリ誰かが使ってて、色変更できたの楽しかったから🎨ボタンをおいて見ました。個人的に計算結果を共有することがあるので、共有ボタンを設置。
#005
HIGにあるように、「見ただけでアプリの概要が伝わる」を意識してシンプルなものを目指しましたが、よくわからなくなりました…
逆になんのアプリだと思いますか…
#006
普通のプロフィールから少しひねりたかったので、動物のプロフィールにしました!実際にあるアニマルシェルターのサイトを元に画面を作りました。情報がたくさんあるので、見やすいように且つビジュアルでも興味を引けるようにしました。固定ボタンってアプリだとあまり無いかな、、
#007
ゲームの設定画面にして見ました!Life is Strangeが好きなのでトレースみたいになってしまいましたが、ゲームの世界観を壊さない設定画面を意識しました。 BACK
は親指が届きやすい右下に。
#008
あえて404
と書くのはやめて、ページがないことをテキストで伝えました!(404とは?となる人もいると思うので)
ナビゲーションバーとフッターは残して、迷子になっても帰れるようにしました。ブランディングも意識したデザインにしました。
#009
appleのmusicアプリとspotifyを参考に作りました。2つとも結構最適化されてると感じてしまっているので、代わり映えしない感じになってしまった、、けどスピーカーなどに繋げるアイコンを左上においたり、サビだけ聞きたい時があるので、音楽の盛り上がりを可視化したりしました。歌詞もすぐ表示できるようにしたり、深い階層に行かないで色々できるよう工夫しました。
#010
アプリのシェアといえば、デフォルトのアクションシートが多い印象ですが、カスタムのシェア画面を想定して作りました。何をシェアするのかわかりやすくするため、イメージを置きました。sptify、youtube、airbnbを参考にしました。
以上が#001〜#010でした!!
結構一つ一つに時間かかってしまっている(お題が広いと題材を決めるのにすごく迷ってしまう)ので、もっとサクサク50目指して頑張ります!