Как стать автором
Обновить

Дизайнер не нужен. Правила создания красивых UI

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров17K
Всего голосов 43: ↑41 и ↓2+39
Комментарии30

Комментарии 30

Пользуясь случаем...
Посоветуйте, пожалуйста, какой-нибудь css-фреймворк (можно и с js) для web-ui, покрасивее, чем Material Design Lite или Surface. Желательно компактный (без зависимостей) и конечно с тёмной/светлой темой.

Не знаю про ваши требования. Но мне понравился Bulma.io - использую для небольших проектов. Компактный, js-free, достаточно фичастый и внешне приятный

Жаль в тёмную тему не умеет из коробки

$mol.

Я вот тоже задумался на счет мультиплатформенных приложений и пошел искать вариант который бы меня устроил. Хочется то настоящей кроссплатформеннсти, даже для OpenBSD/Risc-v например, такие платформы уже не экзотика а вполне рабочие машинки…

Абсолютно все GUI фрейвоки на данный момент имеют одну или несколько проблем:

  1. Привязка к C/C++ с кросскомпилляцией

  2. Только свои встроенные витжеты для отрисовки интерфейса

  3. Ограничение по платформам

Для начала я стал копать на счет создания GUI на Go, т.к. на нем довольно неплохо пишу, ну и собирается он под все платформы без каких либо проблем прямо с целевой машины, без создания контейнеров и прочих кросскомпилляций присущих любым сишным либам. Что бы прямо из командной строки, бац и есть сборки под все что имеется на рынке на данный момент, удобно и без гемороя как это умеет Go.

В итоге, из того что мне удалось найти, это GXUI (больше не поддерживается), shiny (больше не поддерживается), NanoGUI-Go (либа переписанная с C++ почти полностью, но в итоге требует C++ и кросскомпиляции), go-astilectron (переписанная почти целиком на Go версия Electron, так же требует C++). Да, можно кстати связку с QT сделать, но опять же все это собрать под все платформы станет проблемно. Активно развиваются Fyne, Gia, обе либы в конечном счете так же упираются в ограниченное количество платформ, плюс ко всему интерфейс будет не системный, а с теми витжетами что прeдоставляют эти либы.

И вышло так, что для самого простого для кроссплатформы языка нет возможности сделать GUI без ограничений… надеюсь это пока.

Ну, подумал я, если уж C/C++ использовать, то безопасный, ну типа C# или Rust например и быстро будет. Начал с Rust, в итоге даже книжку купил. Пошел искать что там с GUI…

Druid (устаревшее), egui (в целом как вариант, но витжеты используются из самой либы, а не системные), orbtk (тоже самое, да еще и устаревшее), iced (тоже самое, плюс ограничение по платформам), dioxus (кроссплатформенность больше, но витжеты не системные), tauri (легковесный electron, со всеми вытекающими)

Плюс как оказалось, от кросскомпиляции в Rust тоже никуда не деться, т.к. либы так же легко могут подключать к себе C/C++ и тянуть за собой вереницей. А значит придется опять сильно страдать, что бы заставить сборку работать…

Немного расстроился и пошел смотреть как дела у C# и .NET, здесь на удивление оказалось все не плохо, правда с теми же ограничениями по платформам/процессорам. Например из того что есть нормального в GUI под .NET это avalonia UI − наверно единственный неплохой вариант, но это опять же свои витжеты, что будет выглядеть не нативно под любой платформой.

Дальше я пошел смотреть на Python. В нем можно преобразовать код в бинарный исполняемый файл с помощью инструментов, таких как PyInstaller или cx_Freeze и можно запускать этот бинарь как обычное приложение без предварительной установки Python… т.е. впринципе, гипотетически, можно и сделать GUI, есть только проблема в либах они опять же упираются в C/C++, либо на этапе отрисовки Opengl либо где то раньше, либо где то позже.

Окей, а что там с java? С ходу нашел устаревший SWT, и тут же на коленке одной строчкой собрал приложение с нативным итнерфейсом. Потом понял, что можно с Java и GraalVM собрать бинарник. Т.е. по идее, можно ДА, но надо пробовать. Причем будет это все дело нативно и бинарем, но пока не пробовал.

Скажу сразу, что каждый раз погружаясь, я шел в чаты в телеге по конкретному языку и спрашивал у профи, что они думают, чем помогут, что подскажут. И в чате по Java мне подсказали, что Java уже по сути скорее мертв чем жив. Ибо после скандала компании Оракл с Гуглом появился Kotlin. Язык совместимый с Java и имеющий Kotlin/Native технологию по преобразованию кода в бинарный вид. Плюс есть и GUI Compose Multiplatform, который однако имеет свой набор витжетов не похожих на системные.

Есть еще react native, но про него почитайте сами. Как дополнение, вот еще ссылка по аналогам electron на других языках: https://github.com/sudhakar3697/awesome-electron-alternatives

Мое мнение не обязательно может совпадать чьим-то, но как мне кажется, разработчикам сейчас как никогда нужен хотя бы один нормальный визуальный редактор интерфейса (например как QT но с интерфейсом из 2023 года а не из 80х) GUI фреймворк нативно работающий на всех платфромах без танцев с C/C++, язык программирования не требующий контейнеров/кросскомпилляции/доработки кода вручную для сборки под каждую платформу/процессор/ось.

Посмотрите на Delphi. У него есть кроссплатформенный фреймворк FMX (FireMonkey). По умолчанию имитирует нативный стиль платформы, но можно реализовать любой стиль на свой вкус (или взять готовые). Пример можно тут посмотреть https://habr.com/ru/articles/732384/

Нативный код, собирается для каждой платформы отдельно. Один и тот же интерфейс можно адаптировать под разные экраны или платформы без проблем. Отличный дизайнер и дизайнер стиля. Если что, то в FMX стиль является шаблоном (визуальным) для нужного контрола он может состоять из любых других контролов, примитивов, анимаций, шейдеров и т.д. Вот, например, собственный стиль комбобокса

Как итог, никаких ограничений на создание UI. Можно реализовать почти что угодно, включая использование 3D и отображение содержимого окна без самого окна (без фона, рамки и т.д.).

Стилей можно сделать несколько (как наборов, так и для одного типа контрола), каждому контролу можно задать любой стиль. Хоть стиль таблицы кнопке. Также, можно отдельно перекрыть стили для конкретной платформы или целиком отдельный набор стилей (StyleBook).

*посмотрел на календарь

никогда не было и не будет такого. только параллельная разработка под все платформы на выбранном стеке инструментов. простые приложухи можно собрать, а все сложное будет требовать проверки и согласования дизайна во всех ос и пересборки. пересборки и опять согласование дизайна. было время когда gtk2 и windows были близки к идеалу, но сейчас придется плясать от android -> linux -> windows в плане дизайна. или linux->windows. идти от windows в сторону кроссплатформенности гиблое дело. экосистемы слишком расползаются защищая свою уникальность-долю рынка и единый gui слишком монстроузный получается.

да как вариант можно wine использовать и вот она кроссплатформенность, но это так себе подход... была вотпопытка сделать хорошо на базе golang. Это либа golang-ui, от автора libui. Суть простая, создаются статические библиотеки под каждую платформу/процессор, далее golang cgo собирается содержа в себе эти либу. Т.к. она легковесная то это не сильно напрягает. Проблема в том что либа не обновляется, а для linux например требуется какая никакая зависимость GTK3.

Далее я так же распотрошил библиотеку SWT, посмотреть как сделано на java, а там такой же принцип, внутри расположен .dylib например для macOS, т.е. динамическая библиотека.

Такой путь позволяет содавать натинвыне интерфейсы... но в случае с libui либа поросла мхом, а в случае с SWT сам язык уже еле дышит. Но в обоих случаях нет хорошего редактора интерфейсов, нет полноценного продукта что бы вот ОТ и ДО... и что бы было интуитивно, что бы снизить порог вхождения.

Сейчас посмотрю что там выше написали на счет Дельфи (язык тоже не особо живой, я не уверен что он даже в risc-v умеет)

ну я практиковал wxwidgets для win-linux. но очень огорчен что ios и android там никак. дельфи прикольный, но не свободный.

Java, может и еле дышит на десктопе, не работаю с ней. Зато плотно работаю с десктопом на котлине, с помощью javafx/tornadofx. Можно нарисовать достаточно красивый интерфейс, со всеми плюшками, будет точно работать под линукс и Винду (мака у меня нет). Но обе либы, считай, заброшены.

Java впечатляет своей длинной историей существования и развития, очень интересно как выскочка Kotlin подрезал на дороге Java...

В любом случае я не нашел пока ни одной возможности сделать приложение для всех платфром не используя QT с c/c++ и кросскомпиляцией. Win, Mac, iOS, Linux, BSD, Android... конечно было бы идеально вспомнить и про Plan9, но там совсем все по другому.

В качестве альтернативы Delphi есть открытый Lazarus. Уверяют, что поддерживают кучу целевых платформ.

Да, почитал внимательно, дельфи как язык неплохой и безопасный. Лазарус имеет редактор интерфейса и действительно охватывает как мобильные платформы так и декстоп.

Но что на счет кросскомпиляции и оптимизации кода под конкретные процессоры? Насколько всё сложно?

Дорогой товарищи

Выпусти свой комментарий в виде статьи, очень тебя прошу

 И в чате по Java мне подсказали, что Java уже по сути скорее мертв чем жив

Java как язык - не то, чтобы мертва, но слегка закаменела. Java как платформа - живее всех живых, релизы выходят дважды в год. Ну и Kotlin, конечно, всё спасает.

Потом понял, что можно с Java и GraalVM собрать бинарник.

Вот всё не очень понимаю, почему все так хотят один бинарник. Много вы видели серьёзных нативных программ с одним бинарником? Везде куча dll и ресурсных файлов. А Java приложение можно легко упаковать в одну поддиректорию (zip) и батник (без необходимости установки JVM отдельно).

Плюс есть и GUI Compose Multiplatform

Compose очень интересный, но ещё пока слишком экспериментальный и сырой, дорабатываться будет не один год. Продвинутых возможностей каких-то наверняка нет (произвольная рисовка и работа со шрифтами). Если хотите себе стабильную разработку без проблем прямо сейчас - браться за него пока рано.

Ну и две одних из самых популярных IDE для/на Java до сих пор сделаны на Swing - вполне себе богатый набор инструментов, с современными скинами (FlatLaf, например) может выглядеть вполне себе хорошо.

Почему все хотят бинарник, все очень просто, потому что например Apple в своем iPadOS AppStore хочет именно бинарник. Если мы говорим именно про мультиплатформу, то придется считаться так же и с Андроид/iOS.

Не пробовали смотреть в сторону Progressive Web App (PWA)? Если не нужен прямой доступ к железу, вполне себе неплохая заявка на кроссплатформенность.

Пробовал, но такое приложение в стор не добавишь, плюс на iOS оно может быть только онлайн и нельзя получить доступ к файловой системе...

Через нативную обёртку типа cordova добавишь.

Flutter смотрели?

О красоте думают в последнюю очередь, но в итоге дизайн профессиональных инструментов зачастую вызывает искреннее восхищение. Ничего лишнего.

Три раза ха. Автор не в курсе, столько там затрачено часов промдизайнеров, чтобы получился тот простой-и-ничего-лишнего дизайн (которые, кстати, обычно существенно дороже графических и веб-дизайнеров).

Приведенный пример slint 1.0 показал мне, что я неправильно понимаю "кроссплатформенный".

Для меня кроссплатформенный интерфейс означает "одинаково выглядит на всем". А тут как мы видим мешанина из нативных элементов которые ездят по интерфейсу туда сюда и ну не vscode / telegram юай левел же. [понятно, что можно самому рисовать квадратики под кнопки, но все же]. Тут же кроссплатформенный = кросскомпиляция.

Электрон нас всех сожрет. Почему не упомянут, так и не понял.

Недавно столкнулся в объемом необходимого пердолинга чтобы шорткаты на QT5 были позиционные, а не зависили от раскладки. В 2023 году решений в 0 строк почему-то нет.

Не так все просто. Например, Astra linux se (на которую переходят все силовые структуры и госаппарат) из коробки не умеет запускать appimage. И юзеры ничего настраивать не умеют и не хотят. Проже дать каталог с явой и баш-файл запуска

Извините, но вы достали со своими "Красивыми" интерфейсам.

Я считаю, что разработчик, как минимум, должен различать интерфейсы развлекательных приложений и производственные интерфейсы.

Я встречал множество реальных кейсов, когда на производстве заменяли удобную программу с 20-30 кнопок на "красивую", где всего 2-3 кнопки. Работнику вместо одного действия-нажатия, приходилось теперь делать 5-6 кликов.
И это происходит повсеместно.

Пожалуйста, оставьте свои модные красивые интерфейсы для развлекательных приложений и игр, а для рабочих инструментов, пускай останутся не очень "красивые", но функциональные приложения.

Удобный интерфейс может быть красивым, как и красивый может быть неюзабельным.

Может быть. Но я говорю в контексте статьи, где нет ни слова о функциональной части. Вместо этого автор пытается объявить стандартом чьи то приложения, смешивая все в кучу.

А потом мы удивляемся, на сколько "красивый" новый интерфейс.

Люто плюсую. Hp обновил дизайн драйвера жля принтера, и теперь он перестал помещаться на экране 4к монитора

Зарегистрируйтесь на Хабре, чтобы оставить комментарий