Нативный, но единый: как Xmind подходит к кроссплатформенному дизайну
Если вы используете Xmind на нескольких устройствах, вы, скорее всего, сталкивались с этим — легким дискомфортом при переключении между платформами. Кнопки выглядят немного иначе. Взаимодействие работает не совсем так, как вы ожидали. Вроде ничего не сломано, но кажется, будто продукт создавался не для этой системы.
Мы тоже это почувствовали. И приняли решение: Xmind должен быть нативным на любой платформе — не просто функциональным, а по-настоящему своим на macOS, Windows, iOS и Android. Та же структура, та же логика, то же ощущение от знакомого продукта — но в правильном оформлении для каждого устройства.
Вот как мы этого добились.
Проблема большинства кроссплатформенных приложений
Обычно используют такой подход: создают один интерфейс и поставляют его везде. Это дешевле, быстрее и обеспечивает единообразие. Так поступают авторы большинства приложений — и, честно говоря, большинство пользователей с этим мирятся.
В итоге приложение работает на любой платформе, но ни на одной не кажется родным:
Пользователи 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 каждый день на разных девайсах. Мы не любим компромиссные решения и хотим, чтобы вы тоже не сталкивались с ними.
