色覚多様性(色盲)に配慮したデザインとは?アクセシビリティチェックの方法【Figmaテンプレ付】

「色覚多様性」という言葉を知っていますか? 100人いれば見え方も100通り。色の見え方はひとりひとり異なります。 色覚多様性とは、人が色を認識する能力に個人差があることです。 現代社会ではWebサイトやアプリ、公共の案 […]
ユーザーの行動を導く。UIデザインのボタンルール【Figmaテンプレ付き】

デザインにおいて、”ボタン”はユーザーの行動を促す重要な要素です。 特にウェブデザインにおいては、クリック率(CTR)を向上させたり、 システムデザイン上でユーザーが行うべき行動を視覚的にわかりやすく指示するために、ボタ […]
ユーザーを惹きつける「余白」のデザインテクニック【Figmaテンプレート付】

デザインにおける「余白」とは、単なるスペースではなく、UX(ユーザーエクスペリエンス)を向上させるための重要な要素です。適切な余白を設定することで、情報の可読性が向上し、視覚的なストレスを軽減することができます。 本記事 […]
【デザイン講座】プライマリーカラーとセカンダリーカラーの決め方[後編]
![【デザイン講座】プライマリーカラーとセカンダリーカラーの決め方[後編]](https://design-studio.engineerforce.io/wp-content/uploads/2025/05/26 プライマリー後編-1024x537.jpg)
今回は、【デザイン講座】プライマリーカラーとセカンダリーカラーの決め方[後編]です! [前編]では、プライマリーカラーとセカンダリーカラーを決めるにあたって重要なデザイン原則の基礎知識『キーカラー』や『メインカラー』につ […]
プライマリーカラーとセカンダリーカラーの決め方[前編]【テンプレ付】
![【デザイン講座】プライマリーカラーとセカンダリーカラーの決め方[前編]のサムネイル](https://design-studio.engineerforce.io/wp-content/uploads/2025/05/CTRプライマリー前編-1024x537.jpg)
みなさんは、『プライマリーカラー』と『セカンダリーカラー』という言葉を聞いたことがありますか? ウェブデザインやUI/UXデザインにおいて、色の選択は非常に重要です。特に、プライマリーカラー(主色)とセカンダリーカラー( […]
『RGB』と『CMYK』の違いとは?:印刷からウェブデザインへの変換方法

みなさんは、『RGB』と『CMYK』という単語を聞いたことがありますか?これは、色を表現するための異なる方法であり、特に印刷やウェブデザインにおいては欠かせないデザイン知識です。 そこで本記事では、デザイン初心者でも理解 […]
対比とは?デザインにメリハリを与える基本と事例【Figma付】

みなさんは、『デザインの4原則』を聞いたことがありますか?これは、デザイナーが押さえておくべき視覚的なデザインを行う際の基本的な原則のことで、これを学ぶことでデザインの質を格段に向上させることができます。『デザインの4原 […]
デザインの反復とは?統一性を高める基本と実例【Figmaテンプレ付】

みなさんは、『デザインの4原則』を聞いたことがありますか?これは、ウェブデザインやシステムデザインを行う際に必要な基本的なデザイン原則のことで、これを学ぶことでUIUXが格段に向上し、ユーザーに高品質な商品やサービスを提 […]
整列とは?デザインを美しく見せる原則と使い方【Figmaテンプレ付】

デザイナーが最初に習う『デザインの4原則』というものがあります。今回はその中の1つである「整列」に関して考えていきましょう。 \ Figmaテンプレで作業を効率化しよう! / ※ 無料・個人情報入力不要。クリックするとF […]
近接とは?デザインの原則と効果的な使い方【Figmaテンプレ付】

本記事ではデザイナーが最初に習う『デザインの4原則』。今回はその「近接」「整列」「反復」「対比」の1つである「近接(きんせつ)」について考えていきます。 1. 近接の基本概念 『近接』とは、視覚的な距離によって情報の関連 […]
