「はてな」「LINE（ライン）」など、SVGのフリーアイコンを作っていただいたのでシェアします先日、Twitterで協力をお願いしたアイコンの作成依頼が受理され、さっそく作っていただきました。 いやーほんと、仕事が早くて驚きです！ ※コリスのアイコンはダウンロードできません。 海外の無料アイコンはかっこよくてかわいいのですが、日本人向けのものがないのが難点です。「はてな」「LINE（ライン）」「Feedly」のアイコンをお願いして、作成してもらいました。
IllustratorとIcoMoonでSVGスプライトのラクラク設定！
2016年2月9日 Illustrator, SVG, 便利ツール 繰り返し使うSVG形式のアイコン等を表示する際に便利なSVGスプライト。しかし、symbol タグで囲んで…一つ一つにIDを付けて… viewBox 属性をコピペして…と、本当にコーディングがめんどくさい！新規プロジェクトを始める度に設定するのが煩わしくなり、いろいろと楽する方法を試した結果、アイコンジェネレーターツールの「IcoMoon App」を使う方法に落ち着いたので、やり方を紹介したいと思います。 ↑私が10年以上利用している会計ソフト！ SVGスプライトとは？ SVGスプライトは、ロゴやアイコンなどの複数のSVG画像をひとつのファイルにまとめて保存し、使いたい時に呼び出す方法です。SVGなので、拡大縮小しても画質が劣化しません。詳細は過去記事「アイコンフォントからSVGへ！より手軽にベクター画像を表示しよう」に目
Microsoft系のアイコン(Microsoft CloudnEnterprise Symbols)をベクター形式にしてみた話。 |
このブログの記事でも紹介することがありますが、最近Azure関連で構成図を作る機会がちょくちょくありまして。 ちなみにMicrosoftから公式でアイコンセットが提供されています。 ◆Microsoft CloudnEnterprise Symbols http://www.microsoft.com/en-us/download/confirmation.aspx?id=41937 ですが、ベクター形式ってないんですよね…。私が見つけきれてないだけかもですけど（汗 自分が使う分はチマチマとベクター形式を作ったりしてたんですが、シルバーウィークにもなりましたし「どうせなら全アイコンベクター形式にしてやるわ！！」ってなりまして、作りました。 軽い気持ちで初めたんですけど、全２１３個ありまし…た…。（吐血） Microsoft CloudnEnterprise Symbols（v2.22）をベ
≡ ←ハンバーガーメニューのデザインでクリック率は違う（2014年のA/Bテストの結果から）
スマートフォン対応サイトで右上や左上にある「≡」こんな形の三本線のメニューはいわゆるハンバーガーメニューと言いますが、ハンバーガーメニューのデザインに関してA/Bテストを行っていた記事があったので紹介します。 ●ハンバーガーメニューのデザインパターンハンバーガーメニューは色々なデザインがあって、例えば以下の様なパターンがあります。（サイトイメージは「グラシン工房」から） まずはBootstrapの標準に近い形式。三本の線があるだけのパターン。 次に三本の線のしたにメニューという文字を配置して、アイコンの意味を説明するパターン。 三本線を線（border）で囲い、ボタンらしく見せるデザインのパターン。 他にもいくつかデザイン・表現方法がありますが、それは前に書いた「【Web制作】スマートフォンサイトのメニューのアイコンデザイン・表示を比べてみた」の記事をご覧ください。 ●アイコンだけ・文字付
マイクロソフトが提供しているアイコンセットまとめ – プログラミング生放送
マイクロソフトが提供しているプレゼンやアプリなどに使えるアイコンを、知っている範囲で最近のものをまとめました。 Cloud and Enterprise Symbol/Icon set Cloud and Enterprise Symbol/Icon set は、UX グループが Azure 向けに作成した200個以上のアイコンセットです。PNG 画像と Visio ステンシルがダウンロードできます。 新サービスのリリース時と四半期ごとに更新が予定されているようです（現在は、4月に更新された Ver. 2.22）。アンケートやメールでのフィードバックも受け付けています。 基本は、Azure 関連のアイコンですが、一般的なアイコンも含まれています。資料作成などの用途に広く使えます。 You can use them in architecture diagrams, training mat
ノンデザイナーでも簡単にイイ感じのロゴを作る方法を紹介するよ - undefined
ノンデザイナーにとってロゴ作成は鬼門です。今回はデザインが苦手な人でもさくっと、それっぽいロゴが作れちゃうサービスを紹介します。 www.squarespace.com アクセスするとこんな感じ。中央の『LOGO NAME』にサービス名やブランド名などを記入します。今回は例として『ヒゲ部』というサービスを作ったと仮定します。 入力を終えると編集画面へ。すでにベースのロゴができあがっています。フォーカスされている『Search for symbols』に適当にそれっぽい単語を入力してみます。 余談ですが、『ひげ』は『moustache』または『beard』らしいです。生える位置で使い分けるようですが、気にしません。今回は『moustache』で検索してみます。 ひげがズラリ。 それっぽいのを選びます。 ああ、それっぽいですね。右下のTシャツとかいいですね。 次はフォントを変更します。 ロゴ名
ファビコン favicon.ico を作ろう! リアルタイム 5サイズ版
このページでは 16x16, 24x24, 32x32, 48x48, 64x64 の5つの画像を含むマルチアイコンを生成します。 16x16のみ、16x16と32x32の2個、などのアイコンも作成可能です。 入力された画像は指定サイズに拡大縮小されます。 長方形の画像を指定した場合は正方形に変形されます。 透過情報を含むPNG画像も指定可能です。 指定した大きさの画像がアイコン内に作成されます。 16x16の画像のみ作成する場合は16x16に画像を指定して下さい。 32x32の画像のみ作成する場合は32x32に画像を指定して下さい。 同時に複数画像を指定すると、マルチアイコンになります。 16x16と32x32に画像を同時に指定すると2サイズのマルチアイコンになります。 16x16,24x24,32x32,48x48,64x64すべてに同時に画像を指定すると、5サイズのマルチアイコンにな
無料で使える、モバイル用Firefox OS向けに作られたリソース集
Firefoxのモバイル向けOSで使われているリソースがMozillaより配布されていましたので備忘録。実装コードではなく、PSDやフォントのみになります。 モバイル向けに開発/公開されていたFirefox OSですが、このOSで使われているアイコンやフォント等のリソースが無償配布されていましたのでいくつかご紹介。 ダウンロードボタンはそれぞれのリンク先下部にあります。 Firefox OS Color Palette カラーパレットです。メインとして使われている色やグラデーションなど。こちらはPSのスウォッチが配布されています。 Firefox OS Color Palette Firefox OS Typeface Fira Sansという名で配布されているオープンソースフォントです。Webフォントもあるみたいですね。テキストスタイルや使用サンプル、どのように使用されているか等も。 F
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Noun Project: Free Icons & Stock Photos for Everything