こんにちは！ぎぼんぬです🐿
今回は、UIの基礎的な知識を習得するために私が始める取り組みについてのnoteになります✍️

なぜUIに特化して学ぶことにしたのかの・具体的にどうやって学ぼうとしているのか、について今回はお話します💭

なぜUIを学ぶのか

なぜ今回学ぶテーマをUIにしたのかは、業務上その知識が必要な部署に移動したからです。

というのも、これまでは全社的な資料（noteのサムネやセミナーのバナーなど）のデザインに携わってきたのですが、昨年の11月末に開発チームの一員になり、プロダクトデザインの仕事にも領域を広げることになりました！

当時は「新しいことが学べる！嬉しい🤩」の気持ちと同じか、それ以上に「figmaの使い方すら全然よくわかってないけど、そんな状態でチームに入って大丈夫なんだろうか？」という不安がありました。

プロダクトチームに入って

移動した当初は開発のこともエンジニアの人達が会話している内容も全然分かりませんでした。。。皆が今話をしていることはどういう内容なのか、プロダクトってどうなっているのか、といったことを学ぶので当初は精一杯に毎日です😇

今では、チームの取り組みの全体像やプロダクトの概要などを徐々に理解できるようになってきました。デザイナーの先輩たちのサポートを受けながら、作ったものや考えたデザインの壁打ちをさせてもらいながら仕事を進めています👨🏻‍💻
最近やっとfigmaの操作方法を覚えてきて制作スピードをもっと上げたいな〜と思っている状態です。

見えてきた課題

業務にもちょっとずつ慣れてきて、改めて自分が不足しているスキルや課題も見え始めてきました。その1つが、基礎的なUIの知見不足です。

デザイナーの先輩にサポートしてもらうとはいえ、主体的に進めていくのは自分自身です。なので、デザインのアウトプットを出すことと同じぐらい「なぜこのデザインにしたのか」の理由と共にエンジニアなどのチームメンバーに共有しなければなりません🫥

その際に「なんとなく」ではなく、例えば「他社の事例では〇〇の理由で□□だから」「この動線の場合は〇〇だから、ここに□□を配置するのが適切」など、きちんと説明できるようになりたい！と思いました。

ですが、私はまだそのように説明できる知識や事例などを持ち合わせていないので、なかなかそれができないのが現状です🫠

UIの基礎的な知識や事例の情報が自分の中にない、という課題を克服するために今期は「UIを学ぶ」をテーマに取り組んでいこうと決めました💡

具体的な方法

どこから情報を得るのか

とはいえ、UIの基本的な情報や、今主流とされているやり方をそもそもどこから学ぶのか、そういったものの総称に名前があるのかもわかっていませんでした。

それをデザイナーの先輩に相談したところ、appleやGoogleなどデザインのガイドラインを公開してることを共有してもらいました！
具体的な参考ページは以下になります。

▼Apple : Human Interface Guidelines (HIG)

▼Google : マテリアルデザイン

そこで、マテリアルデザインやデザインガイドラインという言葉を知ることができました。

どのように学習するか

上記に記載したサイトから学ぶといっても、これらのサイトはあまりにも情報が膨大すぎました🤯学ぶ領域が広すぎると、実践で自分が学んだことが生きたかどうかがわからなくなるのでは？と考えました。

なので、今回はまずGoogleのマテリアルデザインの中からプロダクトに関わる領域を学ぶことに決めました！
なぜappleじゃなくてGoogleにしたかというと、HIGはappleのOSに則したテーマの話が多い一方で、GoogleのマテリアルデザインはGoogleの製品・サービスに使用を限定していないため汎用的に使えるのではと考えたためです。

具体的には、マテリアルデザインっなに？（概要・目的）の理解ののちに、今プロダクトで使っている（スライダーは使ってないけど、カードは使ってる、とか）デザインを学ぶようなイメージです。

そこから得た情報を、自分なりにアウトプットを作る予定です。これからデザインを学ぶ人や、デザインの知識が分からない人でも簡潔にわかるようなアウトプットにできればと考えています🫶
今考えているのは、noteやスライドなどでまとめる方法です。

次月のnoteは、実際にこの取り組みを行って見えてきた途中経過（うまくいったかどうかも含めて笑）を共有します！

最後まで読んでいただき、ありがとうございました💛
また、次回の結果報告をお楽しみに！👼🏻