こんばんわ、C-HR FANです。
今朝、ブログ[C-HRのアイコンを作った件」でパソコン上のフォルダーに貼り付けるC-HRを作った話をしました。その後、そこそこ[イイネ]をいただいたので、その作成方法をご紹介します。
アイコンの素材はなんでも良いですが、トヨタのHPからC-HRの写真をいただきました。HP内のこういう画面からC-HRの写真をスクリーンキャプチャして画像を切り出しました。
そのままの画像ならこういう感じになります。
そのまま、画像をフォルダーに貼り付けるとこのようになります。
C-HRってことはわかりますが、車体の周りが白くなってあまり格好よくないですよね。一般的なアイコンっていうとやっぱりこのように、画像の周りが透明になっているものですね。
したがって、C-HRのアイコンを作るには、まず、車体の周りが透明な画像ファイルをつくる事から始まります。
画像をカスタマイズするには画像ソフトが必要です。一番有名なのはphotoshopです。
ここからはphotoshopを使ってみます。
photoshopでC-HRの画像ファイルを開きます。
左のメニューの左上2番目の多角形選択ツールで、C-HRの外周をなぞって、C-HRだけを選択できるようにします。
選択できれば、編集メニューから[コピー]を選び、切り抜き画像を(クリップボードに)コピーします。
そして、ファイルメニューから新規を選び、新規ファイルを作成します。なお、photoshopの場合、クリップボードにコピーした画像があると、新規ファイルのキャンバスの大きさは自動的にコピーした画像に合わせてくれます。
なお、通常、新規ファイルの背景(キャンバス)は白になっていますが、作成時のメニューで[カンバスカラー]を[透明]にしておきます。[ファイル名]は名称未設定のままでいいです。そのまま[OK}を押します。
そして、[編集メニュー]から[ペースト]を選ぶと、クリップボードからC-HRの切り取り画像が新規ファイルにペーストされます。背景が透明になってますね。
そして、このファイルを保存しましょう。ファイルメニューから[別名で保存]を選びましょう。
ここで適当にファイルの名前をつけましょう。注意して欲しいのは、ここで、フォーマットをPNGという形式を選んで下さい。一般的によく使われるJPEG形式では、透明化された背景を保持できません。*最終的にはicns形式のファイルを用いたいのですが、photoshopではicns形式で保存できません。icns形式には後で手動で変換できます。
[保存]ボタンを押すと、このような画面になりますが、[インターレース]は[なし]でいいです。[インターレース]の説明は省略します。
するとデスクトップに新規に作成された画像ファイル[C-HRicon1.PNG]が生成されました。
できた画像ファイルをプレビューすると、背景のないC-HRの画像が生成されている事がわかります。
このまま、画像にはりつけてもいいのですが、元画像によっては、小さいアイコンが生成される場合があります。決まった大きさのアイコンを作成するために、以下のサイトを利用します。
JPEG/PNG/GIFからアイコンを作成する「アイコンコンバータ」
http://app.tree-web.net/icon_converter/
このサイトを開いたところがこちら。
下のファイル選択メニューから作成したアイコンファイルを探して選んだあと、[変換]ボタンを押して下さい。
すると、下にずらずらと大きさの違うアイコンが生成されました。
できるだけ大きいアイコンを使いたいので、大きいサイズのアイコンを選びます。マックでは右側のPNG形式(144×144 pixel)を選んで下さい。ウインドウズでは128×128 pixelのico形式を選んで下さい。目的のファイルの下にあるdownloadをクリックします。
するとこんな感じの画面になりますので、中央の画像をドラッグして、デスクトップに移動させると、デスクトップにファイルが保存されます。
これでデスクトップに大きさは144×144pixelの大きなアイコンファイルが生成されました。
つぎに、デスクトップに新規フォルダーを作成しました。このフォルダーにC-HRのアイコンを貼り付けたいと思います。
ここからは
Macのアプリケーションなどのアイコンを任意の画像にする方法。
http://zonotrain29.blog72.fc2.com/blog-entry-456.html
に沿って作業を行います。
まず、ファイルの拡張子をPNGからicnsに変更します。ファイル名をクリックして、単純に語尾のPNGをicnsにタイプするだけです。すると下のような確認ダイアログが出ますので、[icnsを使用]を選んで下さい。
次に、変更したファイル{C-HR icon.icons]を選んだ状態で、[表示]メニューからサムネールを選んで、サムネールを表示するようにします(画像をそのままフォルダーに貼りつけることはできません。サムネールを貼り付けるのです)。
すると、アイコンファイルの画面の左に小さいサムネールが出現します。
サムネールをクリックして選択状態にしたまま、編集メニューで[コピー]を選択して下さい。クリップボードにサムネール画像がコピーされます。
その後、アイコンを貼り付けたいフォルダ[名称未設定フォルダー]をクリックして選択した状態で、ファイルメニューから[情報をみる]を選択して下さい。左のようなウインドウが開きます。
左上の小さなフォルダーアイコンをクリックして、編集メニューから「ペースト]を選んで下さい。するとクリップボードにコピーされたサムネールの画像が、選択したフォルダー画像にペーストされます。
すると、フォルダーのアイコンがC-HRに変わりました。
このようにして、C-HRにかぎらず、任意の画像ファイルからアイコンを生成できます。アイコンをつくるときには正方形に近い画像を用いると大きくて見栄えのよいアイコンをつくる事ができます。横長の画像だとアイコン自体が小さくなってしまうので、貧相なアイコンになってしまいます。
今回はマックでのアイコンの生成方法を説明しましたが、ウインドウズでも同じような事ができるはずです。C-HR FANの周りにはウインドウズパソコンがないため、検証できませんが、以下のサイトをみるとできるようです。
Windows 10のデスクトップアイコンを変更する方法
http://www.ask-mswin.com/win10-set-desktopicons/
その際はico形式のファイルが必要なようです、ウインドウズを使っている方はぜひ試してみて下さい。
あと、前のブログでも書きましたが、画像処理ソフトを持っていないなど、自分でアイコンを生成できないけど、パソコンで使いたいという方は、メッセージで連絡をいただくと、相談にのります。マックの方はアイコンそのものをフリーメールなどでお送りできますし、ウインドウズの方にはico形式のファイルをお送りできますので〜。
今回は以下のサイトを参考にしました。
JPEG/PNG/GIFからアイコンを作成する「アイコンコンバータ」
http://app.tree-web.net/icon_converter/
背景が透明な画像を作成および保持する方法
https://helpx.adobe.com/jp/photoshop/kb/cpsid_90772.html
Macのアプリケーションなどのアイコンを任意の画像にする方法。
http://zonotrain29.blog72.fc2.com/blog-entry-456.html
Windows 10のデスクトップアイコンを変更する方法
http://www.ask-mswin.com/win10-set-desktopicons/
C-HR FANの過去の投稿リストはこちらです。
C-HR FANの投稿リスト8 (2019-04-18~)