Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Category Archives: Icon

[Generator] The App Icon – iOSとAndroid用のアイコンファイルを一括で書きだしてくれるサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

1枚の画像からiOSとAndroid用のアイコンファイルを一括で書き出す事のできるサイト。1024 x 1024の画像ファイルを放り込むだけで、各プラットフォームの開発や申請に必要なアイコンファイルをまとめて生成する事ができます。またiOS用のフォルダ内にはwatchOS用の画像ファイルも自動で作られるため、Apple Watch App制作の際にも使えます。PhotoshopではPSDとアクションの組み合わせでできたりするけど、自動処理系がそれほど充実していないデザインツール使っている人にとっては、この手の一括書き出しツールは便利ですな。

[Icon] Iconsfeed – iOS Appアイコンのデザインギャラリー

  • Pocket
  • このエントリーをはてなブックマークに追加

iOSアプリのアイコンデザインをまとめたサイト。こうしてズラっと並んでいるを見ると、iOS 7以前のスキューモーフィックデザインの頃に比べてデザインの流行も様変わりしたなー、なんて風に思います。このサイト便利なのが、アプリのカテゴリ分け以外にも色ごとに抽出して閲覧できる点。ズラっと並んでるカラーパレットをクリックすると、例えば赤系のアイコンだけを抽出する事ができます。カラーテーマ優先でデザイン作例を探したい時なんかに便利です。

[Icon] Public Icons – パブリックドメインのアイコン検索サイト

  • Pocket
  • このエントリーをはてなブックマークに追加

パブリックドメインのアイコン素材検索サイト。パブリックドメインなので使用に際して著作権等の表記もいらず、またシンプルなシルエットデザインのものばかりなので使い勝手が良さそうです。素材はSVGとPNGが用意されています。SVGコードも掲載されているのがナイスです。

[Icon] 20 Gorgeous Free Icon Fonts to Use in Your Designs – フリーで配布されているアイコンフォントまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

フリーで配布されているアイコンフォントをまとめた記事。20セット紹介されてます。よくあるシンプルなピクトグラムっぽいのから、手書き風のもの、天気や家具など特定のジャンルに特化したものなど色々あります。Webフォントとしてサイトに組み込んでしまえば、サイト内の装飾にサクっと使えるようになるので、こういうの便利ですな。

[Icon Design] Realistic iOS App Icons – リアル志向なiOSアイコン

  • Pocket
  • このエントリーをはてなブックマークに追加

リアル志向なiOSアイコンの作例をまとめた記事。最近じゃフラットデザインの波にグっと押されて、すっかり影をひそめてしまったスキューモーフィックデザインの手法で作られたアイコン達です。こういうの最近じゃ見る機会減っちゃいましたが、ここで紹介されているものはどれもクオリティが高く、しみじみとスゲーなぁって思うものばかりです。ディテールの細かさ、情報量の多さ等、仕事の細かさがはんぱないです。プロトタイプも併せて掲載されているので、アイコンデザインの参考にもなりそうです。

[Icon] Flat Icons – フラットなアイコンセットを紹介するサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

フラットデザインのアイコンセットを紹介するサイト。ギャラリー形式で紹介されていて、各記事の詳細ページからダウンロードページに行ったり、直接ダウンロードできたりします。ものによってはPay with a Tweetだったりします。それなりに多くの種類のアイコンパックが紹介されているので、素材探しの際に役に立ちそうです。
そういや最近めっきりスキューモーフィックデザインのサイトとかアプリとか見なくなりましたね。トレンドの移り変わりというのはほんとに早いなぁとしみじみ思います。

[Icon Design] After iOS 7 icons – iOS 7以降、アイコンデザインはどう変わったか

  • Pocket
  • このエントリーをはてなブックマークに追加

iOS 7以降、Appのアイコンデザインはどう変わったかについて、BeforeとAfterで比較したTumblrブログ。Apple純正のアイコンの比較記事はiOS 7の公開前後によく見られたけど、ここでは主にサードパーティー製アプリのアイコンの変化を比較してます。いやこれ興味深いっすね。基本的にどのアプリもシンプルなフラットデザインに変わってるんだけど、その手法というのが主に「グラデーション」、「ドロップシャドウ」、「テクスチャ」の排除なんですね。それにアイコン内におけるシンボルやロゴマークのミニマル化が加わり、手数が減った分デザイナーの力量が問われるデザイン手法となってます。いわゆる引き算のデザインで、iOS 7のデザインフィロソフィーに沿う形でリデザインされてる場合が多いという印象。アプリアイコンをデザインする際の参考になりそうです。

[Icon] Touch Gesture Icons – タッチデバイスでのジェスチャーアイコン

  • Pocket
  • このエントリーをはてなブックマークに追加

タッチデバイスで行われる様々なジェスチャーをシンプルに表したアイコンセット。タップやスワイプ、ピンチなどのタッチデバイス用のジェスチャーに加え、なぜか指での数表示やハンドシェイク、サムアップなどもあります。あとスマホの方向け操作など。ダウンロードするとPSDとベクターデータのEPSが同梱されているようです。スマホアプリのHow to Play画面制作とかで使えそうですねこれ。