見出し画像

初心者のUIデザイン勉強📝(毎日UIトレース練習30日間~)

最近UI・UXデザインの勉強を始めました!

私はこれまでグラフィック系の勉強をすることが多く、UIデザインについての知識が全くなかったため、まずは少しずつでも触れていくことが大切なのではないかと考えました。
大学の授業で軽く触れたことはあったものの、科目としては無かったため独学で勉強していますが、とても難しい…

本当にまだまだ勉強不足ですが、記録としてこのnoteにまとめてみたいと思います!
何かのお役に立てたら幸いです…



最初にしたこと

こちらの本を読みながら見よう見まねで、昔軽く設計を練っていたアプリのプロトタイプを制作しました。

アプリが基本的にどのような構造なのか、figmaの使い方など、分かっていないことが多くてあまり自信が無いので、もっと練り直したい…

UXデザインの勉強にももっと取り組みたいです
ユーザー目線がとても難しくて、グラフィック系とはまた違った視点を持たないとなと思いました
デザインリサーチも勉強したいです

夏休み期間中に始めたこと

毎日UIトレース練習を始めました。
基本的にアプリのホーム画面をトレースして練習しています。
毎日1〜2時間ほどで取り組んでいます。
最初は3時間にもなっていたように思いますが、30日以上続けた今は1時間ほどに短縮されてきました…!

合宿中は中断してしまいましたが、それ以外はなんとか続いています…!

2024年8月15日 UIトレース練習1日目

実際にあるアプリのレイアウトの共通点や、それぞれの工夫を知りたかったので、見かけることが多かったUIトレース練習を始めることにしました。

ギャラリーサイトとしてUI Pocketが有名だと聞き、そこからスクショをダウンロードさせていただき、トレース練習を行うことにしました。

UI Pocket
フロー

UI Pocketはフローごとにスクリーンショットが揃っているので、初心者ながらもアプリの機能や構造の分類の仕方について知ることができました。

◇14日目~

2024年8月31日 UIトレース練習14日目

初めはスクショの文言までそのまま再現していましたが、
実際に入る言葉が短くても、長くても、システムとして動作する事を心がけるために(html・cssなど意識)、途中からは「ここに○○が入る」といった文章にするようにしました。

また、途中まではUI Pocketにあるスクショをそのままトレースしていましたが、ユーザー体験ということを重視するUI・UXデザインにおいて、そのまま受け取るだけではダメだと思ったので、
実際に自分のスマホにインストールして触ってみる→記録としてスクショを撮る→トレースに変更しました。

そうすると、これ面白いアプリだな~普段も使おうかな!と思うことが増えました。やっぱり、実際に触る方がユーザー目線に立てるので良い面・悪い面が分かりやすく、良いと思います。

◇25日目~

2024年9月14日 UIトレース練習25日目

▲このUpmindというアプリ、UIデザインも洗練されていて綺麗なのですが、機能としてもカメラに指を当てると心拍数を測ることのできる、デザイン面も機能面もとても凄いアプリです!ぜひインストールしてみてください!

自分の身の回りの知っているアプリをトレースしてきましたが、このあたりで勉強元のアプリをどれにするか迷うようになりました。
私の知らないアプリでなおかつ、UI・UXデザインに優れたアプリを知りたいと考えて探したところ、グッドデザイン賞を受賞したアプリがヒットしました。

賞を取ったアプリには、あまり知らないアプリが多かったですが、その分どれも面白そうなアプリだと感じました!
私は今大学生だから、その分知っている・使うアプリは大学生向けのアプリですが、
このように捜索範囲を広げることで自分と違うターゲット層・ユーザー像に向けたアプリを見つけることができ、視野を広げられたのではないかと思います!

グッドデザイン賞 受賞ギャラリー

私のおすすめは、この受賞ギャラリーで
「スマートフォンアプリ」「スマートフォン向けアプリ」と検索をかけることです!

たくさん素敵なアプリが発見でき、とても面白いです!制作した企業名も確認できるので、この企業はこんなアプリを作っていたんだ!すごい…知らなかった…と思うことが多々あり楽しいです

◇30日目~

2024年9月19日 UIトレース練習30日目

このあたりで、「もう30日目になるのに、形を真似ているだけになっていないだろうか?ちゃんと意味を持たせられているのだろうか?」と迷いが生まれてしまいました。
そのため、30日目からは使われている色を3色、実際にアプリを使って感じた点を箇条書きでまとめることにしました。

アプリごとの色など、アプリの目的・ユーザー像に対するアプローチの仕方の違いについて頭の中で整理したかったので、以前よりは勉強になっているかな…と思っています。

◇現在(34日目)

2024年9月23日 UIトレース練習34日目

この毎日UIトレース練習を通して、Figmaの使い方や世の中にあるたくさんの素敵なアプリを知ることができたと思います!

それでも、まだまだ足りていない部分が多いので、これからも勉強を頑張っていきたいです!
特にUXデザインについてや、実際に自主制作としてオリジナルのUIデザイン、プロトタイプの作成にまで取り組むことができていないので、その点も重点的に調べて、練習したいです!


ここまでお読みいただき本当にありがとうございました🙇‍♀️💝


この記事が気に入ったらサポートをしてみませんか?