高解像度のRetinaディスプレイ登場以降、Mac で使われるアイコンの作り方は以前より複雑になり、用意する画像も多くなって面倒になりました。 僕はアイコンの元となる icnsファイルの作り方をよく忘れるので、自分なりの見解も含めてメモしておきます。 アイコン用の画像ファイルを用意する 下の表のように、アイコン用の画像ファイル(png)を各サイズ、それぞれのファイル名にして用意します。(すべてのサイズを用意しなくても icnsファイル は一応作れる) ( macOS Human Interface Guidelines: Designing App Icons より参考) ファイル名+拡張子画像サイズ(pixel)dpi icon_512x512@2x.png 1024 × 1024 144 icon_512x512.png 512 × 512 72 icon_256x256@2x.png
大阪・泉州のデザイナー♡森本千恵のブログ 小さなデザイン事務所でWEBデザインをメインにデザイナーをしています。ブログではたまーに作品を載せるかも?基本はデザイナーの日常です♪ こんばんは、Mac歴はまだ2年程度のグラフィック&デザイナーのChieです。 10年以上、Windowsユーザーだったのですが3年前に初めてMac Book Proを購入しましたが、 BootCampで基本的にはWindowsを使っていました。 2年弱前にそのノートが壊れてしまい、修理とともに「いい加減Macに慣れよう」と思い BootCampをやめて正規の(?)Macユーザーとなりました。 そんな私の現在のデスクトップ一部がこちら↓ データは元請けさんの会社ごとにフォルダ分けして 全てDropBoxでスタッフみんなで共有しています。 なので私のデスクトップにはDropBoxのエイリアス(ショートカット)を並べてい
Webサービスを利用するユーザーに対して、読み込み中と分かりやすく伝えるローディングGIF画像は重要な存在です。コンテンツが読み込み中であることを伝えなければ、なんらかの不具合であると勘違い、あるいは気付かずに離脱してしまう可能性があるからです。 今回は、そのまま使えるローディングGIF画像、簡単に画像生成ができる便利ツールをまとめてご紹介します。今すぐ画像を使いたい方はもちろん、自作で画像を用意して使ってみたいと思っている方もぜひ参考にしてください。 ※素材数などの情報は2016年4月8日時点のものです。今後変更となる可能性がありますのでご了承ください。 フリーのローディングGIF画像 1.フリーデザイン素材「 ローディングのくるくるアニメーションGIFがいっぱい -|PIXEL LAB http://www.pixelimage.jp/blog/2012/04/loading_icon
2016年2月9日 Illustrator, SVG, 便利ツール 繰り返し使うSVG形式のアイコン等を表示する際に便利なSVGスプライト。しかし、symbol タグで囲んで…一つ一つにIDを付けて… viewBox 属性をコピペして…と、本当にコーディングがめんどくさい!新規プロジェクトを始める度に設定するのが煩わしくなり、いろいろと楽する方法を試した結果、アイコンジェネレーターツールの「IcoMoon App」を使う方法に落ち着いたので、やり方を紹介したいと思います。 ↑私が10年以上利用している会計ソフト! SVGスプライトとは? SVGスプライトは、ロゴやアイコンなどの複数のSVG画像をひとつのファイルにまとめて保存し、使いたい時に呼び出す方法です。SVGなので、拡大縮小しても画質が劣化しません。詳細は過去記事「アイコンフォントからSVGへ!より手軽にベクター画像を表示しよう」に目
まだまだ衰えを見せないデザイントレンド、フラットデザイン。 そんなフラットデザインに使えるアウトライン型アイコンのセットをご紹介します。アウトライン型アイコンは、通常のフラットアイコンよりもミニマルで洗練されたイメージに仕上がります。無料とは思えないハイクオリティなアイコンをテーマ別で厳選して集めたので、ぜひデザインの参考にしてみてくださいね。 One line - Free Startup icons スタートアップが企業がテーマで、すべて一筆書きで描かれたアイコンセットです。他にはあまりないデザインなので印象に残ること間違いなしです。 最後のアイコンにはスターウォーズのあのキャラクターが使われているおちゃめさも。 個人利用のみ可です。 Medical icons 医療系のアイコンのセット。水色とピンクが基調の可愛らしい色合いが特徴です。 商用利用可。 Face the Animals:
Your favicon is transparent. This is usually a good thing, but not for iOS Web Clips which are supposed to be opaque. Look at the sample on the left, this is how a user would see your favicon as a Web Clip on his device. What to do about this? Your favicon is not transparent. This is a good thing for iOS Web Clips. Yet, web clip corners are rounded. Depending of your favicon, it may disrupt its de
アイコン・ピクトグラムとは? Webサイトデザインやアプリデザインをする際に必要なボタンなどに使用するイメージ画像のことです。 デザインの完成度を高めたり、UI/UXを向上させる役割も持ちます。 ・自分でアイコンを作る時間はない… ・面倒でいつも同じピクトグラムを使っている… ・デザインのクオリティを楽に上げたい… という方にダウンロードして欲しい使えるアイコン・ピクトグラムのセットを30個まとめてお届けします! 1. MimiGlyphs 16×16pxのアイコンが80個収録されている。PSD, CSH, PNGファイルをダウンロード可能。 2. Simple Line Icons Set vol.1 / Simple Line Icon Set vol.2 シンプルなデザインのアイコンが40収録されている。32×32pxと64×64pxのPSDファイルがダウンロード可能。 vol.1に
(編集部注:2013年12月4日に公開された記事を再編集したものです。 ※無料で商用利用可のところばかりですが、中にはアイコン1個1個でライセンスが違うものやコピーライト記載が必要なものもあるので、ご使用の際には随時ご確認ください。) こんにちは。デザイナーの白浜です。 フラットデザインが流行りなこともあり?最近何かとピクトグラムアイコンを探す機会が増えました。(余裕があれば自作モノも増やしたいところですが!) でも、いつも同じところだとマンネリになりがち……。 他のデザイナーさんはみんなどこみてるんだろう??とアンケートをとってみたところ……今まで知らなかったところが結構出てきました! メモがてら、まとめてみたいと思います。 【こちらもおすすめ】 ☞ 質高すぎ!ベクター素材をフリーでダウンロードできるサイトまとめ LIGデザイナーが厳選!使えるフリーのピクトグラムまとめ Endless
商用利用可能で無料のシルエット素材やアイコンを50個紹介します。 ご利用の際は、リンク先で詳細をご確認ください。 1.シルエットAC 食べ物や楽器から昆虫など様々な素材が無料で配布されています。(無料の会員登録が必要) 2.アイコン配布中! 美容系や医療系なども用意されているバラエティ豊かなサイト。 3.SILHOUETTE DESIGN クオリティの高い素材ばかり。種類も豊富。 4.エムエムジークリエイティブネット リアルなシルエット素材を配布。武将など変り種も。 5.108 MONOICONS 108つのモノグラムアイコンを配布。 6.All-Sihouettes.com 素材やアイコンなど数えきれないほど配布している。 7.iconmonstr よく利用させていただいているサイト。使いやすいアイコンばかり。 8.METEOCONS お天気関連のアイコンを配布。 9.40 Apple
WordPress Admin Bar 0 comment(s) mysql_fetch_assoc()関数 0 comment(s) iPhone風のきれいなアイコンを簡単に作成できる超便利サイト「iCone」 0 comment(s) サイトから直接投稿するウィジェット「Quick Post Widget」 0 comment(s) Contact Form7でのスパム対策 0 comment(s) AjaxなLoad More実装のチュートリアル 0 comment(s) アーカイブ カテゴリー CSS (11) HTML (2) iPhone (4) JavaScript (10) サンプルコード (7) 関数リファレンス (1) PHP関連 (60) サンプルコード (1) 言語リファレンス (20) 制御構造 (6) 変数と定数 (4) 正規表現 (3) 演算子
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く