:::::みんなのブログ:::::アイコン

Photoshop:アプリ用のアイコンを作成する

モバイルアプリアイコン


 モバイルアプリのアイコンを作成します。
アプリアイコンのサイズはチュートリアルの始め。

Create a Mobile App Icon in Photoshop

Photoshopでのアイコンの作成は、特に注意する所はアンチエイリアスしない様にすればいいと思います。後はこの通りに作成するのみ。
ブラシの毛の部分は、私はブラシでドローするなんてめんどくさい事はしませんでした。
テクスチャを作ってから、変形でワープで作りました。




チュートリアルではアイコンとなってますが、Androidのランチャーアイコンとか言うのじゃない…色々、ウルサイ規格が無い豪華な方です^^;
そうは言ってもアイコンなので、適当に作るとダメなようです。

ガイドライン読めば、どんな感じに作れば正解か書いてあります。英語です。
私は自慢出来ませんがアバウトしか読めません^^;だからといって、日本語にしてもらっても…なげそうです。
ある程度、作らないとわかりません…。

詳しい方なら、この辺は熟読されてるとは思います。

Android
Icon Design Guidelines
iOS
Custom Icon and Image Creation Guidelines

アプリの角丸のサイズがコメントに書いてくれてます。
メモしておきましょう。
機械側が勝手に角丸がつきますから知らんでいいかもしれませんが、一応。
以下はチュートリアルのコメント記事内の引用です。あくまでもiPhoneです。

- corner radius for the 512×512 = 90 (iTunesArtwork)
- corner radius for the 114×114 = 18 (iPhone/iPod touch (Retina))
- corner radius for the 72×72 = 11 (iPad)
- corner radius for the 57×57 = 9 (iPhone/iPod touch)



なるべく色数を少なく、あまり細かい所まで作りすぎない、正面向いてるけど立体的に…滲みが無い様にする。
パソコンのアイコンと気を使うところが微妙に違う。…
洗練された様な感じに作る^^;物がスマートなだけに…ダサイのアカン…。こんなところなんでしょか?
親切な方のチュートリアルで、色んな事が知れて本日も良かったです。


関西でも路面が凍りそうです。モビルスーツで通勤でもいいくらいです。


















スポンサーサイト

illustrator:透明のフォルダに入ったミュージックアイコン

音楽アイコン


 透明のフォルダに入ったミュージックアイコンです。
見た感じが透明の様に見えます。
一見、3Dで仕上げればすぐできそうな感じですが、違うと思います。
丁寧な作業を要求されるようです。

How to Draw a Vector, Music Folder Icon

ト音記号のテクスチャはデフォルトで元々あるものを使いなさい…とい事ですが、ゼブラ柄以外のものにすると、単色でないので処理が遅くなります。
ヒョウ柄はやめておいた方がいいと思います。

書いてある時間通りに,仕上げるには、グラデーションをスウォッチ登録しておくと大丈夫だと思います。

昼間はとろける様に暖かくて気持ちよく、仕事がスムーズに運びませんでした^^;
















ライセンスが調べられるアイコン検索サイト「FIND ICONS」

アイコン


 ライセンスやサイズ、ファイルの種類が調べられるアイコン検索サイトです。
テキストフィールドには、英語で入力。

FIND ICONS

出来たのは去年からのようです。
たまたま、検索したのがクリスマスのアイコンですが、割といいデザインのアイコンがヒットすると思います。
「dog」で検索するとキーワードで数が少ないものがあったりします。

アイコンは実のところ飾る事はないんですが、きれいですね。

目薬がやっとまともに点眼出来る様になり感涙です。



















商用利用可能な28の細部が美しいボタンとアイコン

 チュートリアルではないですが、細部まで書き込んだとても奇麗なアイコンです。
商用利用可能ですね。

28 Beautiful Button and Icon Sets to Improve Your Designs

商用利用可能でクオリティの高いアイコンはそんなにありません。
アイコンの作成は小さい割に、時間がかかります。
感謝して使いましょう^^



だからといって、もちろん売買はできません。常識範囲。アダルトサイトの目的は知りません。

















アイコンの検索サイト11選

 アイコンの検索サイトのまとめ紹介です。
商用に使えるものも含まれていますが、利用の際にはサイト内のリードミーなどをよく読んでからになります。

11 Great Resources to Find Free Icons

たくさんあるんですねぇ。
知らなかったサイトもありました。


自分で作っちゃった方がいいものは落とさない方が…^^;他力本願時。





商用利用可能なクリスマスアイコン、ベクトルデーター付

 貧乏暇なしの師走ですが、クリスマスのかわいいベクトルデーター付のアイコンです。
商用利用可能です。再配布、売買が出来ない事は言うまでもない。

Free Smashing Christmas Icon Set

プレゼントを買って景気回復…^^;
素敵なクリスマスカードを送ってもいいですね。
12月の慌ただしい時期に、素材を置いてくれるだけでもありがたいです。


財布のヒモはすでに固ぁーく封印されている。


フリーのピクトグラムアイコン

 フリーのピクトグラムアイコンサイトが8つ紹介されていました。
Illustrator形式でダウンロード出来るサイトやOTFのフォントなどもありました。
Creative Commons Attribution 3.0。

8 Free Pictogram Icon Libraries and Collections

こりゃ、便利。
ピクトグラムはデザインの基本中の基本。


風呂上がりのブックマークに。どうぞ。


photoshopなどのリソースファイルがフリーでダウンロード出来る「〜ETC」

 web用ですが、商用利用可能なパターンファイルが紹介されていました。
ヘッダのPhotoshop Resourcesからたどっていきましょう。
「〜ETC」とサイトの名称にしましたが、色々、姉妹サイトがありましたのでまとめて紹介。

シームレスなパターンなどダウンロード出来ます。このサイト上での個人および商用利用は無料です-帰属必要ありません…との事。

WebTreats ETC

他にも、姉妹サイトでしょうか。チュートリアルサイトもありました。
Tutorials ETC

以下はバックグランド
Backgrounds ETC

アイコン
Icons ETC

チュートリアルサイトの方は、こちらもそんなに難しくはないです。Googleの翻訳でもだいたい通じます。
日本語訳にするとどうしても通じない部分がありますが、スクリーンショットがありますから、今回も大丈夫です。
スタイルパレットにでも登録しておけば、同じテキストエフェクトが出来ます。
サクッとやってしまいましょう。

シームレスなパターンの作成の仕方は、PhotoshopとIllustratorでは様々なやり方がありました。
ダウンロードばかりしていると、オリジナルが作れなくなりますが、必要な時だけ落とせばいいと思います。

出来て間がないサイトの様です。


上記のチュートリアルでは、青いテクスチャは「輝度」でないと同じにはなりませんでした。


アイコンの便利サイト12選

 便利なアイコンサイトの紹介です。検索サイトやオンライン上でコンバート出来るサイトなどありました。

dezign Musings: 12 Cool New Sites Just for Icons

以前、紹介したサイトもありましたが、これは便利。


やっと金曜日です…。仕事もプライベートも勉強も頑張ろう!週末はやる気が出るなぁ…。


フリーなトゥイッターバードアイコンやボタン

 可愛いアイコンなんです。
その…イチャモンではないんです。足の数が気になって…。^^;
細かい事は気にならない方は、zipでダウンロード出来ます。中身はpngになっておりました。

Function Web Design & Development [ Blog ] » 40 Cute Free Twitter Graphics: Badges, Icons & Buttons…

ハトをモチーフに描かれているとは思います。特にハトではないのかもしれませんね。



解釈の一つ…^^;


ロイヤリティフリーアイコンを色や大きさなどを変えてプレビュー&DL

 ロイヤリティフリーアイコンなんですが…。自分で色や大きさなどを変えてプレビュー出来、それをzipでダウンロード出来ます。ロシアのサイトです。

Иконза - Бесплатные цветные иконки для вашего сайта и блога

ダウンロードは右下の矢印のついたボタンです。
pngになっていました。
素敵だ。


最近のエキサイトブログは、コメント認証にしてから、使えるレベルになったと思います。


アイコン検索サイト7選

 アイコンを検索するサイトです。
テキストフィールドに1バイトで入力してEnterかReturnキーです。

エ〜…検索してもヒットしない場合やテキストの意味とチガウ気が…。^^;

Top 7 Icon Search Engines | SingleFunction

各サイト、商用に使えるかどうかは確認してから使う事になります。
個人で使うには問題ないですね。


catやdogはあって、rabitがないんですねぇ。


商用可能な200個のアイコン(データー付き)

 猫の手も借りたい人の為の商用可能なアイコンセットです。
ベクトルデータもついてるのだそうです^^

元データ付き、商用利用可のシンプルデザインの200個のアイコンセット -Siena

独りで作ろうと思えば、出来てしまうweb作業のお供に。ありがたいですよねぇ。
皆さん、お使いになると同じ感じになっちゃいますねぇ^^;

ファンタスティック!(コメントにも書いてありました…。)


「明日まで作ってこい」…「(ご無体な)…。」苦しい時に使うかもしれない。


ライセンスフリーアイコン

 商用可能なフリーアイコンです。作者は明記しなくてよい模様です。ただし再配布や販売目的が出来ません。またそうで無いのもあります。

基本的にデザイナーが作った物を、無断で再配布や販売はモラル的に出来ないと思いますが…。

iconPot - totally free icons

web作成のお供に…。
ブックマーク!


有り難いでーす。


ライセンスフリーかクリエイティブコモンズかわかるアイコン

 アイコンって、作るのは結構面倒な作業ですよねぇ。
色々なフリーアイコンサイトなど閲覧して、見るのも勉強なんですが。
豪華なデスクトップアイコンじゃなく、チョット欲しい…豪華じゃなくて…その…Photoshopのシェープか自分でつくればいいのでしょうが…頭がまわんないっ…お助け!という時ってありませんか?
泉の如くアイデアが沸き上がるという人は、心配無用なサイトですから読み飛ばしです。^^;もうご存知だったかもしれませんが…。

Icons | Web Resources | WebAppers

ライセンスフリーかクリエイティブコモンか記載されていますから、これは有り難い。
狙いはライセンスフリーですよねぇ。

一応、リンクされている元は読んでおく方がいいでしょう。
紹介してもらえるだけでも、助かりますよねぇ^^


みんなは仲間をよんだ…しかし誰も来なかった…。へんじがない、ただのしかばねのようだ。


フリーなアイコンサイトのリンク集

 たくさんのアイコンサイトのリンク集のようです。
見た所、主にフリーサイトのようです。

Коллекции иконок? Легко! Тысячи иконок в сетах.

まとめて、リンクされてますから、有り難い事なんですが、整理がしにくいですねぇ^^;
以前に紹介した様なサイトもありました。


たくさんあるんですねぇ。週末、使えそうな所だけを整理かな…。


アイコン検索サイト、色々…

 ウ〜〜〜ン。検索のアタリが微妙だ…。ちょっと、チガウ…。
でも、何かの役にたつかも…。

アイコン専門の検索サイト集-コリス

以前、どこかで、見かけたサイトもありますが…。まとめ。


「bird」と入力するとなんで「Thunderbird」が当たるのは何故?^^;他はあまり無いのやねぇ…。

Freeの海外サイトのアイコン

 基本的にはFreeだと思いますが、海外のサイト。256x256 pxの高めの画質が置いてありました。形式はicoとpng。一応、翻訳してから使いましょう。

PNG Icons & Icon Packs Download | IconsPedia

アイコンマニアは、華麗にデスクトップを飾って下さい…^^


アドセンスを押しそうで、ややこしい…。


暖まる和風のアイコン

 寒くなってきましたが、お風呂にゆっくり入りたい季節ですよねぇ。
そんな季節にぴったりの楽しいアイコンがダウンロードできるようですよ。^^
わかりにくいかもしれませんが、なかなか素敵なサイトです。

私も色々なサイトに、お邪魔して、勉強させてもらっていますが、以下のサイトは、結構有名なサイトらしいです。

HYBRID WORKS

サイトの仕組みは、はじめは慣れるまで、何処をどうしていいのか戸惑いますが、サイトのレイアウトや昼や夜まで、変えられる様ですからすごく凝っていますねぇ。


奇麗で、楽しいサイトですねぇ。^^


Copyright © :::::みんなのブログ:::::
当サイトに掲載されている記事および写真、画像の無断複写、転載等の利用・使用はお断りします。
2006~2016 minna no blog. All Rights Reserved. 



  • Designed by Fons
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。