Webサイトやブログなどでよく見かけるデザインのひとつとして、コンテンツ、写真スライダーを利用しているケースがあります。
グラフィカルなデザインに動きを加えることで、より一層コンテンツにユーザーの目を惹くのではないでしょうか。
海外デザインブログDesignModoで、色々なスライダー素材をデザインしたPhotoshop用無料PSD素材を30個まとめたエントリー「Huge Collections of Different Kinds of Free Slider (PSD Files)」が公開されていたので、今回はご紹介します。
そのまま利用したくなるほどハイクオリティーなデザインが多くまとめられており、お気に入りのひとつを見つけてみてはいかがでしょう。
詳細は以下から。
スライダーの使い方いろいろ
最近のWebサイトに見かけるスライダーの利用方法の多くは、コンテンツやギャラリーなどにスポットをあてた情報を順番にスライドさせています。
[download_box]特にjQueryを利用することで、アニメーションを加えたダイナミックな動きを表現可能となります。
jQueryについて詳しく触れた以下の記事は、個人的にもとても参考にさせてもらっています。
クライアントワークでよくお世話になっているjQueryプラグインいろいろ – Webデザインレシピ[/download_box]
印象的な画像スライダーをデザインするPSD素材まとめ
立体的な影をデザインしたスライダー素材、写真ギャラリーなどに活用することができそうです。
ページ送りにサムネイルを利用したスライダー素材、特集コンテンツなどの展開にいかがでしょう。
シンプルな質感を高めた横型ワイドなスライダー、☞ボタンもポイントです。
こちらもシンプルでどんなデザインにも合わせやすいスライダー用デザイン素材。
写真を多く利用するWebサイトやブログなどを中心に利用したいスライダー素材。
スライダーをデザインしたPSD素材と一緒に、HTMLであらかじめコーディングされたデモも一緒にダウンロード可能。
Create Your Juicy Tabbed Slider (Free PSD)
細かい部分まで作り込まれたUIデザインの作り方を紹介したチュートリアル、一緒にPSDフィアルもダウンロードできます。
画像と一緒に合わせて立体的なリボン素材を組み合わせたスライダーデザイン。
写真を無造作に重ねたような様子を表現したスライダーデザイン、矢印やページ送りなどもスッキリとした素材。
こちらもシンプルで使い勝手の良いスライダー各２種類、淡いグラデーションがナイス。
Free PSD: Clean & Simple Image Slider
個人的にお気に入りのデザイナーさんが作成したスライダー素材、まさに即戦力な一品。
トグル部分のみとなりますが、アプリなどに利用したいグラフィカルなPSD素材。
本物そっくりに再現されたメタリックなつまみとスライダー、色使いも鮮やかです。
ネオン管のようにぼんやりと輝くデザインが印象的なスライダー用PSD素材、各3色揃っています。
立体感たっぷりにデザインされたスライダー用PSD素材、ツールチップもセットになっておりそれぞれノイズテクスチャを適用。
思わず触りたくなる様なトグルデザインを利用したスライダー素材、そのまま活用してもよさそうです。
Free PSD: Horizontal Accordion Slider GUI
水平方向に展開するダーク系スライダーデザイン、コンテンツ紹介などにいかがでしょう。
[fancy_box][参照元 : Huge Collections of Different Kinds of Free Slider – DesignModo][/fancy_box]
