Andoroidで作れるデザインパターン探している。そんな方におすすめなのがAndroid Patternsだ。

選択フォームの出し方やデータの表示方法など、UIに関するノウハウをまとめたサイトになっている。

投稿もできるようになっているので、wiki的な使い方ができるようになっている。

将来的にAndoroid対応は色々と必須だと思うので、こういったノウハウは覚えておいた方が良さそうですね！

フリーでデザイン素材を配布しているPremium Pixelsから
商用利用可能なマガジンスタイルのPSDテンプレートが「MAGAZINE STYLE WEB LAYOUT (PSD)」というエントリーにて配布されていたのでご紹介。

PSDファイルは３つ同梱されており、ホームページ、カテゴリページ、ポストページがそれぞれ含まれています。

すべてのファイルは個人および商用利用可能ですが、
販売または再配布することはできません。

有料ですが、同じデザインのWordPressテーマもダウンロードできるようになっていました。
デザインの参考にも使えそうですね。

新年あけましておめでとうございます。
今年もウェブ開発に関する情報を中心に、皆様に役立つ情報をお届けできるように頑張ります。
本年もよろしくお願い致します。

それでは早速１つ目の記事です。

ブログのフッターをかっこよくデザインしたい時に参考になりそうな、『30 Creative and Attractive WordPress Footer Designs』をご紹介。
WordPressで作られたサイトのクリエイティブなフッターデザイン30選になっています。

以下にいくつかご紹介。

Morphix

ヘッダーは空、メインコンテンツは地上、フッターは地中になっており、
パーツ毎に背景が変わるようになっています。
ぜひご自分で確認してくださいませ。

chirp

余白をがっちり使って背景画像で楽しませてくれています。
ヘッダーで空をイメージさせてフッターは街中を表現するというのは、結構多いパターンかも知れないですね。

Hebatec

検索フォームやhomeボタン、TOPに戻るなどをアイコン化。

kidd81

全体的にうるさい感じのデザインです。
フッターの謎の静物にマウスを載せるとドラッグできるようになっています。

duplos

ページにアクセスするとまずフッターまでぐーんとスクロールします。
フッターから上にスクロールさせる導線が面白いですね。

というか、フルFlashで出来ているのですが、
これはWordPressじゃない気が・・・
まぁ面白いので載せておきます。

creamy CSS

フッターがamazonのアフィリエイトになっています。
この発想はなかった。
これは真似したいです。

the pixel

ぜひサイトに訪れてヘッダーからの流れを見てほしいサイトです。
ストーリーを感じれるのが良いですね。

クリエイティブなフッターデザイン、チェックしてぜひデザインの参考にしてください！
その他のリストは以下からどうぞ。

使い方は2つのCSSを読み込むだけになっています。

input要素やtextareaの配置だけでなくエラーメッセージにも使える要素がありました。

デモ

フォーム周りは以外とCSSを書くのが大変なので、こういったフレームワークの登場は嬉しいですね。

クロスブラウザにも対応しており、カスタマイズも簡単にできるそうです。
興味のある方はダウンロードしてみてください。

いざ探そうと思ったときには中々良いものが見つからないので、覚えておきたいですね。

詳しくは以下

BrushKing

サイト

山ほどダウンロードできます！
現在では6000個以上のブラシがダウロード可能になっています。

brusheezy

サイト

厳選されたブラシを紹介してくれます。
500以上のブラシあり。

Photoshop Brushes

サイト

ブラシ以外にもカスタムシェイプやパターンファイルがダウンロードできます。

GetBrushes.com

サイト

クールなPhotoShop用ブラシがダウンロードできます。

deviantART

サイト

デザイナーのためのコミュニティサイト。

FBrushes

サイト

5000個以上のブラシが探せます。テクスチャもあり。

WOW Brushes

サイト

ベクター素材も置いてたりします。

PS Brushes

サイト

500以上のブラシがあります。

QBrushes

サイト

カテゴリ以外にもタグから検索可能。

Celestial Star

サイト

Paint Shop Pro用のブラシも配布。サイトデザインもきれいです。

Free-brushes

サイト

Photoshop、GIMP、Paint Shop Proそれぞれのブラシがあります。

In obscuro

サイト

対応しているPhotoshopのバージョンも細かく明記されています。
7.0に対応しているブラシも多かったので、まだCSを使ってない方には良いかもしれません。

Brushfed

サイト

かなり個性的なブラシが多い。

bashcorpo

サイト

コミカルなデザインブラシが多い。

BioRUST

サイト

ブラシの他にアクションもダウンロード可能。

Brushes Download

サイト

4000個以上ダウンロードできます。

Findbrushes

サイト

ブラシ検索エンジン。1万3千以上のアイコンから探す事ができます！

Adobe – Photoshop Brushes

サイト

言わずと知れたAdobeのサイトです。ここにもハイクオリティなブラシがたくさんあります。

個人利用の場合は全て無料ですが、商用利用の場合はそれぞれライセンスをご確認ください。
サイトでは他にもまだまだ紹介されています。興味のある方はぜひご覧になってください。

現時点で166サイトが掲載されています。

詳しくは以下

全部を見るのも大変なのですが、一部ご紹介。

The FWA

公式サイト

Lookom

公式サイト

DOPE Awards

公式サイト

Red Hot CSS

公式サイト

感性を磨くのにいかがでしょうか。

有料のWEBサービスやアプリケーションなどの金額ページをデザインする際、分かりやすさや比較のしやすさなどパッと見てわかるものが良いですよね。
素敵なデザインの価格ページを作る事で収益に結びつくようにしたい人のためのデザインまとめです。

詳しくは以下

無料のものや比較しやすい表組み、グラフの使用など様々なテクニックが駆使されています。
いくつか気になったものをご紹介。

Appfigures

iPhoneアプリの売上やレイティングの解析サービス。
表示面積と色で効果的に違いを表現しています。

公式サイト

SearchFit

サイト内検索エンジン。
色毎に機能の違いを。

公式サイト

Vzaar

ビデオプレイヤー。イーベイ・オークションなどに埋め込めるみたいです。
おすすめのプランを強調

公式サイト

Baddlewords

AdWordsのサポートツール。
こちらもおすすめを強調。

公式サイト

Jimdo

ホームぺージ作成サービス。
有料版が強調されていますね。

公式サイト

Invoicemore

納品書サービス。

公式サイト

Sipgate

電話のクラウド化を行うサービス。
まずは無料をという場合の表現に。

公式サイト

Brinkster

ホスティングサービス
項目の数と機能をわかりやすく。

公式サイト

The Resumator

求人サービス。
無料を強調。

公式サイト

PodcastPeople

ポッドキャストを作成できます。
濃淡を使い分けて違いを表現。

公式サイト

Talkerapp

チャットサービス。
半額のプランを効果的に見せています。

公式サイト

Chargify

支払いサービス。
グラフによる視覚効果。

公式サイト

Dropbox

オンラインストレージサービス。
箱が大きくなります。

公式サイト

Pointkit

フリーランス用の時間管理サービス。
試用期間の見せ方に。

公式サイト

Pdfthemes

WordPress用テーマがPSDファイル付きでダウンロードできるサイト。
違いが比較しやすいですね。

公式サイト

とても全て紹介しきれないので、ぜひサイトをご覧になってみてください。

装飾を極力少なくし、テキスト中心のデザインで作成されたテーマが集められています。

詳しくは以下

Simplicity

デモ ダウンロード

Grid Focus

デモ ダウンロード

Modio

デモ ダウンロード

iA3

デモ ダウンロード

Structure

デモ ダウンロード

Vostok

デモ ダウンロード

Smart Portfolio

デモ ダウンロード

こういったデザインを起こすにはかなりのバランス感覚が必要ですよね。シンプルなだけに難しいと思います。
テーマが必要になった際に、ぜひダウンロードしてみてください！

ざざっとご紹介します。

Barista

公式サイト

Firetask

公式サイト

Nota

公式サイト

Sudoku

公式サイト

Finger

公式サイト

iPhone・iPod touch用アプリ専用のサイト作りはひと味ちがったデザインで見てるだけでも面白いですね。
サイトには他にも紹介されているので、興味のある方はぜひ。

フォーマットはJPG形式になっています。

背景画像を探している方、いかがでしょうか。