WCAN 2014 Spring に参加してきた


WCAN 2014 Spring に参加

2014/03/08(土)に開かれたWCANにスタッフとして参加してきました。 今回は職域的にも参考になった河村さんのお話が面白かったのでメモをかねて残しておきます。 ありがたい事にセミナーのスライドは河村さんが公開して頂いているので、是非ご覧下さい。

シンボルフォントで広がるフラットデザインの可能性

【メモ】

シンボルフォントとは?

シンボルフォント、アイコンフォントなどと呼ばれている シンボルフォントのほうが、定義は広い

ブラウザ対応状況

IE4から、ほとんどのブラウザでOK。Android2.1が若干微妙。

シンボルフォントの利点

  • なめらか
  • CSSで色コントロール
  • サーバリクエストが減る = 速い
  • 後からの調整に強い

いろいろなシンボルフォント

  • Font Awesome 369 icons open source!
  • symbolset.com
  • icomoon.io
  • glyphicons
  • stackicons.com
  • stately

アイコンの歴史

  • GIF
  • 透過PING
  • CSSスプライト
  • SVG
  • Webフォント
  • PUAを使う
  • Ligature(合字)
  • 多色刷りほか

誤解を恐れずに言うならフォントは一つのアイコンになった

制作フロー

今間までのフロー
  • 完成図デザイン
  • 画像の切り出し
  • きっちり配置
  • バランスの調整
フラットデザインフロー
  • 雰囲気のデザイン
  • 要素のアイコン化
  • とりあえず配置
  • レスポンシブ調整

感想

シンボルフォントは直接ではないが触った事はあった為 すなおにお話が入ってきて面白くお話が聞けました。

ハンズオン的にフォントを作る事もセッション内で実践していて そんなにハードルは高くないかなという印象。

特にGruntによる自動化の所での

めんどくさい事 = 毎回同じタスク = 自動化できるタスク

という事は共感しました。 実際にやってみて開発フローに組み込めないかなーと。 2014年は自分の課題としても自動化の年にしたいですね。

という事でWCANの感想でした。 今回のシンボルフォントの自動化の所は実際に試してみたいと思います。 出来たら次のエントリぐらいで、書いてみようと思います。


関連記事

WCAN 2014 Summerに参加してきた

【a-blog cms ver2.1】フォーム通知をメール以外で通知(ChatWork)

GruntでWebFont作成を自動化

a-blog cms Training Camp 2014 Spring に参加しました。

Grunt.jsを触ってみた

SSHの設定メモ

最新記事

カテゴリー

ハッシュタグ