デザイン・開発

Coolorsは、画像から色を抽出する機能、コントラストチェック、グラデーション、共有パレットのライブラリを備えた配色パレット作成ツールです。

Iconoirは、24×24グリッドの1,600個以上のSVGアイコンを収めたオープンソースのアイコンライブラリで、MITライセンス、登録不要です。専用サイトでアイコンを閲覧しダウンロードできます。

Open Peepsは、Pablo Stanleyによる手描きのCC0ライセンスのイラストライブラリで、腕、脚、髪型、服、表情、ポーズを組み合わせてキャラクターを作れます。

Accessibility Insights for Webは、ChromeとMicrosoft Edgeの拡張機能として動くMicrosoftのツールで、すばやく調べるFastPassと、WCAG 2.1 AAを順に評価するAssessmentがあります。

Carrdは、プロフィール、紹介ページ、ランディングページのような1ページ構成でモバイル対応のサイトを、コードなしで作って公開できるサービスで、1アカウントにつき3サイトまで無料で始められます。

iconmonstrは、316のコレクションに4,784点以上の無料アイコンを収めた、検索でき、ライセンス契約に同意してダウンロードするアイコンサイトです。

Jitterは、無料テンプレートまたは白紙のキャンバスからアニメーションを作り、結果を動画、GIF、Lottieとして書き出せるウェブベースのモーションデザインツールです。

ManyPixelsギャラリーは、5つのスタイルと17カテゴリーで2万点以上の無料イラストを提供する、表示なしの商用利用を認めるライセンスのイラストギャラリーです。

Mockuuups Studioは、デザインを数千種類のデバイスや印刷物のモックアップにドラッグ＆ドロップして見せられるモックアップエディターで、ブラウザ、デスクトップアプリ、Figma・Sketch・Penpot・Adobe Expressのプラグインから使えます。

Moqupsは、ウェブサイト、アプリ、ダッシュボード向けのワイヤーフレーム、モックアップ、インタラクティブなプロトタイプ、ダイアグラムを作成できる、クラウドベースのデザインツールです。

Notepad++は、Windows向けの無料のソースコードエディターで、メモ帳の代わりに使えます。Scintillaコンポーネントを基にしており、GPLライセンスです。

知っておきたいこと: パソコンへのインストールが必要です。

Riveは、ステートマシンでインタラクティブなアニメーションやインターフェースを設計するツールです。ブラウザーのエディターとデスクトップアプリがあり、出力はiOS、Android、Web、Flutter、React、ゲームエンジンなどのランタイムで動きます。

Splineは、ブラウザーおよびMacとWindowsのデスクトップアプリでリアルタイムに共同作業しながら3Dシーンを作り、インタラクションやアニメーションを加えて、Web、Reactなどの形式に書き出せる3Dデザインツールです。

Storysetは、Freepik Companyが提供する、編集できてアニメーションもあるイラストのサイトで、無料利用にはクレジット表示が条件です。

The Noun Projectは、クリエイターが作ったベクターアイコンと写真を集めた大規模なライブラリで、SVGとPNGでダウンロードでき、無料ダウンロードと有料のロイヤリティフリーライセンスがあります。

unDrawは、ブランドに合わせて色をその場で変えられる無料のSVGイラストを提供し、表示なしで商用・非商用に使えるライセンスのイラストサイトです。

Visual Studio Codeは、Windows、macOS、Linux、ブラウザー（vscode.dev）で動くMicrosoftのコードエディターで、拡張機能、Git、統合ターミナル、デバッグを備えています。

知っておきたいこと: パソコンへのインストールが必要です。

Zedは、Zed IndustriesがRustで書いたコードエディターで、速さと、人やAIとの共同作業を目指して作られており、macOS、Windows、Linuxで動きます。

知っておきたいこと: パソコンへのインストールが必要です。

Adobe Colorは、色相環の調和ルールでパレットを作り、画像からパレットやグラデーションを抽出し、コントラストチェックと色覚シミュレーションも備えたAdobeのツールです。

Awwwardsは、受賞したウェブサイトをカテゴリーやテクノロジー別に紹介するウェブデザインのアワード兼インスピレーションギャラリーで、閲覧は無料ですが、Pro会員には作品の投稿やプロフィールの特典があります。

Color Huntは、デザイナーやアーティストが色・気分・テーマ別に既成の配色パレットを探し、新着・人気・ランダムで並べ替えられるパレット閲覧サイトです。

Dribbbleは、デザイナーが自分の作品を共有し、トップデザイナーとその作品を見つけることができ、企業がクリエイティブな人材を探すデザインプラットフォームです。

Figmaは、1つのキャンバス上でインターフェースのデザインとプロトタイプ作成を行い、チームで共同作業し、Dev Modeでデザインをコードに変換できるデザインツールで、figma.comとデスクトップアプリから利用します。

Fontjoyは、ディープラーニングでフォントの組み合わせを提案し、生成・ロック・編集のボタンで組み合わせを手動でも変更でき、Google Fontsライブラリを元にしたウェブツールです。

Google Fontsは、fonts.google.comで提供されるGoogleのフォントコレクションで、大半がSIL Open Font License、一部がApache 2とUbuntu Font Licenseで配布されています。

Google Sitesは、Google Workspaceと連携するGoogleのツールで、チーム、プロジェクト、イベントのサイトをドラッグアンドドロップでコードなしで作れます。

Leonardoは、目標コントラスト比からカラースケールと適応型テーマを生成する、アクセシビリティを最初から考えたAdobeのオープンソース配色ツールです。

LottieFilesは、無料とプレミアムの既成アニメーションを800,000点以上そろえたライブラリ、ウェブベースのLottie Creatorエディター、LottieとdotLottieの形式を備えたモーションデザインのプラットフォームです。

Mobbinは、モバイルアプリとウェブアプリの画面、オンボーディングやチェックアウトといったエンドツーエンドのフロー、インターフェースのパターン、ウェブサイトのセクションを集めたデザインリファレンスのライブラリで、無料アカウントでは利用範囲が限られます。

PageSpeed Insightsは、ページのアドレスをモバイルとデスクトップ向けに分析し、実ユーザーのフィールドデータとLighthouseのラボデータを並べて表示します。

Penpotは、インターフェースデザイン、ワイヤーフレーム、インタラクティブなプロトタイプのためのオープンソースのデザインプラットフォームです。クラウドで使うことも自分のサーバーにインストールすることもでき、SVG、CSS、HTML、JSONなどのオープン標準で動作します。

Phosphor Iconsは、画面、図、プレゼン向けのMITライセンスのアイコンファミリーで、1,248個のアイコンと6種類の太さ（Thin、Light、Regular、Bold、Fill、Duotone）があります。

Placeitは、Envatoのウェブベースのデザインツールで、衣類、デジタルデバイス、印刷、プリントオンデマンド商品のモックアップに加えて、ロゴメーカー、デザインテンプレート、動画ツールも提供しています。無制限のダウンロードはサブスクリプションで利用できます。

Rotatoは、自分のアプリやウェブデザインを30種類以上の既成の3Dデバイスの画面に配置し、アニメーション動画や画像にするモックアップジェネレーターで、macOSアプリと公開ベータ版のウェブ版があります。

知っておきたいこと: パソコンへのインストールが必要です。

Shots.soは、製品のスクリーンショットをデバイスフレーム、背景、アニメーションの動きとともにプレゼン用の画像や短い動画に変える、ウェブベースのモックアップアプリです。

Squarespaceは、テンプレート、ドラッグアンドドロップのエディター、AIサイトビルダーでコードなしにWebサイトを作れるプラットフォームで、ホスティング、ドメイン、コマースのツールを一か所にまとめています。

Sublime Textは、Sublime HQがWindows、macOS、Linux向けに作った有料のテキストエディターで、コード、マークアップ、文章での性能を重視し、Python 3.8 APIでプラグインに対応します。

知っておきたいこと: パソコンへのインストールが必要です。

Uizardは、テキストのプロンプトから複数画面の編集可能なプロトタイプを生成し、スクリーンショットや手描きのスケッチを編集可能なデザインに変換する、AI支援のインターフェースデザインツールです。

WAVEは、アクセシビリティとWCAGのエラーをWebページ上にアイコンで示すWebAIMのツールで、オンラインツールとブラウザー拡張機能の形で提供されています。

Webflowは、コードを書かずにビジュアルでサイトを設計し、CMS、ホスティング、eコマースの機能とともに公開できるWebサイト作成プラットフォームです。

WhatTheFontは、MyFontsのフォント識別ツールで、画像内の文字に似たフォントをデータベースから探し、文字プレビュー付きの一致リストを表示します。