見出し画像

進化を急げ、トレースせよ新人

(株)アップガレージ テックブログ　IT Lab.

こんにちは、ITソリューション部の新卒デザイナーのHuang（ファン）です。
中国出身で、武蔵野美術大学でプロダクトデザインを専攻し、UIUXデザイナーとして卒業後この会社にジョインしました。

美大卒のひよこデザイナーが意外だった？仕事と学校でのデザインの違い
ひよこデザイナーの自分、主な悩みは「デキる」ようになることですね。
学校で学んだデザインは意外とビジネスのシーンで通用しなくて、0から学ばないといけないことがいっぱいありました。
チーム内の先輩デザイナーの活躍を見て、早く成長したい気持ちが強いです。
落ち込まずに、できることを少しずつ増やせば、任せてもらえる仕事も増えるでしょう！

美大にいた時想像していた社会人の自分vs現実

成長のために、勉強の時間を作るのは。。？

「日々目の前の業務で精一杯なのに、スキルアップの勉強ってとっても時間がない！」の悩みに対する私たちの取り組みは、20％ルールです。
20%ルールとは
私たちITソリューション部独自の「20%ルール」では、「20%の業務時間（8時間 / 週）を自主的な勉強に充てることができる」のです！

私は配属して早々、バナートレースを取り組んでスキルアップを狙いました。
優れたデザインを分析・再現することで、レイアウト、タイポグラフィ、色彩のバランスなど、プロの技術を実践的に学べます。
同時に、自身のスキルの現状把握と改善点の明確化もできます。
では、私流のトレース方法をご紹介します！

バナートレースやってみよう！

具体的な取り組みとして、印象的なバナーのトレース（模写）を行います。以下に、そのプロセスと学びを紹介します：

1/4. お手本の選定とトレースの目標を想定

まず、私は日本語のデザインがやや苦手なので、こちらのカルビーの「文字数が多くても見やすいバナー」を選択！

文字数が多いにも関わらず視覚的に文字のメリハリ、ジャンプ率、全体的なレイアウトが整理されていることに注目しました

2/4. 詳細な観察

単に見るだけでなく、バナーの構造をひとまず分析

例えばこのバナーは3×3のグリッドシステムでレイアウトしていて、文字サイズによる情報の優先順位付け、要素間のサイズ関係なども発見できた

3/4. 実際にツールで作ってしてみよう

Illustratorで実際に模写。
このプロセスで、ツールの使い方も自然と慣れて、知らないうちに身につけるよ！

日本語のキリ、改行などとても勉強になりました！

4/4. 比較と振り返り

完成したトレース作品とオリジナルを比較し、細かな違いや工夫を見出すとともに、自分の改善できる点を特定できる

意外とまだまだ細かいところが工夫されていますね。
例えば「抽選」は、背景の色だけを取るのではなく、アウトラインにしてパスを結合しました。
そうすることで、下の影が見えるようになり、より立体感を出すことができます！

トレースから得た学びと気づき

この取り組みを通じて、以下のような気づきがありました：

  • ゼロから作成することで、バナーに隠された様々な工夫が見えてくる

  • 手を動かし、考え続けることの重要性

  • 自分の普段の制作方法と比較することで、新しい発見がある

  • ツールの使い方も知らないうちに上達する！

今後の展望

この経験を踏まえ、今後も20%ルールを活用して様々なデザインスキルの向上に取り組んでいきたいと思います。次回は別のお題でチャレンジし、その成果をまた報告させていただきます！

最後までお読みいただきありがとうございました。

株式会社アップガレージグループ ITソリューション事業部では、
共に勉強し合い、成長し合うメンバーを大募集しています！

チームメンバーを詳しく知りたい方はこちら

Webエンジニア・UI/UXデザイナーの採用はこちら

過去のはてなブログはこちら


いいなと思ったら応援しよう！