{"id":"adobe-spectrum","no":544,"name":"Adobe Spectrum","ja":"Adobe Spectrum","era":"2013–","family":"プラットフォームの画面言語","kind":"スタイル","collection":"Dictionary expansion 27","addedAt":"2026-08-22","source":{"title":"Adobe Spectrum — Principles","url":"https://spectrum.adobe.com/page/principles/"},"reference":{"status":"verified","pageUrl":"https://spectrum.adobe.com/page/principles/","credit":"Adobe Spectrum — Principles"},"essence":"Adobeの制作アプリ群を横断するためのデザインシステム。Rational、Human、Focusedを原則に、デスクトップとモバイルで密度の尺度を切り替え、道具の数が多い画面でも制作物へ注意を戻せるようにする。","cues":["濃淡の異なる中立面に、選択中だけ鮮色を置く","アイコン、文字、境界線が同じ密度尺度で拡大する","ツールバーとプロパティパネルが細い区切りで連なる","前景の制作物がUIより強く見える"],"intents":["技術","信頼","静けさ"],"works":["画像・映像・文書を編集する制作ツールで、操作面を後景へ退かせたいとき","同じ製品をデスクトップとモバイルへ展開し、密度だけを体系的に変えたいとき"],"recipe":{"type":"小さなラベルでも潰れないサンセリフを使い、見出しより操作名の判別を優先する。","layout":"作業面を中央に取り、道具と属性を周縁の帯へ固定する。密度の変更は全要素を同じ比率で行う。","material":"地は中立色の段階で組み、選択・焦点・警告にだけ鮮色を割り当てる。"},"avoid":"パネルを暗くすれば制作ツールらしくなるわけではない。密度の尺度が混ざると、押せる領域と単なる表示の境が読めなくなる。","colors":["#F8F8F8","#1473E6","#323232"],"motif":"ui","pair":["fluent-design","github-primer"],"study":["Rational・Human・Focusedの三原則","desktop scaleとmobile scale","Spectrum 2での色とアイコンの改訂"],"en":{"essence":"Adobe's cross-application design system. Under the principles Rational, Human and Focused, it changes density between desktop and mobile while keeping tool-heavy interfaces from pulling attention away from the work itself.","cues":["Neutral surfaces with vivid color reserved for selection","Icons, type and borders scaling together","Toolbars and property panels joined by fine divisions","The creative work stays stronger than the interface"],"works":["Creative tools for image, video or documents where controls should recede","Moving one product between desktop and mobile with a systematic density change"],"recipe":{"type":"Use a sans that survives small labels; optimize for identifying actions, not dramatic headings.","layout":"Keep the canvas central and tools at the edges; change every element through the same density scale.","material":"Build with steps of neutral color and assign vivid color only to selection, focus and warning."},"avoid":"A dark panel does not make a creative tool. Mixed density scales blur the line between an action and a readout.","study":["Rational, Human and Focused","Desktop and mobile scales","Spectrum 2 color and icon revisions"]},"usage":{"license":"CC-BY-4.0","licenseName":"Creative Commons Attribution 4.0 International","licenseUrl":"https://creativecommons.org/licenses/by/4.0/","attribution":"IndexStyle — https://indexstyle.org","attributionUrl":"https://indexstyle.org","scope":"Original IndexStyle text and structured data. Reference images, quoted works, and third-party material are excluded and retain their own rights."}}