【新卒2年目デザイナー】10月後半〜11月の学習記録まとめ
こんにちは、デザイナーのかほです 🎅🏻
BEES&HONEYに入社し1ヶ月が経ちました。
日々本当に学ぶことの連続で、勉強をさせて頂いております…！
また自分の力不足をすごく痛感しているので、今自分が勉強するべきことが何かを理解した上で勉強をしていければと思っています！
それに、noteの勉強記録を始めて半年と1ヶ月になるので、おおよそ半年前のデザイナー1年目後半と比べて、少しぐらいは成長できているできていると信じたいですね…。
さて、今月の勉強内容を記録します〜
- 01 Melvitaの仮想ブランディングの提案書の作成
これに関しては、いつものサイトリニューアルとは異なり、構成や考え方などを社内のディレクターさんのKeynoteを参考にさせて頂き、（非常に難しく内容に関して足元にも及んでいない酷いものですが）ブランディングの勉強をする為自分なりに考え作成したので一部だけ抜粋をして掲載します。今後は仮想サイトリニューアルではなく、ブランディングの提案書を仮想で作成し、アーキタイプから考えられるデザインの方向性や考え方の理解を深めるとともに、先日頂きましたFBのアウトプットとして、ブランドプロトタイプの作成としてグラフィック＆ウェブの勉強を兼ねて進めていくことにしますー！
Melvitaについて
メルビタは、フランスのラゴルスを拠点とするボディ、フェイス、ホーム製品の国際的な小売業者です。同社は1983年にフランスのアルデーシュの農場で生物学者であり養蜂家であるバーナード・シェヴィリアによって設立されました。
ヒアリングができない為、調べて分析したことからブランドのアーキタイプなどを選定し展開をしました。
Brand propositionとDesign ideology、Sitemap、WF（この２点はいつものリニューアルと変わりない独自で考えたものになります。）だけ抜粋して掲載します。
Brand proposition
「Specialist but friendly」・・・Specialistという言葉は、何か特定の分野について素晴らしい知識や技術を持っている人に対して「専門家」といった意味合いで使用することがある言葉です。Specialistでありながらどんな人でも手に取りやすいフレンドリーなポジションを目指します。
Design Ideology
「Friendly for everyone」・・・地球環境に対しても、使う人に対してもフレンドリーであるデザインを意味します。
例えば容器がリサイクルのプラスチックやガラスでできていて、且つ品質を保ち持ちやすく軽いなどの意味でのフレンドリーや、好き嫌いを選ばず誰にでも愛されるような人を選ばない意味でのフレンドリーなど、そういったどちらに対してもあらゆる意味でフレンドリーなイメージを与えるデザインを提案します。
Sitemap＆WF
-02 Meetupのサイトリニューアル
これは今月アップするつもりでしたが、先輩に教えて頂いていく中で今まで自分のサイトデザインをする際のリサーチ方法があまり良い方法ではなかったことに気づき、一つ一つ参考を探し直してちゃんと粘って詰めていきたいので来月良いものにして公開します！
-03 Luccianoのトレース＆分析
これ、めっちゃいいサイトです・・・！ポップで上品かつ大人な印象が少しありつつもLuccianoの可愛らしいデザインのアイスの良さをすごく引き出せていると思いました！
-04 Yosupnovaのトレース＆分析
MV部分のSNSアイコンの見せ方のUIに一目惚れしました。加えて下層ページが良いなと思いトレースをさせて頂きました。私自身赤色をサイトのデザインに使うのが割と苦手なのですがこのサイトは赤色の使い方がかっこよくて良いなと思いましたー！
-05 Voobanのトレース＆分析
Locomotiveさんのサイトです。洗練されたレイアウトなのに、ちゃんとする部分はきっちりとデザインすることにより、アニメーションなども含め、IT企業のイメージがちゃんと演出されていたりなどが素敵だと思いました！
-06 ASMのトレース＆分析
STUDIO DETAILSさんが制作されたサイトです。業界のイメージに合ったきっちりとした表現なのに細部やレイアウトが今風に洗練されており、過剰すぎないアニメーションの中にボタンなどのアニメーションや配置があまり見たことのないデザインで、素敵です！
-07 rockin'on groupのトレース＆分析
QUOITWORKSさんが制作されたサイトです。今まで見たことのない新しいのUIの数々に衝撃を受けこれは分析して学ばねばとなりました、、！ 動作が非常に早くUIも美しく、さらに見やすく使いやすいサイトとなっています！
11月の最後らへんに急に分析をして勉強したいと思う様なサイトが増えて困っていました笑
-08 Blender
↓謎のよく分からなくて少し気持ち悪いものをモデリングしました笑 反省としては、手前のブロックのModifierと奥のサイズ感が異なっているので同じにできる様にしなければいけないと思いました、、あとlightingが何とも下手すぎるのでちゃんと勉強します。
↓こちらはファンタジー感のあるものをチュートリアルを見ながら作成しました。3Dは作成に時間がかかるけど今後需要があったりしそうなので、どんどん勉強していきたいです🦄
-09 軽めのウェブサイト分析
いつもの軽めのサイトレビューです。トレース分析だと時間の関係で好きなサイト全てを観ることはできないのでここではストック程度にメモしています。素敵なサイトが多くて困ります・・😂
- 10 英語
最近新しいPodcastを見つけたので、それも取り入れて聞いたりなどしています。「BBC WORLD SERVICE 6 Minute Vocabulary」というものでSpotifyで聞いておりますが、今まで聞いていたPodcastは1コマが30分前後で長いのに対し、これは短いので気軽に聞けます。英語に限らず何かお勧めのPodcastがございましたら教えて頂きたいです🙏
-11 GoogleDriveのサイトストック
いつもやっているDriveに良いなと思ったサイトのパーツのキャプチャとURLをストックするというインプット方法です！
来月すること
各国のデザイン（デザイン史と思想）についての知識をつける為の書籍ともう一冊、別の書籍を購入したのでそれを読んで理解していけたらと思います。また仮想ブランディングと引き続きBlenderとJS、英語をサブの勉強に設定しつつやっていきます。
上記諸々の勉強に関し、書籍やメディアなどのお勧めがございましたら教えていただけますと幸いです！
✍️ 今月色々なサイトをみて気づいたこと
下記２つは同じ用途で使用されているデザインです。この２つを比較して圧倒的に左のほうが使用しやすく優れているなと思いました。
○ 左はリスト部分全体にマウスオンをすると、「Read」のマウスストーカーが現れそのちょうど右下に固定でサムネが現れます。（右下という位置がマウス操作にちょうど良い）
× それに対し、右側はテキストの上の会社名にだけマウスオンすると、その直接上に画像が現れるため結局どのリストのサムネなのかわからない状態になります。
ホバーで画像が出てくるパターンってこれ以外にもいっぱいありますよね。最近気付いた同じデザインでも少しでも使い方を間違えるともはや画像がないほうが良いのでは？と感じてしまう逆効果なデザインになってしまうのだと気付いたので自分のメモとしてここに記載しておきました！
上記２つのサイトはこちら（実際にみてみると、どちらが良いかすごく体感できると思います！）
ちなみにどちらもすごくかっこいいサイトです 😭
以上になります。
ご覧頂きありがとうございました。
今年もあと1ヶ月なので、年内に少しでも成長しておける様に
悔いのない年末、さらに良い来年が迎えられる様に
頑張りましょうー！！ 🔥🎄
---------------------------------------------------------------------------
SNSもどうぞよろしくお願いします〜！🥳
・イラストアカウント（@the_1998_）
・なんとなく気が向いたら作って投稿する制作用アカウント（@kahosayshello）
Twitter https://twitter.com/kahosayshello
この記事が気に入ったらサポートをしてみませんか？