見出し画像

DailyUIに1ヶ月チャレンジしてみた Vol.2

皆さんこんにちは!ホマレです。最近暑すぎて汗っかきの私は日々パソコンの熱と闘っています(じわじわと迫りくる熱…)そんな私ですが、7月28日からCocoda!さんが企画されている「DailyUI」をやっています。今回は2週目です。Twitterにあげたものをここにまとめていきます。

DaylyUIとは?
「DailyUI」とは、Cocoda!が運営している「毎日お題に沿って制作することで、UIデザインが学べる無料の学習サービス」です。
現在お題数はなんと50個。お題ページには、ターゲットをイメージしやすいようハッシュタグでキーワードを表示。参考アプリや制作に詰まったときのためのヒントもまとめられています。「何から始めたらいいのか分からない…」そんな初学者にありがたいサービスなのです。


今回の目的は、
・figmaの操作を身につける
・ターゲットを意識した制作を学ぶ
・UIデザインについて知る
・グラフィックスキルの向上
の4つです。

転職活動を続けていくうちに、「グラフィック寄りのことがしたい」「でも自分の制作スピードでは遅すぎる」と考えたことがきっかけでした。

特に遅いと感じたのは、ターゲットについての情報収集や分析をしていく部分。「この方向で進めていこう」と決めるのに時間がかかっていました。イメージを具体的な形にしていく部分についてもスピードが遅いと感じていました。それを踏まえてルールは以下のように設定しました。

今回の制作ルール
・バナートレースの時と同じく、1週間に4回制作できればOK。
・まずは1ヶ月間やりきる。
・毎回「この部分について深く学ぶこと」を決めてやっていく。
・【途中で追加】リンクして遷移するページの洗い出しは手書きで良い。
・【途中で追加】自分で調べてどうしても分からなければ質問する。
・【途中で追加】アプリのタイトルやコンセプトは求められていなければ、詰めなくて良い。


2周目に入って「0 から作るとなると、時間がかかってしまう…」という悩みからガイドラインを改めて読み込もうと考えていました。

そんな時、ムツミさんのnoteにUIデザイン初心者向けの記事がまとめられていたので初日はこれを読んで、Cocodaの「はじめてのUI」に取り組むことにしました。

8月3日(月曜) はじめてのUI ※急遽、基礎を学ぶ

UIデザインの基礎に関するコンポーネントの使い方や配色についてまとめられており、制作中に困ったことがいくつか解消されました。これからやる方はこちらから取り組むと良いかもです!(おすすめ!)


Day5 天気予報アプリのアイコン

今回はスマホアプリのアイコンデザイン。これも全くやったことない領域だったので、アイコンサイズや角丸の半径なども調べて制作に入りました。

この辺りで「リサーチもしっかりしていかないと目的がぼやけたアプリの企画になってしまう…!」と感じ、一般的な「天気予報アプリ」に必要な要件と、ターゲットの情報から希望の要件をノートに書き出しながら制作することにしました。作業時間は約5時間。うち実制作時間は約2時間。

その後、Cocodaにもガイドラインのコンテンツがあると知ったので制作前にやってみることにしました。

Cocodaのコンテンツでは、ガイドラインの解説記事もあり、とても読みやすくなっていました。こちらのスライドの内容や解説記事を参考に、自分のNotionにまとめて定期的に更新されたらまとめ直す、といった学習方法に落ち着きました。


Day6 音楽アプリの再生画面

今回はガイドラインから分かった、「必要な項目を最小限に絞り込むこと」「必須要件のコンポーネントは押さえること」を中心に調べながらやっていきました。作業時間は約4時間。うち実制作時間は約2.5時間。

ここにきて、参考サイトの共通項を探ってこの機能は必須かな?と考えるようになりました。最低限必要な機能を持たせた後に、付加価値として追加する機能は何かを考えるようにしていました。

【参考サイト】


Day7 デリバリーアプリのリスト画面

MaterialDesignの「Color Tool」を上手いこと使えていなかったので、参考文献を頼りに使い方を習得することを目的に取り組みました。作業時間は約5時間。うち実制作時間は約2.5時間。

参考にしていた「認知パターンから考えるesaらしさのデザイン」の記事から「配色をデザイン原則から決めている」ことを知り、真似て制作しました(使いこなすのはまだまだ先になりそうです…)完全に真似ることはできなくとも、サービスの目指すところを言語化する時に、「バランス感覚の言語化」の部分は使えると思いました。

【参考サイト】


今週のDailyUIを終えて、ガイドラインは大事だなと実感しました。0から作る時にベースがある程度決まっているだけでも、制作時間にかなり差が出ました。

あとはWebデザインでモバイル画面を作る際にも、ガイドラインを参考にすることがあるのでこの機会に見方を身につける機会があってよかったなと思いました。

周囲の方に参考記事を教えていただいたり、Cocodaのコンテンツで自分だけでは探すことができない参考文献に出会い、より学ぶことが面白くなっていきました。今後はさらにデザインの考え方の例についても知っていきたいと考えています。

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

習慣にしていること

この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
わーい!ありがとうございます(*´ω`*)
6
デザイナーを目指して勉強中の29歳。 好きなものは、ゲーム/猫/コーヒー/声優。趣味はボードゲーム/読書/写真 もくもく会を始めた頃のブログはこちら(https://kichijoji-coworking.hateblo.jp/

こちらでもピックアップされています

DailyUIまとめ
DailyUIまとめ
  • 3本
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。