デザイン

デザイン

PR

【2018年版】ユーザーインターフェイスが簡単に作れる!無料UIキット集

Designmodo

Designmodo publishes web design articles, tutorials and has a great shop with the best WordPress and Bootstrap themes, plugins, UI Kits and more.

本記事は、Best Free Website and Mobile UI Kits for 2018
翻訳・再構成したものです。
配信元または著者の許可を得て配信しています。

1,639 views

読了時間 : 約5分2秒

現代の速い生活のペースについていくため、私たちは、迅速に仕事を成し遂げる方法を常に探しています。高速ワイヤフレーミングは、その結果です。初めのうちは、みんな疑っていましたが、現在ではこれなしには何もできないほどになっています。

 

ビジネスには、オンラインツールが必須です。これは、すでに常識です。 その結果、高い需要が供給を上回ることがあり、このような状況では、ウェブサイトおよびモバイルUIキットが役立つのです。

 

Landing UI Kitは、ランディングページを作成するために必要なものがすべて揃っていて、無料ツールでありながらも問題の解決に大変役に立ちます。 Material Design UI Kit by UXpinやVera Blockをチェックしてみてください。 これら両方のモバイルUIには、さまざまな形式の素材と画面が大量に揃っていて、どんなアプリにも合うものです。

 

Free Website and Mobile UI Kits

 

Landing UI Kit

 

Material Design UI Kit

 

Vera Block

 

 

無料のUIパックは、Webサイトを構築するためでもモバイルレイアウトを構築するためでも、ゼロから全てを作る煩わしさからあなたを救う、初めの一歩となるでしょう。まず無料のウェブ UIをチェックしましょう。 (ビジネスでは、よくウェブサイトがモバイルアプリも先に作られるからです。)ここではいくつか役に立つフリーサイトをご紹介します。

 

これからご紹介する4つのは、いろいろ揃っています。 美しいニュートラルなデザインで、多くの目的に使用することができるでしょう。 たとえば、Consulexは、インターフェースを構築するための要素だけでなく、ウェブテンプレートも揃えています。 自分の好きに作ったり、既製のものを使ったりできるのです。

 

Consulex Free UI Kit & Web Theme

 

Visageは、すっきりとしたデザインの役立つ画像を揃えています。 ギャラリーからオーディオプレイヤーまでさまざまなアイテムがあります。

 

Visage UI Kit

 

Irisには、たくさんのウェブ素材があります。ヘッダー、フッター、カバー、CTAバナー、ビデオプレーヤーなどを揃えています。

 

Iris UI Kit

 

控えめなパステルカラーにこだわるUIセットとは違い、CSS作者が作ったキットは、驚くほどの色域です。 緑、黄、赤、青、灰色、黒、白が使用される無料素材は、エネルギッシュです。

 

SPOT UI Kit by CSS Author

 

もちろん、すべての無料のUIサイトが、今回ご紹介するもののように大きく、包括的で広い用途のものをそろえているとは限りません。 原則として、1つの特定のテーマにこだわり、重要な要素だけをカバーしたものをそろえています。

 

ですが、既存の基盤上に他のコンポーネントで簡単に構築できれば、それで十分なのです。 スタイルに合ったパズルのピースを見つければいい。 しっかりした基盤としては、Peach Dating by Basari DesignTake Meand Addstractを検討してください。

 

Take Me Free UI Kit

 

Peach Datingはデートサービスを念頭に置いて作られています。色を変更したり変更を加えなければ、フェミニンなプロジェクトに合います。

 

 

Take Meは、旅行指向のインターフェースを構築するためのUIキットです。 ベースとしてBootstrapのグリッドを使用し、実用的なHTML / CSSプロトタイプへの変換を簡略化します。

 

Addstractにはライトとダークの2つのテーマがあり、テキストブロックや一般的なウィジェットのセットなどの特定のコンポーネントが含まれています。

 

Addstract

 

モービルUIキット

モービルUIは基本の2つから始めます。

これらは最近のパグリックリリースの全要点を網羅しています。

 

iOS11 by Facebook

 

 

Facebookによるキットには、3種類のフォーマットでコンポーネントとスクリーンをそろえています。- スケッチ、フォトショップそして最も重要なOrigami。

 

Iosdesignkitによるパッケージは、facebookのものほど洗練されていませんが、優れたものです。 ヒューマンインタフェースガイドラインに従い作成された60の要素を網羅し、インタフェース構築に役に立ちます。

 

iOS 11 UI Kit

 

 

一般的でiPhone風なのが欠点です。ウェブ上には、本当に独創的なUIがあります。 Cook Application by CreativeTacos とFinance UI Kit.をみていきましょう。

 

Cook Application by CreativeTacos

 

名前にある通り、 CreativeTacosのUIキットは、レストランをテーマにしたインターフェース用です。 予約、メニュー、ログイン、地図などを含む20のスクリーンが揃っています。

 

Free Finance UI Kit

 

ここには沢山のUIがありますが、最も人気のあるものは写真とEコマースを中心としたものです。

 

Photography Themes

どこでもセルフィーが撮影されるように、フォトUIは非常に人気があります。 インスタグラムのようなコンセプトを作るためのものが必要なら、Moon Heart by Tung Vo Chiを見てください。

 

Tung Vo Chiは、ソーシャルメディアで画像を共有できるようにするアプリケーションのデザインを作成しました。 ビジュアルとテキストデータのバランスが取れており、レイアウトが整っていています。

 

Moon Heart by Tung Vo Chi

 

 

E-commerce Themes

Eコマースもまた大きな分野です。 Epic Shop UI Kit by EpicCoders と Helen by Igor Ten は、バランスのとれたレイアウトを持つインターフェースの優れた一例です。

 

両方のテンプレートとも、明るい色と多くのスペースがあります。 画像は全て適切に配置され、コンテンツは読みやすく、デザインは重くありません。

 

Epic Shop UI Kit by EpicCoders

 

Helen – Free iOS E-commerce UI Kit by Igor Ten

 

Dashboards and Statistics

ここでは、ダッシュボードを構築するためのアセットもご紹介します。ウェブやモービルアセットほど重要でないかもしれませんが、それでも需要があるからです。 このカテゴリでは、UI Kit Dashboard by Max Kalik aとCarsive dashboard UI kitをご紹介します。

 

Max Kalikは、クラシックなダッシュボードを作るのに適した要素を含む小さなキットを配布しています。 このパックは、メインページ、多数のモジュール、ガイドライン、ポップアップ、および多数の小さな要素が揃っています。

 

UI Kit Dashboard by Max Kalik

 

 

Ahmed Hasan Bakyは、統計を種にしたページ、モジュール、ウィジェットを作成するための膨大なセットを揃えています。背景としては黒を使い、明るいを数色を使って見せることで、デザインを際立たせています。

 

Carsive Dashboard UI Kit

 

結論

クイックプロトタイピングは私たちの生活の大部分を占めています。 品質を落とすことなく、短期間でタスクを遂行し、さまざまなインターフェースを作成するために役立ちます。もちろん、ゼロから何かを作成することは、誰もがやってみたいと思うことです。 しかし時間の制約があればフリー素材が便利です。

 

UIセットが便利だと思いましたか?使ってみようと思いますか?

おすすめ新着記事

おすすめタグ