最近のWebサイトで使われているレイアウト・コンポーネント全102種類が揃ったデザイン素材 -Frames
Post on:2017年10月3日
sponsors
最近のWebデザインでよく利用されるヘッダやフッタのレイアウト、プロダクト、フィチャーページ、フォーム、リストなど、さまざまなレイアウト・コンポーネントが用意されたデザインのベースとなる素材を紹介します。
Webサイトのデザインで最初の作業となるカラーやフォントの定義、スタイルガイドのテンプレートなども含まれており、勉強にもよいと思います。
FramesはSketchのデザイン素材で、レスポンシブ対応のさまざまなレイアウト・コンポーネントが収録されています。
FramesをSketchで開いたところ
中身を順番に紹介します。
まずは、デザインのスターターとして、カラーとグラデーション、シャドウ、タイポグラフィの定義です。
Get Started
スタイルガイドでは、カラー、タイプフェイス、コンポーネント、モックアップ、アイコンが用意されており、これをベースにWebサイトやアプリをデザインできます。
Style Guide
ページで使用する要素はすべてシンボル化して、一括で管理できます。
Symbols
レイアウトやコンポーネントは102種類、用意されています。
その中から一部を掲載します。
まずはヘッダのレイアウト、確かにこういうデザインのWebサイトをよく見かけます。
Headers
Products
Features
Blog
Ecommerce
Forms & Contacts
Team
Testimonials
Footers
素材のダウンロードは、下記ページから。
価格に「0」を入力し「これが欲しいです」ボタンを入力すると、ダウンロードできます。
Gumroadに未登録の人は、メールアドレスが必要です。
Demo版なので、ライセンスをメールで確認しました。
CC BY 4.0で個人でも商用でも無料で利用でき、改変したり、別の作品のベースにしたり、複製したり、再配布することもできます。
sponsors
