Розробка вікна.
При проектуванні вікон загальне положення щодо зменшення витрачання енергії зору на аналіз інформації залишається. Сучасні монітори розміром 14 використовуються здебільшого для опрацювання тексту на екрані, а 17 - для опрацювання графічної інформації. Інтерфейси користувача мають як текстову так і графічну інформацію (малюнки, піктограми, діаграми). Якщо це існує в інтерфейсі, то слід продумати співвідношення на кожному екрані текстової і графічної інформації. Якщо текстової інформації більше, то слід рухатися в сторону 14, а якщо більше графічної то в сторону 19.
За одиницю проектування приймають форму, що є частиною екрану має прямокутну форму і описується своїми атрибутами, тобто властивостями, подіями, методами.
Для конкретного користувача треба обирати найбільш ефективне взаємовідношення між площею форми і площею екрану дисплея. Площа форми в більшості випадків складає від 40%-60% площі екрану, бажано, щоб це співвідношення встановлював користувач.
Рисунок 12.18 – Форма головного вікна мала: напруженість на зір користувача
На формі будуть розташовуватись тексти і графічні елементи, а на екрані за межами форми можуть розташовуватись – заставка, яка відображає інформацію, щодо дій, які виконуються користувачем або машиною, або ця площа може бути пустою.
Рисунок 12.19 – Заставка головної форми: відображає роботу додатку.
Рисунок 12.20 – Головна форма з фоновою заставкою: мінімально звертає увагу користувача.
Рисунок 12.21 – Розташування форми на фоні екрану: фон подібраний невірно.
Рисунок 12.22 – Розташування форми на фоні екрану: фон подібраний вірно.
В першому випадку треба підібрати такий фон, який би не привертав великої уваги користувача при роботі з формою, а зосередження на формі було б максимальним. Коли вводиться і аналізується важлива інформація, тоді цю площу треба заповнити нейтральним фоном з кольором або відтінком щодо мінімального звертання уваги.
Форма – основний елемент проектування інтерфейсу. Вона має компоненти, які теж підлягають проектуванню. Зовні форма має обрамлення, рядок заголовку, поле форми і, можливо, статусний рядок – все це властивості форми. Кожна форма має висоту і довжину
H=0.37*(H+L), L=0.63*(H+L).
Довжина форми
Висота
форми
Рисунок 12.23 – Форма – основна одиниця проектування додатку.
Обрамлення в залежності від призначення може мати одну лінію різної товщини, дві лінії або лінію із спецефектами. Рядок заголовку повинен мати в лівій частині піктограму додатку для якого створюється ця форма. Далі – назва форми, повинна мати кореляцію з тими процесами або діями, які відбуваються в формі. Якщо в додатку використовується багаторівневий діалог і користувач повинен знати на якому рівні він знаходиться, то потрібно використовувати складені найменування в заголовку форм. Кожна наступна частина записується через крапку. Більше 3-х частин не використовують. На відміну від вікон і діапазонів в Windows піктограми згорнення, розгорнення не використовують .
Піктограма додатку
Заголовок додатку
Кнопки управління формою
Рисунок 12.24 – Заголовок форми
Рисунок 12.25 – Другий рівень роботи додатку: відображає заголовок форми
Фон рядка заголовку може відрізнятися від фону поля. Найчастіше це більш темний фон, ніж фон поля. Шрифт і колір заголовку повинен бути таким, щоб він звертав увагу користувача на призначення цієї форми чи дії в ній. А з іншої точки зору “не тягнув” більшу увагу. Фон поля форми повинен бути скорегованим з фоном екрану. Всі елементи форми, їх стиль, товщина, розміри повинні відповідати загальній побудові всього інтерфейсу, і не змінюватись при переході від однієї форми додатку до іншої і бути обґрунтованими.
Рисунок 12.26 – Шрифт заголовка на формі напружує зір: подібраний невірно
Рисунок 12.27 – Шрифт заголовка на формі ненапружує зір: подібраний вірно
Статусний рядок може бути використаний, або ні. В цьому рядку взагалі може бути розташована допоміжна інформація, яка щось додає до тієї інформації, що вже існує в полі форми. Але, якщо ця змінна інформація буде звертати на себе більшу частину уваги ніж на основне поле, то це погіршить умови праці користувача.
Статусний рядок
Рисунок 12.28 – Наявність на форомі статусного рядка.
У тілі форми розміщується інформація для аналізу та ухвалення рішень. Реалізація рішень здійснюється за допомогою об’єктів форми.
Об’єкти форми:
Поля вводу
Мітки
Поля вибору
Поля виводу
Функціональні кнопки
Рисунок 12.29 – Приклад об’єктів форми
Практична робота № 13 Основні правила проектування полів вибору і введення
Ціль: вивчення правил проектування полів вибору, полів введення, повідомлень
додатку.
Хід роботи.
Спроектувати форму або форми з використанням компонентів MS Visual C# для вибору інформації згідно правил щодо:
визначення, стану, типів, представлення об’єктів, ідентифікації, курсору вибору, виділення обраного об’єкту, неприступності об’єкта вибору, черговості розташування об’єктів вибору, первісного представлення, вихідного стану.
застосування елементів настроювання.
Спроектувати форму або форми з використанням компонентів для введення інформації згідно правил щодо:
визначення,
ідентифікації,
роздільників,
шрифту,
читабельності і усвідомлення введеної інформації.
Спроектувати всі типи повідомлень додатку та застосувати їх.
Пояснити застосування правил на прикладі спроектованих форм.