Как вы справляетесь с задачей проектирования недвижимости для больших экранов? [закрыто]


10

Этот вопрос немного более субъективен, но я надеюсь получить новую перспективу. Я настолько привык проектировать для определенного размера экрана (обычно 1024x768), что я считаю, что этот размер не проблема. Увеличение размера до 1280x1024 не принесет вам достаточного количества экранного пространства, чтобы сделать заметную разницу, но даст мне немного больше передышки. По сути, я просто расширяю свой «размер сетки», и тот же базовый дизайн для экрана немного меньшего размера все еще работает.

Однако в последних двух проектах все мои клиенты использовали экраны 1080p (1920x1080) и хотели, чтобы решения использовали как можно большую часть этой недвижимости. Ширина 1920 пикселей обеспечивает вдвое меньшую ширину, к которой я привык, а широкий экран заставляет некоторые из моих старых подходов к дизайну не работать. Проблема, с которой я сталкиваюсь, заключается в том, что, когда у меня так много места, я сталкиваюсь с некоторыми серьезными проблемами.

  • Сколько столбцов я должен использовать? Широкоформатный формат подразделяется на 3 столбца с 2: 1: 1 (т. Е. Столбец содержимого больше двух других). Однако, если я выберу три столбца, что мне делать с этим дополнительным столбцом?
  • Как эффективно использовать экран недвижимости? Существует соблазн поставить все на экран сразу, но слишком много информации фактически затрудняет использование приложения. Пустое пространство важно, чтобы помочь разобраться в сложной информации, но слишком многое заставляет связанные концепции выглядеть слишком отдельными.
  • Я обычно работаю с веб-приложениями, которые имеют сложные данные, а визуализация и представление - это ключ к пониманию необработанных данных. Когда у вашего пользователя также есть большой экран (не менее 24 дюймов), некоторая информация не видна, и вам нужно переместить указатель на большое расстояние. Как убедиться, что все необходимое остается в пределах визуальных горячих точек?
  • Простые сайты, такие как блоги, на самом деле работают лучше, когда ширина ограничена, что приводит к большим потерям недвижимости. Интересно, будет ли текстовое поле и предпросмотр текста рядом друг с другом большим преимуществом для админской стороны этого типа экрана? (1: 1, два столбца разделены).

Что касается ваших ответов, я знаю, что почти все в дизайне «зависит». То, что я ищу, это:

  • Общие принципы, которые вы используете
  • Как изменился ваш подход к дизайну

Я обнаружил, что мне нужно переучить себя, как работать с этим другим форматом. Каждое увеличение разрешения, которое я до сих пор проходил, составляло около 25%: от 640 до 800 (увеличение на 25%), от 800 до 1024 (увеличение на 28%) и от 1024 до 1280 (увеличение на 25%). Тем не менее, прыжок с 1280 до 1920 - это хорошее увеличение пространства на 50% - эквивалент перехода с 640 на 1024. Обычно среднего размера не было, чтобы помочь усвоить уроки более постепенно.


Не могли бы вы сделать элементы управления пользовательского интерфейса больше, чтобы заполнить пустые места ...?
FrustratedWithFormsDesigner

@ Разочарованный: Разве это не победит цель, если вы не разрабатываете, скажем, сенсорный экран?
Майкл К

@Michael: ну, OP, похоже, не хочет изменять количество видимых элементов управления, так как это затруднит использование программы, а также не любит иметь пустое пространство. Если нет новых функций, чтобы заполнить пространство, то пространство должно быть заполнено ...?
FrustratedWithFormsDesigner

2
Это скорее вопрос расширения моего сознания для новых элементов управления и способов взаимодействия с сайтом. Просто увеличивая все, вид побеждает цель. Затем у вас появляется «синдром большой блестящей красной кнопки» или текст, который выглядит так, будто вы читаете один большой заголовок. Пытаясь сбалансировать интересы дизайна, это действительно сложная проблема.
Берин Лорич

1
@ Берин: если они сделали конкретный запрос на размер интерфейса Super-size, и это ЕДИНСТВЕННОЕ серьезное изменение, скажите им, что у вас есть проблемы с макетом и дизайном, и спросите их, есть ли у них идеи о том, как лучше всего использовать пространство. В конце концов, они пользователи, и у них должна быть причина сделать этот конкретный запрос. Может быть, они скажут: «Поместите виджет панели инструментов в пустое пространство» или что-то в этом роде ... отправьте макет с огромным пустым пространством с текстом «Что вам здесь нужно?». Убедитесь, что ваши опасения по поводу этого дизайна известны.
FrustratedWithFormsDesigner

Ответы:


1

Вот как я подхожу к этому вопросу.

Я бы начал с разбивки своих данных на логические блоки. Я мог бы даже пойти так далеко, чтобы создать разные файлы ascx для каждого логического блока. Каждый блок будет знать, как ему нравится отображаться (минимальная / максимальная ширина). Я бы сделал это, потому что мне не нравится переписывать код, и если есть вероятность того, что приложение необходимо будет расширить для поддержки нескольких размеров разрешения, то это поможет упростить его для каждого элемента управления.

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

Теперь самое сложное, макет. Как вы сказали, макет будет сильно отличаться от этого количества недвижимости. Ответом на отказ является предоставление пользователю возможности размещать элементы там, где они хотят, например на странице iGoogle. Пользователь может выбрать 2 или 3 столбца по своему усмотрению. Поскольку я не знаю, какие типы экранов вы создаете, я не знаю, сработает ли это для вас.

Второй отговорочный ответ - нанять эксперта по пользовательскому интерфейсу, который поможет вам разработать эти страницы. Проработав со специалистом по пользовательскому интерфейсу в прошлом, я могу сказать, что на 100% стоит получить экспертное мнение по таким вопросам. Они могут точно определить проблемы и предложить решения еще до того, как клиент увидит продукт.

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

Не уверен, насколько это полезно для вас, но я надеюсь, что это даст вам некоторые идеи.


Это, пожалуй, самый разумный ответ, который я получил от UI и программистов на этот вопрос. Это гораздо полезнее, чем «сделать все больше», о чем мне говорили ребята из интерфейса. ПРИМЕЧАНИЕ. Aspx - это термин, относящийся к конкретной технологии, но правильное решение состоит в разбиении пользовательского интерфейса на отдельные файлы.
Берин Лорич

4

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

Почему? Потому что по закону Фитта большие вещи легче использовать .

Может также спросить на https://ux.stackexchange.com/ или https://graphicdesign.stackexchange.com/


2

Я не эксперт по пользовательскому интерфейсу, но я использую экран 1920x1080 каждый день с Eclipse. Eclipse имеет очень легко настраиваемый интерфейс, и вот некоторые из моих наблюдений при переключении между 1280 и 1920:

  • В обоих разрешениях я хочу видеть окно, в котором я работаю, одного размера. При меньшем разрешении я склонен скрывать дополнительные панели, а при более высоком разрешении я выпускаю больше панелей.
  • Я бы предпочел немного большие кнопки. Они будут занимать меньше места пропорционально на большом мониторе и ускорить действия моей мыши.
  • Я часто расширяю предварительный просмотр, чтобы использовать весь экран, то есть код слева, предварительный просмотр справа. В итоге получается формат из двух столбцов. Кроме этого, я использую 3-колонку с нижнего колонтитула:
    1. Слева: навигация по файлам
    2. Центр: код (самый большой, вероятно, 2/3 ширины экрана)
    3. Справа: навигация по коду и задачи
    4. Нижний колонтитул: Состояние (консоль, серверы и т. Д. Довольно короткий, может быть 1 / 5-1 / 6 высота экрана)

Иногда я также помещаю представления и контроллеры рядом друг с другом в режиме с двумя столбцами, но это определенно зависит от программиста. :)

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

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.