# 20241212_アドカレのサムネを作りました！
(例：20210901_LT会を開催しました)
###### tags: `ブログ記事`

- [ ] 公開（ブログ公開担当者がいじるやつ）

太字斜体で書いてある内容を埋めて行ってください．
文章，画像は太字斜体の下の行に入れてください．
最初に書く時はREADMEを読んだら読むといいと思います．

<br>

## 表示されない情報
***書いた人の名前(自己紹介文と同じ名前)***
{
ゆめみん
}

***記事の簡単な説明(検索した時にタイトルの下に出てくる文章)***
{
2024年のNUTMEGアドベントカレンダー用に作ったサムネイル画像を振り返ってみたいと思います！使用ツールはibisPeint,Clipstudio,Figmaです
}

<br>

## 表示される部分
***サムネイル画像***
{

}

***カテゴリ***
以下の中から該当しそうなカテゴリを選択してください
※一つだけ選択してください
- [ ] 対外活動
- [x] 活動の様子
- [ ] メンバーの趣味
- [ ] 実務訓練体験記
- [ ] NUTMEG Advent Calendar 2023

***タグ***
以下の中から該当しそうなカテゴリを選択してください．当てはまる物がない場合は適宜追加してください.
言語
- [ ] HTML
- [ ] CSS
- [ ] Python
- [ ] Go
- [ ] Ruby
- [ ] JavaScript
- [ ] TypeScript
- [ ] Dart
- [ ] Rust
- [ ] Kotlin
- [ ] Swift

フレームワーク・ライブラリ
- [ ] Ruby on rails
- [ ] Vue.js
- [ ] Nuxt.js
- [ ] React.js
- [ ] Next.js
- [ ] Gin
- [ ] Flluter

ツール
- [ ] GitHub
- [ ] ターミナル
- [ ] WSL
- [ ] Ubuntu
- [ ] Docker
- [ ] Raspberry Pi
- [x] Figma

分野
- [ ] チームづくり
- [ ] フロントエンド
- [ ] バックエンド
- [ ] インフラ
- [x] Web-design
- [ ] API関係

---

***以下に本文を記載してください***
# 自己紹介

はじめまして！皆がゆめみんと呼んでくれるのがうれしいので、ゆめみんという名前でブログを書かせていただきます！
NUTMEGには今年の春から参加しました。現在はデザインチームとHPチームに所属しています。

1と2が整列している面白い日のアドカレ担当になれてうれしいです。よろしくお願いします。

# サムネイルを作りました！


サムネイルとは、一番初めに出てきたこの画像のことです。
メンバーが使っているこの画像ですが、私が制作を担当させていただきました！ありがとうございます！！
とても楽しく作らせてもらったので、ラフ画像と完成画像を比較しながら、作ったサムネイルの振り返りをしてみたいと思います！

## 経緯について
サムネイルテンプレートを作るにあたり、いくつか候補があった方がいいと思い、複数の案を考えました。
**クリスマスや冬をモチーフに**とのことだったで、他のブログのサムネイルやクリスマス商品の広告の配色を見るなどしました。
初めは、NUTMEG内のデザインチームMTで候補を１つに絞る予定でしたが、チームのみんなが
**「どれもいいねえ」**
と言ってくれて、さらに私の時間的にも余裕があったため、複数のデザインのサムネイルを作ることに決めました（みんなありがとうね！！！）

# サムネイル紹介

以下から、作成したサムネイルの紹介をしていきます！せっかくなので名付けも行ってみました。

## No.1　サンタぼうしアソート

ラフ（使用ツール：ibisPaint）

完成品（使用ツール：Figma）

サンタさんの帽子が画面下に見えるシンプルなデザインです。NUTMEGのイメージカラーのオレンジの帽子が混じっているところがアクセントになっています。
このサムネイルでは、今まで使ったことのなかったFigmaのコンポーネント機能を使ってみました！

コンポーネント機能とは、簡単に言うと、複数のオブジェクトの色や大きさを一括で変えることができる機能です。

今回は、上記画像右端の枠外によけてある帽子をコンポーネント（親）に設定し、画像内の帽子をインスタンス（子）に設定してみました。この帽子を変形させると......

こんな風に全てのインスタンス帽子に変形が適用されました！パンクな帽子に変身ですね。
コンポーネントの機能は奥が深く、まだまだ使いこなせていないので、これからいろいろ勉強していきたいです！

## No.2　クッキーアソート

ラフ（使用ツール：ibisPaint）

完成品（使用ツール：Figma）

ラフから少しデザインを変更しました。理由としては、大きなモチーフが多すぎて目が散らばる感じがしたためです。また、色味も少し鮮やかにしたりと、変更点が多いデザインとなりました。
個人的に、全体的なブラウンの中に鮮やかな赤や黄色がポイントで入ることにより、全体が引き締まった感じがしてよいのではないかと思いました。

このような色彩の設定は感覚でやってしまうことが多いので、少しずつ論理も考えながら作っていけるようになりたいです。

## No.3　ゆきだるまリース

ラフ（使用ツール：ibisPaint）

完成品（使用ツール：Figma）

個人的に一番気に入っています！
背景が赤色なのに加え、全体的に使用カラーが多めなので、一つ一つのカラーの彩度を落としてお互いが邪魔しあわないように気を付けました。線の端に●をつけたり、全てのオブジェクトが丸みを帯びていることにより、統一感が出ているのではないかなと思います。

背景の薄い赤い円は製作途中に挿入しました。三角形の余白が開いている気がして、少し違和感を感じたためです。


なんとなくこんな感じの円をイメージして、邪魔にならないような色で挿入しました。

## No.4　わくわくクリスマスイヴ
ラフ（使用ツール：ibisPaint）

完成品（使用ツール：Figma）

サンタさんへの手紙と靴下のモチーフで制作してみました。手紙が立体的に見えるように、影の色を工夫しました！


この雪の結晶は、両端を四角にした線のオブジェクトを回転させ、重ね合わせることで簡単に作ることができました。

## No.5　夜空とサンタさん
ラフ（使用ツール：ibisPaint）

完成品（使用ツール：Figma）

夜の空を駆けるソリのシルエットがポイントです。
サンタさんたちは、図形を組み合わせて作りました。Figmaを始めたてのころにソリ図形の変形に悪戦苦闘していた時と比べて、かなりスムーズに形を作れるようになってきてうれしいです。

## No.6　寝落ちサンタさん
ラフ（使用ツール：ibisPaint）

完成品（使用ツール：Clipstudio/Figma）

デスクの上で寝落ちをしてしまったサンタさんです。お疲れだったのですね。
このサムネイルは、ラフの手描きの質感をそのまま活かしたかったため、サンタさん周辺のみペイントソフトで制作し、Figmaで右側の吹き出し部分を追加しました。サンタさんのお鼻がかわいいと思います。

# 制作を通して

サムネイルの制作を通して、個人的に自分のスキルの再確認ができたと感じます。
基本的なことになりますが、画像の変形やプラグインの導入の仕方、ショートカットキーなどはある程度使えるようになったと感じました。４月の頃と比べて成長を感じられ、うれしかったです。

反対に、コンポーネントの機能など、私がまだ使ったことのないツールがたくさんあるということも分かりました。この後、テキストボックスなどを入れてテンプレート化したサムネイルの編集ページを先輩に手直ししてもらったのですが、大幅な改善がされており、自分の勉強不足を実感しました。

個人的な反省はたくさんありますが、**なにより自分が作ったものをみんなに使ってもらえたことが本当にうれしかったです！**
まだまだ大初心者ですが、デザイナーとしての喜びを感じることができて、貴重な経験となりました。
これからも、よりよいものを作ることができるように、勉強と実践を繰り返していきたいと思います。

最後に、夜中まで作業するトナカイさんをおきます。ここまで読んでいただきありがとうございました！！