制作に非常に便利なテクスチャ。デザインの質感を高めてくれたり、何か物足りないときに非常に便利に使える素材の一つです。今日紹介するのはハイクオリティなテクスチャを集めて配布する「startxtures」を紹介したいと思います。
サイトは非常にシンプルな作りで、なおかつ、最新のテクスチャ、人気のテクスチャ、タグ検索、細かなカテゴリ分など機能的な部分は整えられています。配布テクスチャもかなり高解像度で、WEBに限らず、様々な制作で利用できそうです。
詳しくは以下
制作にとても便利なテクスチャ。さまざな質感を簡単にデザインに付与してくれますが、今回紹介するのはそのなかでも汎用性が高く、どんなデザインにも使える紙のテクスチャを集めたエントリー「35 High-Quality and Free Paper Textures」です。
Free High Res Grungy Paper Textures | BittBox
方眼用紙のようなものから、少し古びた紙、グランジの効いた紙などなど、様々なテクスチャがまとめられています。セットの内容がいくつか掲載されていましたので、下記に紹介したいと思います。
詳しくは以下
軽量で非常に高機能なjavascriptライブラリ「jQuery」。様々なプロジェクトで利用されていますが、今回紹介するのはjQueryをつかったイメージギャラリーを集めたエントリー「20+ jQuery Image Gallery for your next project」です。
AviaSlider – a unique jQuery Image slideshow plugin
画像と画像の間のエフェクトに凝ったものから、フューチャーリストのようにサムネイルと連動しているものまで様々なイメージギャラリーが紹介されています。今日はその中から幾つか気になったものを紹介したいと思います。
詳しくは以下
SEO的にも問題の無い縦書きのコンテンツを作りたい。そんな時に便利なのが、今回紹介するjavascriptライブラリ「竹取JS」です。javascriptで指定されたブロックを縦書きに変換してくれます。
HTMLのみで縦書きというのは非常に面倒でしたが、これなら気軽に縦書きコンテンツを作れそうです。
詳しくは以下
一から全てデザイン、制作することは精度も上がりますし、クリエイターとしては当たり前のことなのかもしれませんが、案件ベースで見て、予算や時間的な問題で、デザイン、設計などを全てオリジナルでこなそうと思うと無理がある案件もあるかと思います。そんな時に役立つのが今回紹介するWEBデザイナーのためのフレームワーク30「30 Useful Frameworks for Designers」です。
よく見るグリッドシステムから、シンプルなCSSのデザイン処理を集めたもの、wordpressのテンプレートを作るためのものなどなど、制作の負荷を軽減してくれる、様々なフレームワークがまとめられています。今日はその中から幾つか気になったものを紹介したいと思います。
詳しくは以下
開発者の間では次世代の規格として注目を集めているHTML5。様々な可能性を示してくれていますが、今日紹介するのはPCようでは無く、モバイル用のモバイル用のHTML5フレームワーク「Sencha Touch」です。
このフレームワークはWEBアプリに、iphoneアプリやアンドロイドアプリ並みのデザインと、操作感を可能にするフレームワークで、HTML5とCSS3を使って構築されています。
詳しくは以下
webサイトを制作する上で、必ず必要となるグローバルナビは、ユーザーがもっとも多く通過する重要な要素となっており、グローバルナビの分かりやすさ使いやすさは、webサイトの最重要課題ではないでしょうか?そこで今回紹介するのは、デザイン性が高く、ユニークな動きを手軽に取り入れることができるグローバルメニュー用JQueryまとめ「Excellent jQuery CSS Animated Navigation Menu Tutorials」です。
(Beautiful Slide Out Navigation: A CSS and jQuery Tutorial | Codrops)
どんなサイトにも使いやすいシンプルなデザインから、ポップで印象的なデザインまでさまざまなグローバルメニューが紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインに厚みを出す際に欠かせない背景等のパターンですが、手の込んだデザインが必要となり、1から作り上げるのには時間と手間が掛かってしまいます、そこで今回紹介するのが、素材として利用しやすいPhotoshopパターン集「Ultimate Collection Of Free Photoshop Pattern」です。
(Paper Patterns for PS and Gimp by *starsunflowerstudio on deviantART)
シンプルなパターンから、華やかなパターンまで、さまざまなタイプの素材が紹介されています。中でも特に気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
さまざまな画像加工処理が可能なPhotoshop。デザインシーンで活躍するソフトですが、機能が豊富なだけに使いこなせていない、表現の幅がどうしても広がっていかないという方は意外に多いのではないでしょうか?そんな中今回紹介するのは、豊富なPhotoshopチュートリアルをまとめた「Top 100 Tutorials for Mastering Photoshop」です。
Design a Dark Surreal Urban Scene with Space Brush in Photoshop – PSD Vault
いろんな種類のチュートリアルが紹介されており、ほしいデザインイメージに合わせて参考にすることができそうです。
詳しくは以下
テキストをリッチに装飾して印象的に見せてくれるテキストエフェクト。エフェクトによってがらりと全体の印象が変わるので、重宝します。今回ご紹介するのは、そんなテキストエフェクトを制作する際に役立つ、ハイクオリティなチュートリアルまとめ「New Free Text Effect Photoshop Tutorials (30 Tuts) 」です。
New York text effect photoshop tutorial on Behance
レトロな雰囲気のエフェクトから、ポップな雰囲気のエフェクトまで多数のテイストのテキストエフェクトが30種類揃っています。
詳しくは以下
(さらに…)
世界中で広く利用されているCMSの一つWordpress。個人の方のブログから企業サイトまで幅広い用途で利用されています。利用者が多いだけあって豊富にテーマが配布されているというのもWordpressの魅力の一つです。今日紹介するのは新たにリリースされたクリエイティブなWordpressテーマを集めたエントリー「10 Fresh, Free WordPress Themes (April 2016)」)です。
Passionate — Free WordPress Themes
License: Free for personal and commercial use | GNU General Public License
シンプルなものからデザイン的に作りこまれたものまで、様々な用途のテーマが紹介されていましたので今日はその中から気になったものを幾つかピックアップして紹介したいと思います。
詳しくは以下
通常のWordPressのページナビゲーションは「« Previous Page Next Page » 」として表示され、今何ページ目にいてどのくらい続きがあるかが直感的に分かりません。
そこでそんなインターフェイスの不便利を解決してくれるのが今回紹介するプラグイン「WP-PageNavi」です。
プラグインを導入すればページナビゲーションが上記のように表示され、今何ページ目にいるのかが瞬時に分かるようになります。ほんの少しの事ですが、閲覧する側を考えれば当然の配慮かと思います。
1.WP-PageNaviからプラグインをダウンロード
2.ローカルで展開後フォルダごと「wp-content/plugins」へアップロード
3.「WP-PageNavi」プラグインの有効化
以上です。
これだけではページナビゲーションは反映されませんので下記の手順を踏んでください。
導入方法は以下
(さらに…)
WEBを制作するにあたって欠かせない技術の一つCSS。工夫や発想次第で様々な表現が可能ですが、今日紹介するのはCSSを使ったテクニックをジャンル別に紹介するエントリー「40 Outstanding CSS Techniques And Tutorials」です。
Cross Browser Multi-Page Photograph Gallery
イメージギャラリー、ナビゲーション、ボタンなどシーンに併せたテクニックが全部で40個紹介されています。今日はその中からいくつか気になったものピックアップして紹介したいと思います。
詳しくは以下