前回UIデザイナー向けのUnity画像の更新および、
GitHubへアップロードまでの一連の作業フローについて解説しました。
今回はUIデザイナーの基本作業、「画像の追加、更新、削除」の
「削除」 にフォーカスします。
ものづくりをしていると、削除ってよく発生 します。
最初は仮画像を使って開発をしていき、
そのあとで本番の画像に差し替えます。
差し替えることなく不要な画像 も発生し、
つまりそれがゴミ画像となるのです。
ゴミ画像、ゴミファイルは 事故の元 なんですよね。
基本的に 必要なものだけをUnityに残しておきたい ものです。
そこでゴミ画像を消せるようになるべく、
画像の削除フローについて解説していきます。
本記事は実践ベースなので
削除するだけでなくGitHubへの
アップロードも含めた解説です。
git操作にはSourcetreeを使います。
まだ使ったことがない方はコチラをどうぞ。
👉DOTweenの教科書を読んでUnityアニメーションをプログラミングしてみよう!
Unityで画像削除前の3ステップ
このシリーズを読んでいる方はおなじみですが、
Sourcetree を使って作業前に環境の最新化をします。
- フェッチ
- プル
- ブランチ作成
作業の前準備については以前の記事で詳しく解説していますのでどうぞ
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_0](https://i.gyazo.com/01bbc7b9ef2c7f4517e7bc730a493a20.png#674__500)
このように前回使用したブランチ
feature/update_image
をプルで最新化しました。 ![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_1](https://i.gyazo.com/0a1300905c90689e991e3e3393c579d9.png#244__54)
origin/main
ブランチと同じ行にあるということは最新状態であるということです。
今回は画像の削除なので、ブランチ名を
feature/delete_image
とします。
今回は 新規でブランチを作成しない方法 を紹介します。
ブランチはリネームでOK
基本的に1つの作業が完了したら、
(本流ブランチいマージされたら)
作業ブランチは不要 です。
残しておいてもあまり意味はありません。
そこで新しい作業をするときに
使い終わったブランチをリネームして再利用 します。
つまり、feature/update_image
を
feature/delete_image
にリネームするのです。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_2](https://i.gyazo.com/2f9155ab30cfc09bcac7efa531fed659.png#676__500)
- ① : 左サイドバーの
update_image
を右クリック - ② : 名前を変更 をクリック
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_3](https://i.gyazo.com/73026bf0468457d3ea4d011f57ed5cff.png#466__348)
リネーム後のブランチ名 を入力して
OK ボタンをクリック。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_4](https://gyazo.com/2c772362b218d4d2eafcb818cb80520f.png#674__500)
リネームが完了しました。
ブランチを新規で作成するよりリネームしたほうが
不要なブランチが発生しない ため好きです。
これで作業前の準備は完了、
Unityから画像の削除作業に移ります。
プロジェクトから画像を削除する
作業自体はかんたん。
画像ファイルを選んで削除 です。
今回削除する画像はAssets/Images/image.png
。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_5](https://i.gyazo.com/bbe740c7b70ba3686b7e6e72c9d302db.png#750__357)
プロジェクトから
画像を選択 > 右クリック > Delete
で削除されます。 または、画像を選択して
ショートカット⌘ + deleteキー
でも削除されます。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_6](https://i.gyazo.com/0bb23487798d08f5b0d4bc123704e52c.png#559__204)
このように画像は削除されました。
Unityでの作業は以上です。
とてもかんたん。
Unity作業後のSourcetree作業
削除した内容を記録(コミット)していきます。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_7](https://i.gyazo.com/5530507dec16f3d5af9254618a1eb81e.png#674__500)
- ① : 上部 コミット ボタンをクリック
- ② : 作業ファイルにチェック
- ③ : 作業内容 の入力
- ④ : 右下 コミット ボタンをクリック
このあたりは以前の記事と全く同じです。
削除したmetaファイルもちゃんとコミット対象にしましょう。
(metaもセットで削除されます)
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_8](https://i.gyazo.com/c1f21b9d5285f63ba6c6eb6ba4575384.png#674__500)
このようにコミットが完了しました。
コミットしたら プッシュ でしたね。
プッシュしていきます。
(プッシュとはアップロードのことです。)
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_9](https://i.gyazo.com/940aea9e6f579ca99a17e38b4c16f4da.png#674__500)
プッシュ ボタンクリック。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_10](https://i.gyazo.com/505714f077cba09a39ddd973afdbe34c.png#500__220)
- ① : アップロード(プッシュ)したい ブランチ にチェック
- ② : OK ボタンをクリック
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_11](https://i.gyazo.com/2c3d892b86785bcb6480c3f8038a7eed.png#674__500)
feature/delete_image
→ origin/feature/delete_image
このようにorigin/
がブランチ名の先頭につきました。
GitHubにアップロードされたという意味です。
つまり 自分の削除作業が
GitHubにアップロードされた ということです。
プッシュが完了したら、
GitHubでプルリクとマージ です。
本流ブランチに自分の作業が取り込まれて初めて全作業完了。
基本的に以前の記事と同じですが 少しだけ簡単な方法を紹介します
1ステップでプルリク作成
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_12](https://i.gyazo.com/226189c800e9e92acc61003f79820b86.png#731__500)
GitHubのページにある、
緑色の Compare & pull request ボタンをクリックします。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_13](https://i.gyazo.com/e7e80c5c092409ed160b37fb5fbf9ac1.png#750__489)
するといきなり プルリク作成確認画面までスキップ できるのです。
Create pull request ボタンをクリック。
![【基礎その3】UIデザイナーがUnityから画像を削除してGitHubへ反映する方法_14](https://i.gyazo.com/2412b623f82c0075e3af2e5216aed443.png#750__368)
するとプルリクは作成されます。
以前の記事と比べるとすごく楽ができました。
あとはチェックする人にプルリクページのURLを送ってチェックしてもらい、
マージされれば完了です。
プルリクやマージといった言葉の意味がわからない場合はコチラがオススメです。
まとめ : UIデザイナーがUnityから画像を削除してGitHubへ反映する方法
記事の内容を簡単にまとめます。
- 画像の削除はUnityプロジェクトから削除するだけ
- metaファイルも削除される
- 削除した画像、metaファイルどちらもコミットする
こんな感じです。
3回にわけてUIデザイナーの
基本作業を実践ベースで解説しました。
- 第1回 画像の追加編
- 第2回 画像の更新編
- 第3回 画像の削除編(今回)
この一連の作業が自然にできるようになれば、
だいぶ仕事がスムーズになるかと思います。
正直まったくクリエイティブな作業ではありません。
しかしこれらをマスターすることでUnity開発における、
UIデザイナーとしての信頼性や発言力 は上がります。
ぜひとも覚えてもらっって
よりよいアプリ開発につながってもらえると幸いです。
第1回目 画像の追加編から復習したい方はコチラをどうぞ。
![](https://i.gyazo.com/50b5e2283104100c60b8ddc50bc94ae5.jpg#1280.0__821.0)
この記事が気に入ったらフォローしよう
「Unity初心者大学」というUnity初心者向けのYouTube始めました!!
ぜひチャンネル登録をお願いします!
最後まで読んでいただきありがとうございました!
すばらしいUnityライフをお過ごしください。