Нативный, но единый: как Xmind подходит к кроссплатформенному дизайну
Если вы используете Xmind на нескольких устройствах, вы наверняка это чувствовали — небольшое трение при переключении между платформами. Кнопки выглядят немного по-разному. Взаимодействие ведет себя не так, как вы ожидали. Ничего не сломано, но есть ощущение, что это было создано не совсем для этой платформы.
Мы тоже это чувствуем. И мы долго пытались исправить это как следует.
Проблема большинства кроссплатформенных приложений
Вот типичный подход: создать один интерфейс и выпускать его везде. Это дешевле, быстрее и помогает сохранять единообразие. Так делают большинство приложений — и, честно говоря, большинство пользователей с этим мирятся.
В итоге приложение работает на каждой платформе, но не ощущается нативным ни на одной:
Пользователи Mac замечают, что оно не похоже на другие приложения Mac.
Пользователи Android замечают, что это явно порт с iOS.
Никто не жалуется громко, но это трение незаметно накапливается.
Альтернатива — проектировать отдельно для каждой платформы — звучит правильно, но почти никогда не реализуется. Это слишком дорого, занимает слишком много времени, а команды, которые поддерживают четыре разных дизайна, в итоге выгорают и все равно приходят к общему решению.
Нас не устраивал ни один вариант. Поэтому мы искали другой способ взглянуть на задачу.
Одно приложение, разный образ
Подумайте о том, как одевается человек. Костюм на деловой встрече, повседневный образ на выходных, спортивная одежда в субботу утром. Три разных образа — но вы мгновенно узнаёте его каждый раз. Потому что его суть не в одежде. Она в том, как он держится, как говорит, как относится к людям.
Xmind работает так же. Не все должно быть единым на всех платформах — но правильные вещи всегда едины.
Что меняется: внешний слой
Форма кнопок, материалы, анимации, даже тон текста — все это полностью следует правилам каждой платформы.
Платформа | Как это выглядит |
|---|---|
macOS | Кнопки в форме таблетки, панели Liquid Glass, парящие над холстом, много свободного пространства |
Windows | Геометричные, сдержанные скругленные прямоугольники, нативная строка заголовка, прямые формулировки ("Upgrade", а не "Upgrade Now") |
iOS & iPadOS | Полностью обновлено в первый день каждого крупного релиза ОС — когда вы обновляетесь, Xmind уже встроен в новую систему |
Android | Перестроено на основе Material Design 3 — жесты, переходы и поведение панелей перенастроены так, чтобы соответствовать тому, как реально работают пользователи Android |
Да, это звучит как дополнительная работа, потому что так и есть. Но только так Xmind может ощущаться как часть каждой платформы, а не просто как приложение, которое там запускается.
Что остается: структура
Где находятся инструменты, как организованы функции, как вы переключаетесь между картами — все это везде остается абсолютно одинаковым.
Навигация сверху. Холст в центре. Панель свойств сбоку на десктопе, снизу выезжает на мобильных устройствах. Внизу — вкладки карт.
Переключитесь с Mac на iPad — и вам не придется ничего переучивать. Приложение выглядит иначе, но работает так же, как знакомый вам Xmind. Именно эта согласованность — незаметная, когда все работает, — позволяет внешнему слою свободно меняться, не заставляя пользователей чувствовать себя потерянными.
Что никогда не меняется: основа
В основе всего несколько вещей остаются неизменными независимо от платформы или от того, какой новый язык дизайна придумают Apple или Google дальше:
Холст всегда главный. Интерфейс отходит на второй план.
Сложные функции появляются, когда они нужны, и не мешают, когда не нужны.
Отмена не ограничена — творческая работа требует свободы пробовать новое, не боясь что-то сломать.
Быстрота важнее красоты, всегда. Ни одна анимация или визуальная деталь не стоит того, чтобы приложение казалось медленнее.
Это не просто решения по дизайну. Скорее, это обещания.
Почему мы можем поддерживать все это
После всего этого возникает справедливый вопрос: четыре платформы, четыре визуальных языка, везде разные правила — как вообще управлять всем этим, не развалив все в процессе?
Два года назад мы приняли решение, которое тогда не казалось срочным: создать полноценную дизайн-систему для Xmind.
Главная проблема, которую она решает, просто объяснить, но сложно реализовать: собрать все различия платформ в одном месте, чтобы остальной продукт об этом не думал. Одна и та же кнопка существует в системе один раз. На macOS она становится таблеткой. На Windows — скругленным прямоугольником. Одно изменение — везде: не нужно искать по файлам, исправлять одно и то же четыре раза и постепенно терять синхронизацию.
Без этой основы все описанное выше было бы нежизнеспособно. Каждое обновление превращается в переговоры о том, какие платформы получат исправление в этом спринте. Каждая новая функция порождает четыре немного разных версии, которые постепенно перестают ощущаться как один и тот же продукт. В конце концов все молча соглашаются, что поддерживать это слишком дорого, — и все снова сводится к одному интерфейсу, который выпускается везде.
Дизайн-система делает правильный выбор не просто возможным, а воспроизводимым.
Вы никогда не заметите ее напрямую. В этом и смысл.
Заключение
Скоро выйдет новый Xmind.
Это выглядит лучше. Но если говорить честно, это результат двух лет работы, которая не всегда была заметна со стороны — мы изучали каждую платформу, строили основу для ее поддержки и не отказывались от мысли, что вам не нужно идти на компромисс только потому, что вы используете больше одного устройства.
Мы используем Xmind каждый день, на разных устройствах. Мы не выносим интерфейсы, которые просто «как-нибудь работают». Поэтому не хотим, чтобы и вам приходилось мириться с этим.
