アイソメトリック：インクの上に積み重なるインディゴのキューブと六角形のアウトライン
「アイソメトリック」モチーフの各タイルは、3 つの面を持つキューブです。上面はペリウィンクル、左はエレクトリックインディゴ、右は暗めのインディゴで、これは「2色」モードがこのモチーフに陰影を付ける方法です。キューブは、ほぼ黒のネイビーの上で「不透明度」70 でかみ合い、「エッジ」のフェードが中央を空けるため、3D 効果はレイアウトを埋めるのではなく縁取ります。6 つの点の「多角形」、つまり「柔らかさ」0 でライトバイオレットの「アウトライン」の六角形が、キューブ 1 つのシルエットを繰り返します。
自分好みに仕上げる
キューブへの光の当て方を変える
上面は「第2前景」を、側面は「前景」を使います。「第2前景」を淡いミントか白に設定すると、上からの強い光を演出できます。あるいは「カラーモード」を「単色」に切り替えると、トーンオントーンのバージョンになります。
ブロックを大きくする
キューブの大きさは「シェイプの倍率」（ここでは 30）で決まり、「間隔」は 160 です。60 ではヒーローの背後に大きな建築的なブロックが数個並び、14 ではキューブが織物のようなテクスチャに変わって、小さなカードで機能します。
よくある質問
アイソメトリックパターンは何に使われますか？
アイソメトリックのキューブは、構造、積み木、システムを連想させるため、開発者向けツール、インフラやデータのプロダクト、フィンテック、ゲーム UI に登場します。このプリセットはその考え方を保ちつつ、控えめにしています。キューブは暗い背景の上に 70 パーセントの不透明度で置かれ、中央で消えていくので、見出しやプロダクトのスクリーンショットのための余白が残ります。
使い方
パターンを作る
モチーフと、正方形、レンガ、六角形のいずれかのレイアウトを選び、スケール、間隔、ウェイト、回転、2 つのパターンカラー、背景を設定します。
シェイプとテクスチャを加える
8 つのシェイプのいずれかを単色、アウトライン、グラデーションの塗りで配置し、9 つのテクスチャのいずれかを描画モードと不透明度を指定して重ねます。
フレーミングして使う
1:1 から 9:16 までの比率を選び、ヒーロー、カード、モバイルのレイアウトでプレビューします。その後、無料の UX Pilot アカウントでログインすると、キャンバスで使用したりエクスポートしたりできます。