Откуда на самом деле происходит профессиональный блеск приложения с графическим интерфейсом? - PullRequest
7 голосов
/ 03 мая 2010

Недавно я играл с php-gtk, а в прошлом я экспериментировал с Java, чтобы создавать приложения с графическим интерфейсом "hello world".

Однако оба этих типа приложений выглядят немного неуклюже (почти по-детски). Я не могу отрицать, что они удобны для создания приложений для внутреннего использования (и я полностью уважаю количество усилий сообщества, которое идет в эти проекты). Но я не обязательно буду горд продать его как коммерческое приложение с ценой, скажем, 450 фунтов стерлингов или 1000 фунтов стерлингов.

Если бы я хотел создать приложение, которое, например, было бы похоже на Firefox для Windows или Adobe xyz, какой графический интерфейс / язык мне следует использовать?

Является ли «профессиональный блеск» или умный внешний вид на 100% дизайнером или это тот случай, когда, независимо от того, насколько хорош дизайнер, выбор правильного графического интерфейса необходим для создания такого образа?

Ответы [ 5 ]

7 голосов
/ 03 мая 2010

Существует несколько аспектов использования отточенного UX для программного обеспечения.

  1. Использование самого родного фреймворка для платформы. Win32 / WPF для Windows, Какао для Mac и т. Д.
  2. Визуальные артефакты приложения являются связными - это включает изображения, графику, значки на панели инструментов и т. Д.
  3. Следование рекомендациям и рекомендациям платформ.
4 голосов
/ 03 мая 2010

Это немного совпадает с ответом Игоря, но вот мое мнение:

Native Control Look - Сегодня элементы управления пользовательского интерфейса имеют довольно сложный вид. Есть много визуальных сигналов, которые мы инстинктивно извлекаем из них, и даже если это белый прямоугольник с какой-то рамкой, с тенью Вонг он выглядит странно неуместно. Контекстное меню часто не просто открывается сегодня, оно скользит в каком-то направлении или исчезает.

Native Control Behavior - еще более сложный, чем пользовательский интерфейс, есть много деталей для поведения: различные контекстные меню в зависимости от позиции нажатия, разные «горячие» области при выборе или перетаскивании элементов, сочетания клавиш и т. Д. .

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

Достаточно взглянуть на Windows: большинство не родных наборов инструментов неправильно понимают базовую навигацию клавиатуры - клавиши со стрелками, Home, End, PgUp и PgDown, поведение изменено с помощью Ctrl, расширение выделения с помощью Shift дает до 32 поведения. Копирование и вставка традиционно выполняются с помощью Ctrl + C / Ctrl + X / Ctrl + V и Shift + INS, Shift + DEL и отсутствуют. Двойной щелчок мышью часто выделяет слово, тройной щелчок мышью иногда предложение, строку или абзац.

Время отклика и мышечная память - Существуют, в основном, два режима работы пользовательского интерфейса:

loop-look loop , где вы ждете ответа, прежде чем принять решение о следующем шаге,
воспроизведение из мышечной памяти , что намного быстрее и требует меньше ресурсов для умственной обработки.

Однако для этого есть два требования: ответ должен быть равномерным и «мгновенным», а следующее действие должно быть правильно зарегистрировано немедленно (как минимум, в течение 10 мс)

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

Отлаженный пользовательский интерфейс требует много времени, чтобы получить право - Хорошая библиотека управления может решить большинство проблем, связанных с контролем, но есть некоторые последние 10%, занимающие 90% времени, и у вас есть взаимодействие с контролем , Вы должны попробовать разные подходы, вы должны ожидать пользователей с рефлексами, обученными FPS, вы должны попробовать все виды рабочих процессов.

Кроссплатформенные наборы инструментов не могут понять все правильно - они застряли между молотом и наковальней: они могут выбирать внутреннюю согласованность независимо от платформы или в соответствии с платформой, которой они в настоящее время пользуются запускать на. Чтобы сделать это правильно, последнему часто требуется платформо-зависимый код в вызывающем коде, а именно то, чего вы пытаетесь избежать.

3 голосов
/ 03 мая 2010

Используемый API / язык GUI совершенно не имеет отношения к дизайну пользовательского интерфейса, хотя некоторые API упрощают или ускоряют его реализацию.

Хороший пользовательский интерфейс:

  • Хороший графический дизайн / оформление (визуальный баланс и симметрия, дополнительные цвета, визуально «приятные» формы и макеты, визуальная согласованность в вашем приложении и с другими приложениями вокруг него - согласованное расположение, размеры, промежутки, цвета и т. Д.)
  • Понимание рабочих процессов пользователя и создание того, что он хочет сделать, простым и интуитивно понятным. Это часто означает реализацию 3 или 4 способов достижения одного и того же действия (например, «Копировать и вставить» обычно можно выполнить с помощью: main-menu-> copy / paste, context-menu-> copy / paste, ctrl + c / v, кнопка: копировать / вставить, перетаскивать)
  • Сохраняя все просто. Удалите как можно больше, чтобы сократить пользовательский интерфейс до того, что нужно пользователю, и не более.
  • Быть интуитивно понятным и не удивлять пользователя. Элементы управления должны выглядеть как элементы управления, которые знает пользователь, работать так же, как элементы управления, которые знает пользователь, и располагаться в тех местах, которые пользователь ожидает, учитывая его предыдущий опыт работы с компьютером.
  • Следуя соглашениям (расположите кнопки «ОК» / «Отмена» в стандартных местах, используйте цвета, определенные в ОС, для выделения выделенных объектов и т. Д.)

Чтобы получить это, вам нужно посмотреть на множество «хороших» приложений и проанализировать, что делает их хорошими. Получить хорошего художника / графического дизайнера, чтобы нарисовать вам хорошие иконки и т. Д. И потратить много времени на размышления о рабочих процессах пользователя.

Убедитесь, что вы отделяете бизнес-логику от пользовательского интерфейса - это позволит вам легко перенастроить приложение для улучшения пользовательского интерфейса. И обычно данные, которые нужны программе, не связаны с тем, как пользователь должен использовать приложение - не поддавайтесь искушению просто выставить переменные x, y, z в редактируемых полях! Пользовательский интерфейс - это уровень, который скрывает вашу реализацию и делает ее пригодной для использования!

3 голосов
/ 03 мая 2010

Всегда старайтесь использовать графический интерфейс, который используется в вашей среде рабочего стола. Библиотеки .NET, вероятно, являются лучшими для создания приложений Windows. GTK + всегда лучший в GNOME, в то время как Qt хорошо работает в KDE - хотя все три работают в системах друг друга, их визуальная привлекательность снижается из-за отсутствия визуальной интеграции.

1 голос
/ 03 мая 2010

Мне все равно, как выглядят графические интерфейсы приложений Java с использованием обычных наборов инструментов. Если вам нравится внешний вид Firefox, вы можете взглянуть на XUL и среду графического интерфейса, которую используют большинство приложений Mozilla. Komodo Editor / IDE использует те же инструменты (вместе с несколькими другими приложениями). GTK очень мощный, и я действительно сомневаюсь, что это мешает вашим приложениям иметь такой профессиональный блеск. Продолжайте изучать его возможности и переосмысливайте лучший способ отображения ваших компонентов, и я уверен, что вы наткнетесь на более удобное расположение.

С другой стороны, это не все о инструментарии. Хороший дизайн интерфейса - это искусство, а такие интерфейсы, как Firefox, развивались благодаря бесконечному количеству обратной связи. Лучше всего поговорить с пользователями и выяснить, что сделает их более удобными при использовании вашего приложения. Я обнаружил, что программное обеспечение выглядит хорошо, когда оно также функционирует.

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

Удачи!

...