Внутри Adobe Spectrum: дизайн-система, которая сделала возможным появление таких приложений, как Photoshop на iPad

Сегодня Adobe открывает новые ресурсы для дизайнеров и разработчиков с запуском официального веб-сайта своей общекорпоративной дизайн-системы Spectrum. От нового настольного приложения Creative Cloud для Mac до грядущего Photoshop на iPad — Spectrum придает приложениям Adobe их особый внешний вид и ощущение.

В преддверии Adobe MAX в следующем месяце мы узнали немного больше о Spectrum от Шона Чериса, директора отдела дизайна пользовательского опыта в Adobe. Поскольку такие приложения, как Lightroom, Fresco, а вскоре и Photoshop, становятся ключевыми продуктами в линейке мобильных инструментов Adobe, наличие единого последовательного опыта на всех платформах важнее, чем когда-либо.

Проект Spectrum начался в 2013 году, задолго до того, как Adobe официально представила дизайн-систему публике в посте в блоге в мае 2018 года. По мере того как команда Чериса совершенствовала принципы Spectrum, новые продукты и существующие команды в Adobe начали принимать эту систему.

«Центральные принципы Spectrum — быть «рациональным, человечным и сфокусированным». На практике это означает попытку свести пользовательский опыт к его простейшему возможному состоянию», — говорит Черис. Команды Adobe следуют знаменитой идее Дитера Рамса о том, что хороший дизайн — это «как можно меньше дизайна».

Lightroom имеет схожий дизайн и рабочий процесс на Mac, iPad и iPhone.

Стремление к простоте создает новые проблемы при попытке переосмыслить десятилетия дизайна настольных приложений — созданных с учетом клавиатуры и мыши — для новых платформ, таких как iPad OS. Spectrum — это отправная точка. «Там, где платформы имеют сильную точку зрения относительно определенных взаимодействий, мы используем соглашения, которые пользователи, вероятно, ожидают», — говорит Черис. «Идеальный вариант — попытаться следовать лучшим практикам на каждой платформе, делая этот опыт привычным для пользователей, которые используют наши продукты на нескольких платформах. Это сложный баланс, над которым мы постоянно работаем».

Дизайнеры Adobe стараются поддерживать кроссплатформенный дизайн для каждого компонента в библиотеке Spectrum, такого как кнопки и значки. Лучшие идеи, созданные командами Adobe за пределами системы, возвращаются обратно. Spectrum также предоставил Adobe возможность сделать ключевые инвестиции в доступный дизайн. Каждый компонент системы соответствует стандартам WCAG (Web Content Accessibility Guidelines) 2.0, и Adobe работает над соответствием стандартам 2.1.

Adobe Fresco и Photoshop на iPad с предрелизной версией интерфейса (на переднем плане) имеют общее происхождение.

Вы могли заметить, что последние приложения Adobe для iPadOS имеют одинаковый пользовательский интерфейс. Fresco заимствует элементы у Lightroom. Photoshop и Fresco оснащены настраиваемым сенсорным ярлыком. Это не случайно. «Spectrum дал ответы на многие вопросы UI и UX [в Photoshop на iPad], от компонентов интерфейса до цветовых систем, и помог унифицировать и скоординировать эти ответы в рамках множества одновременных усилий по дизайну приложений», — говорит Райан Хикс, ведущий дизайнер Photoshop на iPad. Adobe постаралась сбалансировать наследие Photoshop со свежими идеями для современных сенсорных устройств, чтобы создать продукт, который одновременно знаком и нов.

«Часть того, что Spectrum призван достичь, — это, по сути, предоставить более современный опыт», — добавляет Черис. «А «современный» почти всегда означает, что вы должны немного отличаться от всего, что было раньше».

Теперь система, которой пользуются более 400 дизайнеров в Adobe, становится доступной для дизайнеров и разработчиков, которые интегрируются с продуктами Adobe и создают плагины для таких инструментов, как Adobe XD. UI-киты, шрифты и ресурсы с иконками можно бесплатно загрузить на новом веб-сайте Adobe Spectrum, наряду с исчерпывающей документацией по принципам и лучшим практикам Spectrum.

«Spectrum — это репозиторий лучших наработок Adobe на любой момент времени», — говорит Черис. «Все наши компоненты здесь документированы, что отражает все наши наработки в области удобства использования, доступности и кроссплатформенного дизайна».

Вы можете узнать больше о Spectrum и загрузить ресурсы для Adobe XD на macOS на официальном сайте. Следите за нашими репортажами с Adobe MAX, которая начнется 4 ноября.