これらのデザイン リソースの Web サイトとフォントはニッチで使いやすく、すべて無料です。

販売者はデザイン リソースを使用してストア/Web サイトを美しくし、コンバージョン率を高めることができます。この記事では、Web サイトのデザイナーや開発者に適したツール、コーディング リソース、フォントやカラーリソースなど、2019 年の最先端の Web デザイン ツールとフォントをレビューします。これらはすべて無料です。

1. 404 イラスト

https://www.kapwing.com/404-illustrations

404 Illustrations は 404 ページ生成ツールです。クールでスタイリッシュなイラストが提供され、以下に示すように、ページで発生したエラーに基づいて画像にテキストを添えることもできます。

2. 311 製品管理の無料リソース

https://usefyi.com/templates/製品管理テンプレート/

このツールには、多くの無料の製品管理ツールとテンプレートがリストされているため、製品を作成、リリース、管理するためのツールを簡単に見つけることができます。

3. リアルデヴ

https://real.dev/?business=1

Real Devは開発者向けのコミュニティ プラットフォームです。企業はこのツールを使用して、実際のプログラミング経験を持つ開発者を見つけることができます。

4. パターン

https://lstore.graphics/paaatterns/index.html

このツールには多くのベクター画像テンプレートが含まれており、レイヤースタイルやベクターグラフィックをカスタマイズおよび編集できます。

5. SaaSページ

https://saaspages.xyz/

このツールは、多くの優れた独立した Web サイトのランディング ページを収集します。ランディング ページのデザイン方法やコピーの書き方がわからない場合は、この Web サイトにアクセスしてインスピレーションを得ることができます。下の図に示すように、最もコンバージョン率の高いランディング ページの各要素を複数のセクションに分割し、高度なランディング ページに関する多くの記事とグラフィックを共有しています。

6. ヴェルビー

https://www.verby.co/

Verby は、純粋なオーディオ MP3 オーディオ ファイルを作成またはダウンロードできる無料のテキスト読み上げツールです。

7. 重ね合わせ

https://superposition.design/

Superposition では、テーマカラー、Web ページのレイアウト、画像とテキストの間隔など、Web サイトの既存のデザインを抽出できます。これを使用すると、Web サイト、アプリ、さらにはプロジェクト間の一貫性のバランスをとることができます。

8. ダイナミックチャート

https://dsternlicht.github.io/react-dynamic-charts/

Dynamic Charts は、動的なデータに基づいてアニメーション化されたチャートやその他の視覚化を作成するための React ライブラリです。

9. ビジュアルサイトマップ

https://visualsitemaps.com/

VisualSitemaps は、UI 監査、ユーザー エクスペリエンス、SEO、市場調査に使用するために、あらゆる Web サイトのサイトマップと HD スクリーンショットを自動的に生成するツールです。

10. コンポーネントAI

https://components.ai/

Components AI は、自動生成設計システムを開発するための実験的なプラットフォームです。ウェブサイトのデザインのインスピレーションを見つけたい場合は、このウェブサイトをご覧ください。

11. アバントUI

https://www.avantui.com/

Avant UI は、Bootstrap フレームワークをベースにした開発ツールキットで、Bootstrap よりも美しく、より高度な外観を備えています。 Avant UI は、より完全な Web ページ フレームワークを設計するための新しい要素を追加します。

12. エヴァデザインシステム

https://eva.design/

このツールには何百ものロゴとスタイル構成が含まれており、このツールを使用して Web サイトとアプリのデザイン スタイルの一貫性を保つことができます。

13. クリエイティブマシン

https://creativemachine.co/

Creative Machine は、パーソナライズされた広告クリエイティブを作成できるオンライン画像エディターです。テンプレートに従って作成したローカル画像をアップロードし、ダウンロードすることができます。

14. スワイプミックス

https://apps.apple.com/us/app/swipemix-layouts-collages

Swipemix を使用すると、高度な Instagram レイアウトを作成したり、複数の画像を含む Instagram スライドショー広告を作成したりできます。

15. ホイールキャップ

https://free.hubcap.video/

Hubcap は、インストールやダウンロードを必要としないスクリーン キャプチャおよび録画ツールです。録画を開始するためのカスタム リンクを追加するか、Web サイトにボタンを追加します。

16. フリーミアム

https://freemium.cc/

Freemium の Web サイトには、デジタル コンテンツ作成者に適した一連の無料の付加価値ツールもセクション形式でリストされています。このサイトでは、デザインを作成したり、無料のデザイン リソースを見つけたり、クリエイティブ チームと共同作業したりすることができます。

17. マテリアルアイコンライブラリ

https://icons.pixsellz.io/

マテリアル アイコン ライブラリには、丸型アイコン、アウトライン ベクター アイコン、ツートン スタイル アイコンなど、約 1,000 種類の人気のアイコン マテリアルが含まれています。

1.塩

https://www.behance.net/gallery/80296873/Salt-a-free-font-by-Masha-Chuproba より

塩は商業利用は無料です。以下に示すように、これはミニマリストで重心の低いサンセリフ フォントです。通常と太字の2 つの属性があります。

2.オリバー

https://freebiesbug.com/free-fonts/oliver/

このフォントは商用利用も無料です。モダンなサンセリフフォントで、期間限定で無料デザインを提供しています。このフォントには、以下に示すように、ライト、レギュラー、太字の複数の形式があります。

3. ベイシエ・モノ

http://atipofoundry.com/fonts/basier-mono

Basier Monoには、丸型と角型の 2 つのフォント ファミリがあり、非常に特徴的な外観になっています (下図参照)。通常のスタイルは無料で使用できますが、フォント ファミリ全体を取得する場合は料金を支払う必要があります。

4. ココマット

https://www.myfonts.com/fonts/zetafonts/cocomat-pro/

このフォントは主にイタリアのイタリック フォントで、さまざまな太さがあり、以下に示すように、通常バージョンは無料で使用できます。

5. ランズダウン

https://pixelbuddha.net/freebie/lansdowne-decorative-font

このフォントはシンプルでレトロであり、そのデザインは古い広告フォントからインスピレーションを受けています。このフォントは角張っていて四角いですが、以下に示すように、クラシックなレトロな雰囲気を保っています。