Monthly Bookmarks #32 目次
Development
- Grade.jsイメージに使用されているカラーを抜き出し、それを利用したグラデーションを背景に設定することができるライブラリ。
- baffle.jsテキストにモザイクのようなものをかけて難読化したり、シャッフルする動きを与えるライブラリ。
- in-view.js - Get notified when a DOM element enters or exits the viewport.要素がビューポートに入ったとき・出たときにイベントをつけることができるライブラリ。
- Aquarelle is a watercolor js effect.イメージをウォーターカラーやマーブルのようにして浮かび上がらせるライブラリ。
- あなたはCSSプロパティ”display”をどのぐらい知っているだろうか？ | デザイン | POSTDちょっとしたサンプル付きで、各
displayプロパティについて解説しているエントリー。 - Flexboxを使うなら知っておきたい「flexアイテム」の幅の計算方法 – Rriverタイトルにもあるように、flexboxを使用する際に頭に入れておきたいことがイメージ付きでわかりやすく解説されています。
- flexboxのバグに立ち向かう（flexboxバグまとめ） - Qiitaflexbox使用時によく遭遇する問題とその解決策についてまとめられています。
- Multi-Layout Slideshow | Codrops様々な見栄えに変化するマルチレイアウトなスライダーを実装するチュートリアル。
- SassからStylusに乗り換えてみたので違いや躓いたところなど – モンキーレンチ「SassでこうなっていたのはStylusではこう」という形で、SassからStylusに乗り換えを検討している場合や乗り換えた直後に押さえておきたいポイントがまとまっています。
- Use Cases for Fixed Backgrounds in CSS | CSS-TricksCSSの
background-attachmentを利用したテクニックがまとめられています。
Design / Inspiration
- All about creating design style guides – Mybridge for Professionalsスタイルガイドを作るときに参考になりそうな事例や作成方法について書かれたエントリーなどをまとめています。
- Product Pages「様々な料金ページデザインを集めたデザインギャラリー「Pricing Pages」」で紹介したサイトの姉妹サイトで、こちらはデザインが素敵な製品紹介ページを集めているデザインギャラリーです。
また、他にも決済ページデザインとストアページデザインのギャラリーもあります。 - UI Temple | Best Web Design & UI Inspiration同じくデザインギャラリーで、こちらはLP・ポートフォリオ・問い合わせ・料金・製品ページなど複数のカテゴリーのデザインが集められています。
- レスポンシブな3カラム・レイアウトの変形パターンを考える – Rriverタイトル通り、ウィンドウサイズが大きい時に3カラムなレイアウトを使用している時、モバイル・タブレットのサイズではどのように見せるかを考察しているエントリーです。
見せ方に悩んだときに見るとヒントをもらえるかもしれません。 - 600+ Food Related Design Resources » CSS Authorアイコン・モックアップ・テンプレートなど、フード系のデザインリソースがたくさんまとめられており、とにかくすごい量があります。
Service / Resource
- WordCamp Kansai 2016 セッション動画・スライドまとめ – WordCamp Kansai 2016WordCamp Kansai 2016のセッション風景の動画や使用されたスライドがまとめられています。
- WordPress 4.6 “Pepper”WordPressの4.6がリリースされました。
わかりやすい変更点としてはプラグインなどのインストール・有効化がページ遷移なしでできるようになったり、管理画面で使用されているフォントが変更されたりしています。