SOP（ノード）のアイコンを作ろう計画

こんにちは　Alidadeです。
今日はホリデイシーズンのなか日にさしかかっています、１１日ですね🎄

こんな感じの任意のノードアイコンを作りたいです
---
![Icon00000.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/9ffe0efd-d62e-8937-0402-c91e602d0103.png)


今日はノードの中心に置かれるアイコンを.svgで作って指定します
---
>.svgを扱えるソフトなら何でも大丈夫ですが今回は他のソフトとの連携となります。


__あっ　こんなところに作りたてのHDAがありますね__
![Icon01.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/7b3f6d4c-9f14-6b98-d59c-b41e9e753290.jpeg)
__それを右クリック__　+　__show in Asset Manager__　します
![Icon02.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/ca01cf6c-8a21-f10e-151f-12e024efe8ad.jpeg)
出て来たAssetManager側のHDAのメニュー上で　__右クリック__　→　__TypePropaties__　で
オペレータータイプを決めるメニューを出します
![Icon03.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/5ba71914-6cb3-8045-4771-c317e8d63b74.jpeg)
　__②__　の下にある　__小さなアイコン__　を押してから　__.svg__　を選び始めましょう
こんな感じ↓でHoudiniは　__.svgの表示もサポート__　しているので中にどんなアイコンが入っているのか探しやすいです
![Icon04.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/44050460-8580-8eb0-1c0a-5ecbf22c42a2.jpeg)
これらの.svgが格納されている場所を探します。
大体は　__インストール時に入れたドライブの中__　にあり
![Icon05.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/7624f34f-e320-9082-1800-354a7cea029f.jpeg)
この環境の場合は　__Program Files__　の中の
\Side Effects Software\Houdini 19.5.368\houdini\config\Icons\icons.zip
に該当します。

__icons.zip__　を　__別のドライブにコピー＆ペースト__　してから解凍します。
どのアイコンでもいいのでそこからファイルを　__複製__　してイメージを膨らませて行くので

今回はkinefx-motionclipposeinsert.svgをIllustratorで　__開いて__　みましょう
![Icon06.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/4369bbe5-8196-9526-73d6-2f9e7a657062.jpeg)
アイコンの大きさが　__48×48__　ですがそのサイズを変えずに虫眼鏡などで
__拡大__　した後、　__削除__　しておきます。

Houdiniをもう一つ立ち上げて　早く戻ります
![Icon07.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/6e9a4a41-0a41-a838-d2a4-279fa5cb3cca.jpeg)
アイコンにしたいオブジェクトのあるシーンファイルを開きます。

__PrintScreen__　ボタンを押してスクリーンショットを取り　画像処理ソフトに持っていきます。![Icon08.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/8b010c9b-1787-e8d8-6687-31fa001f5055.jpeg)

自動選択ツールで黒の部分をアルファにしたら、オブジェクトを選択して　__ctrl+C__
![Icon09.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/572afd7f-b526-aab2-0a56-66ba9cbbac61.jpeg)

Illusratorに持って行きペーストしたらObject→ImageTrace→Makeで絵からパスに変換します。
![Icon10.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/b02e45a7-bd4d-749e-de64-754ccb5f28ad.jpeg)
お好みのスタイルにあわせて紫色の四角の中のメニューを選び、
![Icon12.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/e6b9d3dc-7710-0298-8511-55884d773fe3.jpeg)
Expandボタンを押して決定します。
![Icon13.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/668840b9-6aad-683c-5831-0e3edf8d94da.jpeg)
キャンバス内に縮小して　
何かいい感じにしたらこのアイコンを保存します
![Icon14.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/07939db4-b331-d2b4-d7b2-2c2073933397.jpeg)
上書きしたくない場合は名前を変えてください
![Icon15.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/5fb3959f-63e1-3724-4312-f777adb7f9b1.jpeg)

__Choose　Icon__　に戻って先ほど　__保存したディレクトリを探します__
zipを解凍した自分のローカル内で探したらこんな風に見えているのではないでしょうか

![Icon16.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/fd190566-36dd-d1b4-770a-fdead0355c31.jpeg)

自分で作ったアイコンを　__Chooseしアクセプト__　したらこの作業は終わりです
![Icon17.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/609f7844-4e03-ea0a-135f-d12b78ad3df7.jpeg)
イメージが違う事があり易いと思いますが　その時はバリエーションを取ったり巻き戻りも視野に入れてみましょう・・
![Icon18.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/7666ce9c-150b-b13a-cb30-5024822c34a1.jpeg)
なんとなくビューポートからショットを取ってアイコンにしてしまうので　小さくしたとき

__Windows→Hscript__　で　__Textport__　を出して　__glcache -c__　を打ちながら読み直したりすれば
.svgの　__キャッシュイメージは挿し変わる__　のでアイコン制作時に役立てて見てください。
![Icon19.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/847445/34c971bb-5bb4-28c5-5516-415f7480267d.jpeg)

今日は.svgを作ってアイコンのイメージを差し替える記事でした。
環境として　__2バイト文字のデータが内部に入らないように警戒した方が良い__　かもしれません

・出来上がったアイコン付きHDAファイルはこちらになります
https://bowlroll.net/file/290846

・こちらは作中で作られた星型のスパンコールのHDAとなります
プロシージャルに作られているのでダウンロードして確認してみる事をおススメします
https://www.orbolt.com/asset/Alidade::Sequin_Star::1.0

Merry Christmas!　Have a good Christmas season!