Ноу Інти, лекція, новий підхід до дизайну користувальницького інтерфейсу windows

Що нового може запропонувати Windows 8

Windows 8 відрізняється від всіх операційних систем, раніше створювалися корпорацією Microsoft. Windows 8 працює однаково на декількох типах пристроїв, таких, як настільні комп'ютери, планшетні комп'ютери та інші пристрої з сенсорним екраном. Ця операційна система підтримує ландшафтну (горизонтальну) і портретну (вертикальну) орієнтації екрану. Тепер у дизайнерів є можливість створювати щось спільне для користувачів різних пристроїв. Відповідно, від дизайнера, для створення хороших додатків, потрібне знання платформи.

На допомогу дизайнерам платформа Windows 8 надає однакову модель користувальницького інтерфейсу. що дозволяє дизайнерам сконцентрувати функціональність програми на корисної діяльності, зберігаючи додаток зрозумілим і позбавленим відволікаючих елементів.

Нижче представлені основні елементи інтерфейсу, які дозволяють будувати додатки для Магазину Windows. спрямовані на максимальне відповідність очікуванням користувачів.

• Робоча поверхня (полотно, полотно).
• Чудо-кнопки Пошук. Загальний доступ. Параметри. Пристрої.
• Розпізнавання дотиків і жестів.
• Панель додатки.

Прочитайте наступні частини, щоб зрозуміти, як ці компоненти працюють в системі і як вони впливають на дизайн додатків.

Полотно (canvas) - це робоча поверхня пристрою, за допомогою якої користувач взаємодіє з операційною системою і додатками. У Windows 8 користувач може виконувати ключові дії, такі, як запуск додатків, пошук, надання загального доступу, навігацію по контенту, використовуючи тільки робочу поверхню. Користувач тут безпосередньо маніпулює контентом, використовуючи робочу поверхню додатків, що замінює додавання команд для роботи з контентом. На робочій поверхні можуть бути відображені два додатки: одне у вигляді прикріпленого додатки (Snappedapplication), інше - у вигляді основного (Mainapplication), його ще називають заповнює (Filled) додатком.

збільшити зображення
Полотно включає в себе все на робочій поверхні пристрою

Чудо-кнопки

Чудо-кнопки дозволяють дизайнерам прибрати зайві, непотрібні елементи з додатків, так як є вбудованими елементами ОС і розташовані в інтерфейсі завжди в одному і тому ж місці. Дизайнерам не доведеться витрачати зусилля на впровадження цих елементів в свої додатки.

збільшити зображення
Проведіть пальцем або вкажіть мишею на нижній правий кут для того, щоб побачити панель чудо-кнопок

Щоб додаток могло використовувати чудо-кнопки, розробник програми повинен активувати відповідний контракт, а дизайнер, в свою чергу, повинен продумати структуру програми: наприклад, в додатку не потрібна кнопка пошуку, але місце, куди будуть виводитися результати пошуку, дизайнер передбачити повинен.

Пам'ятайте, що тут ми тільки побіжно розповідаємо вам про можливості чудо-кнопок, більш детально ви дізнаєтеся про них в "Використання чудо-кнопок і контрактів".

Чудо-кнопка Пошук (Search)

Чудо-кнопка Пошук дозволяє користувачеві не тільки шукати інформацію в активному додатку, але і по всьому вмісту в системі. Ви вже бачили приклад раніше в цій лекції, коли шукали додаток Фінанси (Finance) і запускали пошук в Магазині Windows. Виконайте наступне, щоб протестувати можливості пошуку.

1. Перебуваючи на початковому екрані, викличте панель чудо-кнопок натисканням Win + C і натисніть Пошук.
2. Так як пошук ініційований з початкового екрана, він буде проводитися згідно з додатками - Додатки (Apps) виділені в якості мети пошуку. Введіть puzzle, і в результатах пошуку з'явиться додаток PuzzleTouch.
3. Тепер виберіть InternetExplorer в переліку доступних додатків, результати пошуку puzzle з'являться у вікні оглядача.
4. Натисніть Win + C. щоб повернутися на початковий екран.

Врахуйте, що ви не виходите з додатків, вони просто стають неактивними, коли ви їх не використовуєте. Далі в цій лекції ви дізнаєтесь, як вимикати додатки і перемикатися між ними.

Чудо-кнопка Загальний доступ (Share)

Чудо-кнопка Загальний доступ (Share) дає можливість відправляти вміст програми іншому користувачеві або в інший додаток і приймати загальнодоступний контент. Так само, як і у випадку з іншими чудо-кнопками, Загальний доступ активується на стадії розробки програми; але як дизайнер ви повинні визначити - що саме може бути надано для загального доступу. Чи хочете ви, щоб ваш додаток було цільовим при обміні даними, чи може інший додаток відправляти контент вашому? Або ви хочете, щоб ваше додаток стало джерелом загальнодоступних даних, виступаючи в такому випадку творцем джерела даних?

Перш ніж працювати за наведеною нижче інструкції, переконайтеся, що ви встановили додатки Photos і PuzzleTouch з магазину додатків і виконали вказівки, дані на початку лекції.

1. Відкрийте програму Photos. Ви можете бачити зображення, завантажені в папку Бібліотека зображень (Pictureslibrary).

У цій бібліотеці виберіть зображення, яке ви хочете перетворити в паззл.

Натисніть Win + C і натисніть Загальний доступ (Share). Зауважте, що додаток Photos є джерелом і може відправляти зображення в інші програми, наприклад, в поштове додаток або в PuzzleTouch.

Натисніть PuzzleTouch. Вам будуть представлені різні варіанти дій із зображенням. Виберіть Intermediate (12 частин, з обертанням). Додаток відразу ж почне обробку зображення.

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

Введіть в пошук puzzle. виберіть PuzzleTouch. і додаток запуститься.

Прокрутіть вліво, щоб виявити пазли середнього розміру, і виберіть щойно створений пазл. PuzzleTouch налаштована як цільового програми, що приймає дані, і ви можете передавати дані прямо в додаток.

Можете зібрати пазл або повернутися на головний екран, скориставшись панеллю чудо-кнопок.

Чудо-кнопка Пристрої (Devices)

Чудо-кнопка Параметри (Settings)

Ця диво-кнопка дає доступ до всемпараметрам додатки, що дуже зручно для користувача: він зможе задавати тут параметри як для конкретного додатка, так і для глобальних налаштувань.

Можете поекспериментувати, запускаючи різні додатки і викликаючи настройку їх параметрів. Ви побачите, що додатки дозволяють здійснювати глобальні настройки у вікні Параметри (Settings). Врахуйте, що за зовнішній вигляд і зручність налаштувань відповідає дизайнер.

збільшити зображення
Параметри додатків Finance, PuzzleTouch і Solitaire

Розпізнавання дотиків і жестів

Якщо у вас є пристрій, що володіє сенсорним екраном, ви можете без проблем користуватися можливостями операційної системи і додатків, пов'язаними з сенсорним управлінням. Розпізнавання дотиків і жестів є вбудованої частиною платформи Windows 8 і додатків для Магазину Windows. ОС підтримує чіткий набір жестів і дотиків, однаковий у всій системі. Застосувавши цей набір, ви зробите додаток легким в освоєнні і у використанні. Більш докладно про це ви дізнаєтеся в "Стати швидким, рухливим і повністю цифровим".

Якщо ваш пристрій не має сенсорного дисплея, не хвилюйтеся: Windows 8 повністю підтримує роботу з мишею і клавіатурою. Ця взаємодія має багато спільних рис з керуванням жестами і дотиками, в той же час забезпечуючи особливий стиль взаємодії з системою, яка знайома користувачам і розробникам додатків.

Панель додатки (Appbar)

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

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

Якщо у вашому додатку є функції, які важливі в процесі роботи (такі, як команда покупки продукту), помістіть їх не на цю панель, а на робочу поверхню додатки.

1. Зайдіть в додаток Photos і виберіть одну з колекцій фотографій.
2. Викличте панель програми та запам'ятайте опції, які зараз доступні.

збільшити зображення
Панель додатки відображає команди тоді, коли вони потрібні користувачеві

Виберіть зображення.

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

Поверніться назад на початковий екран.

збільшити зображення
Панель додатки змінюється, коли виділено зображення

Орієнтація екрана в Windows 8

Ландшафтна орієнтація екрану

Ландшафтна (landscape) орієнтація екрану є найпоширенішою, так як вона використовується в настільних комп'ютерах і ноутбуках.Прі розробці слід орієнтуватися на ландшафтну орієнтацію і створювати альтернативу у вигляді портретного орієнтації, якщо вона вам потрібна.

Ви можете вирішити залишити ваше додаток в ландшафтному режимі навіть тоді, коли екран пристрою повернутий, але відзначимо, що користувачі можуть сприймати це як помилку. Solitaire - приклад програми, яка "вважає за краще" ландшафтний режим, оскільки карти складно розташовувати в портретному режимі.

збільшити зображення
Додаток Solitaire залишається в ландшафтній орієнтації навіть тоді, коли екран пристрою повертають

Портретна орієнтація екрану

У конкретному пристрої портретний режим може виявитися недопустимими (це залежить від наявності акселерометра). В "Проектування для екранів, різних за розміром і вирішенню" у вас буде можливість протестувати ваш додаток при портретній і ландшафтній орієнтації екрану за допомогою симулятора - без справжнього повороту екрану.

Пам'ятайте, що при створенні дизайну програми необхідно враховувати і портретний вид, нодізайнер може відмовитися від використання програми в портретному режимі.

Режим прикріпленого додатки

Режим прикріпленого додатки націлений на те, щоб вікно вашої програми було доступно користувачеві на якомога більшій площі робочого простору екрану. У цьому режимі можна відкрити відразу 2 програми: одне в режимі заповнює (головного) додатки, інше - в режимі прикріпленого додатки.

збільшити зображення
Додаток News знаходиться в прикріпленому режимі. Додаток Solitaire - в режимі основного додатки

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

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

Режим прикріпленого додатки

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

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

Також тут ви познайомилися з різними режимами орієнтації екранів.

Самостійна робота

1. Назвіть три основні чинники, що вплинули на дизайн додатків в стилі нового призначеного для користувача інтерфейсу Windows.
2. Чому дизайнеру необхідно пам'ятати про можливості чудо-кнопок при створенні додатків для Магазину Windows?
3. Про які орієнтаціях екрану слід пам'ятати, розробляючи дизайн пріложеніядля платформи Windows 8?

1. На новий дизайн для Windows вплинуло багато, наприклад:
   • Швейцарський дизайн
   • Інтернаціональний типографический стиль
   • Німецька школа дизайну Bauhaus
   • Ідея дорожніх покажчиків

3 орієнтації: ландшафтна, портретна, режим прикріпленого додатки.

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