Як ви перемагаєте завдання проектування нерухомості для великих екранів? [зачинено]


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

@Frustrated: Чи не перемогло б це, якщо ви не проектували, скажімо, сенсорний екран?
Майкл К

@Michael: ну ОП, схоже, не хоче змінювати кількість видимих ​​елементів керування, оскільки це ускладнить використання програми, а також не любить порожнього місця. Якщо немає нових можливостей, щоб заповнити простір, тоді простір потрібно заповнити ...?
FrustratedWithFormsDesigner

2
Це більше питання намагатися розширити свою думку щодо нових елементів управління та способів взаємодії з сайтом. Просто все більший вид перемагає мету. Тоді у вас є "синдром великої блискучої червоної кнопки" або текст, який відчуває, що ви читаєте один великий заголовок. Намагаючись збалансувати проблеми дизайну, це справді є складною проблемою.
Берін Лорич

1
@Berin: Якщо вони зробили конкретний запит на розмір інтерфейсу Супер розміру, і це ТІЛЬКИ основні зміни, скажіть їм, що ви маєте занепокоєння щодо компонування та дизайну, і запитайте, чи є у них ідеї про те, як простір можна найкраще використовувати. Зрештою, вони є користувачами, і вони, мабуть, мали причину для цього конкретного запиту. Можливо, вони скажуть "поставити віджет панелі інструментів у порожній простір" або щось подібне ... надішліть скріншот макета з величезним порожнім простором текст із написом "Що ви тут хочете?" Переконайтесь, що ваші занепокоєння щодо цього дизайну відомі.
FrustratedWithFormsDesigner

Відповіді:


1

Ось як я підійшов до цього питання.

Я б почав з розміщення даних у логічні блоки. Я можу навіть зайти так далеко, щоб створити різний файл ascx для кожного логічного блоку. Кожен блок буде знати, як він любить відображатися (min / max widths). Я б це зробив, якщо мені не подобається переписувати код, і якщо є ймовірність, що додаток потрібно буде розширити на підтримку декількох розмірів роздільної здатності, то це допоможе полегшити процес контролю за допомогою контролю.

Далі я б створив новий аркуш стилів для більшої роздільної здатності. Зробіть великі кнопки та заголовки. Додайте більше білого простору навколо елементів. Цей спосіб перемикання між двома типами роздільної здатності - це просто зміна аркуша стилів.

Тепер приходить важка частина, компонування. Як ви вже говорили, планування буде сильно відрізнятися від такої кількості нерухомості. Відповідь на копіювання полягала б у тому, щоб дозволити користувачеві розміщувати елементи, де вони хочуть, як-от на сторінці iGoogle. Користувач може вибрати 2 або 3 стовпці, як вважає за потрібне. Оскільки я не знаю, які типи екранів ви будуєте, я не знаю, чи справді це спрацювало б для вас.

Другою відповіддю на відповідь буде найняти експерта з інтерфейсу, який допоможе вам створити ці сторінки. Співпрацював із фахівцем з інтерфейсу в минулому, я можу сказати, що на 100% варто цього отримати експертний висновок щодо таких речей. Вони можуть точно визначити проблеми та запропонувати рішення, перш ніж клієнт навіть перегляне продукт.

Якби мені довелося це зробити самостійно, я би розмістив фіксовані елементи з боків, а середня область зростала, щоб заповнити решту місця. Будь-які дані, які можуть зростати, заповніть середній розділ.

Не впевнений, наскільки це корисно для вас, але я сподіваюся, що він дає вам кілька ідей.


Це, мабуть, найрозумніша відповідь, яку я отримав як на користувальницькому інтерфейсі, так і на програмістів на це питання. Це набагато корисніше, ніж "зробити все більшим", - ось що мені сказали люди з інтерфейсу. ПРИМІТКА: 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)

Я іноді також розміщую перегляди та контролери поруч один з одним у режимі 2 стовпців, але це, безумовно, специфічно для програміста. :)

Коли я перебуваю на великому екрані, я хочу використовувати цю інформацію, щоб побачити якомога більше інформації, але все ще легко знайти. Більше місця навколо компонентів допомагає розмежувати колекції інформації. Піктограми на вкладках - це один із способів привернути увагу до того, що означає кожен компонент.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.