「ソリッド」を使った今時のWebデザインの作り方がかっこいいUIキット・ページレイアウトのまとめ
Post on:2014年8月5日
ソリッドなラインを使ったアイコン、テキストを矩形で囲ったゴーストボタン、ラインで描いた幾何学模様など、ソリッドを使ったUIキット、Webページやアプリのレイアウトやテンプレートを紹介します。
いくつかはPSDファイル(無料/有料)もダウンロードできます。

斜めのグリッドをはじめ、ダイアモンドやサークル状のエレメントなどにソリッドを取り入れたスタイリッシュな縦長1ページ用のテンプレート。100MB超えのPSDがダウンロードできます。

カード状のフラットなスタイルのレイアウトに、ソリッドを巧く使い洗練されたデザインに仕上がっています。

クリーニング屋さんのiOSアプリのモックアップで、シンプルなカラースキームがソリッドスタイルにはまっています。ソリッドの細部の作り込みにこだわりを感じます。

iOS 7のソリッドなスタイルとブラーな背景や半透明のパネルを使ったUIキット。ページ用のアイコンやソーシャルサービスのアイコンもセットになっており、統一感のあるデザインになっています。

カード状のレイアウトにソリッドなエレメントを使用した美しいUIキット。ちょっと太めのストロークとカラースキームがあっておりかっこいいです。PSDは有料でダウンロードできます。

ホワイトスペースをたっぷり使い、写真を美しく見せるレイアウトがかっこいい。ミニマルなデザインにもソリッドは映えますね。

スマフォアプリのランディングページで、アプリのチュートリアルやページの各種エレメントに使用しているソリッドなアイテムは、メインとなるプロダクトをよりかっこよく引き立てています。

最近はソリッドなラインを矩形に使ったボタン(ゴーストボタン)をよく見かけますが、その最大の欠点はボタンに見えないこと。ここで使われているゴーストボタンは間違いなくボタンに見えます。

写真を美しく見せたポートフォリオサイトのレイアウト。ソリッドなアイコンは写真をより魅力的に見せています。デスクトップの各サイズやスマホ・タブレットなど、柔軟なレイアウトでレスポンシブに対応しています。

Mtv.comをリデザインしたコンセプトで、幾何学模様とソリッドなエレメントを使ってかっこよくデザインされています。ソリッドな幾何学模様とかローポリならアー写に使ってもOKがもらえそう。

GPSを使ったスマホアプリのUI、静止画でも十分かっこいいですが、元ページのアニメーションを見るともっとかっこいいです。iOS/Android両対応です。

ちょっと太めのソリッドなラインを随所に使ったページレイアウト。クリック・タップ可能な箇所と単なる囲いが混在していますが、迷うことはないでしょう。
sponsors