[Web Design] btns.css – ボタン装飾だけのCSSモジュール
ボタン装飾だけに限定したCSSモジュール。Webでよくあるボタン状の装飾を簡単に行えます。ダウンロードはこちらから。sassのコードも同梱されているようです。色やボーダーの有無、サイズなどを簡単に指定できます。グリッドレイアウトなどのCSSフレームワークみたいなものはいらないけど、ボタンの装飾だけは手間を省きたい、って時なんかに使えそうです。
Monthly Archives: 8月 2016
[Freebie] App Icon Template for Sketch – iOS, Android用のアイコンテンプレート
Sketch用の、iOS / Andoroidアイコンテンプレート。編集から各サイズへの書き出しまで行う事ができます。またアイコンのコアな部分はシンボル化されているので（Photoshopで言うスマートオブジェクトみたいなもの）、1つ変更すれば全部変わります（iOSとAndroidでは共有化されていないようです）。それぞれデバイスのホーム画面やAppStoreではどのように見えるかのプレビューもできるようになっているので、確認しながら作りこむ事ができます。アイコン制作する時に使えそうです。
[Javascript] Grade.js – 画像から最適なグラデーション背景を生成してくれるJS
1枚の画像から、その画像に合ったグラデーション背景を生成してくれるJSライブラリ。画像内に含まれる色情報の中から、多く使われている2色を抽出してグラデーションにしているようです。この手法最近Apple製アプリケーションでよく見ますよね。iTunesでアルバムを選択している時のヘッダ色とか。Webでもこの手法が使えるというのはナイスですな。
[Web Template] HTML5 UP! Responsive HTML5 and CSS3 Site Templates – HTML5のテンプレート配布サイト
HTML5形式のWebテンプレートを多数配布しているサイト。この手の配布サイトってベースが同じで、後はバリエーション違いってパターンが多いんだけど、ココのテンプレートは様々なレイアウトのものが用意されています。しかもどれもフリー（CC3.0）。モック作る時や、サクっとLP立てたい時なんかに使えそうです。
[Web Design] Scrollanim – スクロール芸のJSライブラリ
スクロールイベントをきっかけに、何かしらの動きとともにコンテンツが出現する、いわゆるスクロール芸を行うJSライブラリ。配布ページ自体がデモページになっていて、スクロールすると色々動きます。ライブラリはCSS3とJSからできているようで、サイズが9kbと軽いのが特徴。導入も適用したい要素に属性を追加するだけのようなので、簡単に使えそうです。詳細とソースコードはGithubで公開されています。
[Misc] Motion Periodic Table – モーショングラフィックの周期表
モーショングラフィックの要素を、元素の周期表のようにならべた作品。それぞれの動きはアニメーションGifを使って紹介されています。また各項目をクリックすると詳細説明の画面に行き、動きの説明や作例、関連項目などの説明があります。動画制作とかしてる人にとっては、アニメーションやトランジションの考察として使えそう。Webでもマウスオーバーアニメーションなんかの参考になりそうです。
[Music] Beautiful album art. Updated every day. – 美しいアルバムジャケットのデザインギャラリー
クールなアルバムジャケットを毎日紹介するブログ。まだ始めて日が浅いようで作例の数こそあまりありませんが、紹介してる作品の趣味がとっても良いので、今後紹介数が増えてくるといろんな場面でのネタ帳になりそうです。ジャケットのデザインする人ってあまりいないかもしんないけど、印刷物やタイポグラフィー、グラフィックデザインの場面でもこういう作例は参考になりますな。扱うジャンルはクラブミュージック系が多い印象です。俺もロック限定のこういうサイト作ってみよかな。プログレ系とかオシャレでかっこいいジャケ多いんすよね。
[Print Design] Coverjunkie – 雑誌の表紙のデザインギャラリー
世界中の雑誌の表紙ばかりを集めたデザインギャラリー。大衆的なものよりは、どちらかというと意識高い系の雑誌が多い印象なので、印刷物デザインの良いお手本というか、ネタ帳になる気がします。ちょっとエッチなのも混ざってます。掲載作例の数も結構多いです。ちなみにわたくしPenとかGQとかナショジオとか好きです。