Monthly Bookmarks #12

  • Posted on
  • Category : Bookmarks
Monthly Bookmarks #12

今月(2014年12月)個人的に覚えておきたいと思ったものやTwitterを通してシェアしたエントリーやサービスなどのまとめです。

Monthly Bookmarks #12 目次

  1. Development
  2. Design
  3. Inspiration
  4. Material / Freebies
  5. Service / Resource

Development

SVG Loaders

SVGを使った全12種類のローディング。

Material Preloader

Material Designのプリローダー。

SVG Morpheus – Morph SVG icons

SVGアイコンをアニメーション付きで切り替えるスクリプト。

2014年総まとめ、jQueryのプラグインとスクリプト100選 | コリス

毎年恒例のコリスさんのjQueryプラグインまとめ。
今年はjQueryプラグインだけでなく、単体で使用できるプラグインも多く含まれています。

50 Most Useful jQuery Plugins from 2014 – Speckyboy Web Design Magazine

こちらも今年公開された便利なjQueryプラグインをまとめたエントリー。

50 CSS Tools & Resources from 2014

CSSに関連する便利ツールやリソースをまとめたエントリー。

Inspiration for Dialog Effects | Codrops

ダイアログ表示を様々なエフェクトを使って実装するチュートリアルで、動きは全17種類あります。

Fifty Actions of WordPress – Tuts+ Code Tutorials

WordPressのアクションについて書かれたシリーズエントリー。

ClassyCountdown jQuery plugin | Class.PM

円形のカウントダウンを実装できるjQueryプラグイン。

Lazy-loading Google Maps — Osvaldas Valutis

画像でよく使用されるLazy loadingをGoogle Mapに使用するjQueryプラグイン。

Elastic SVG Elements | Codrops

サイドバー、ドラッグ&ドロップ、メニューアイコン、フォーム要素など、Webサイトでよく使用される要素にアニメーションを加えたチュートリアル。

CSS Animated Headlines | CodyHouse

見出しに様々なアニメーションを加えるチュートリアルで、エフェクトは全10種類。

Free Code Snippets for CSS3 Animation | Resources

CSS3のアニメーションを使用したサンプルをまとめたエントリー。

スクロールで何かするための処理まとめ。(JavaScriptおれおれAdvent Calendar 2014 – 21日目) | Ginpen.com

タイトル通り、位置取得や到達判定などスクロールに関するJSの処理についてまとめられたエントリー。

Material Design Fonticons

Material DesignのアイコンをWebフォント化したもの。

目次へ

Design

Web Design Trends for 2015 — Medium

あくまで予想ですが、2015年のWebデザイントレンドをまとめたエントリー。
フルスクリーンのイメージやムービー、ゴーストボタン、マテリアルデザインなど、今年もよく見かけたものが多いです。

Best Website Designs of 2014 – Designmodo

今年素敵だったWebデザインのショーケース。
紹介されているサイトはいずれもAwwwardsをはじめ、様々なギャラリーやデザインブログ等でも取り上げられているのを見かけたものばかりです。

サービスにおけるビジュアルデザインの役割

ビジュアルデザインについてまとめられたスライドで、実例もあって非常にわかりやすいです。

色がわかるWebギャラリーサイト samprary

素敵なWebデザインを集めているギャラリーサイトで、そのサイトで使用されているカラーコードも併せて紹介しています。

UI Tiles: Website Flowcharts

ワイヤーフレームやフローチャート作成に便利なキットで、形式もAi・Ps・Sketchの3種類が用意されています。

目次へ

Inspiration

Leodis Lager | Start the conversation

siberia.io

Christmas Experiments

Impossible Bureau

Haruki Murakami

Giacomorelli

20 Great Examples of Subtle Motion in Web Design

目次へ

Material / Freebies

※以下で紹介している素材を使用する際は、ライセンス等は各自で再度確認してください。

Freebie: Responsive And Mobile Icon Set (100 Icons, PNG, PSD)

100+ Outline Icons For Restaurant or Pizza House Website (AI,PSD)

SVG Developer Icon Set ♥ Scotch

Hand-drawn Social Icons

Minimal Services Icons – PSD

240 Free Location and Maps Icons

Designer Desk Essentials

Free Font: Rock Font

Hogshead Font

Mad Squire typeface / FREE FONT

超極細ゴシック体

目次へ

Service / Resource

WordPress › WordPress 4.1 “Dinah”

WordPress 4.1がリリースされました。
新たなデフォルトテーマとして「Twenty Fifteen」が用意され、他にも集中執筆モードが新しくなっていたり、開発者向けの部分でもいろいろと変更がされました。

Meet the Ipsums

いろんなLorem Ipsumを集めてるサイト。

Distill: Free HD Stock Video

個人・商用問わず利用できる動画をダウンロードできるサイトで、ジャンルも幾つか用意されています。

Venngage | Make Beautiful Infographics

美しいインフォグラフィックを作成できるツールで、様々なチャート・マップ・アイコンが用意されています。
テンプレートも用意されており、操作もドラッグ&ドロップで簡単にできます。

Androidify

オリジナルのAndroidキャラクターを作成できるツールで、作ったキャラクターは動かしたり共有することができます。

目次へ

Back to Top

NxWorld

Sorry... doesn't support your browser

To get the best possible experience using our site we recommend that you upgrade to a modern web browser.NxWorldではご利用中のブラウザサポートはしていません。
Internet Explorerのアップグレード行う、もしくはその他のブラウザを使用しての閲覧をお願いします。