Проектиране за tvOS срещу други устройства, които имат предвид взаимодействието

Миналата година получих шанса да работя за норвежка стрийминг компания, където бързо станах водещ дизайнер за тяхното приложение tvOS. Това беше наистина забавно и озаряващо преживяване, при което работих в тясно сътрудничество с разработчиците и научих всичко за проектирането на телевизионна платформа.

Ето малко ръководство за това какво трябва да имате предвид при проектирането за tvOS

Проектиране за tvOS, основите

Насоки за човешки интерфейс

HIG на Apple е чудесно ръководство, за да започнете и да научите основите. Това ръководство беше моята малка Библия, докато проектирах за стрийминг компанията. Той съдържа препоръки и най-добри практики за проектиране и разработване на красиви, последователни преживявания. Използвайки предоставените от платформата стандарти, приложението ви ще се чувства родно, но не забравяйте, че е само ръководство. Важно е да намерите баланса между марката на приложението, което правите, и насоките на платформата. Apple също така осигурява много страхотно вдъхновение чрез много от техните приложения за tvOS, като Apple Music, Apple TV App и Movies iTunes.

Размер на екрана и полета

Когато проектирате за tvOS, трябва да помислите само за един размер на екрана! 1920 x 1080 (16: 9). Това е тръпка в сравнение с настолни и мобилни, където трябва да вземете предвид много различни размери на екрана. Въпреки това може да възникне непреднамерено изрязване поради прекомерно сканиране на по-старите телевизори, така че дръжте първичното съдържание далеч от краищата. Добро ръководство е да се избягват 60 px отгоре и отдолу и 90 px от страни. Apple TV показва изображения със стандартна разделителна способност на HD телевизори и изображения с висока разделителна способност на 4K телевизори. Приложението ви трябва да предоставя изображения и в двата формата. За това всички активи трябва да бъдат с 1x разделителна способност (HD) и @ 2x (4K).

разстояние

Имайте предвид разликата! Интерфейсът на телевизор се гледа от няколко метра. Голям контраст на мобилни и настолни устройства, където почти имате лицето си на екрана. Уверете се, че потребителят не трябва да се мъчи да вижда какво има на екрана. Не се страхувайте да увеличавате елементите на интерфейса (текст, бутони, контроли и т.н.) по-големи. Също така е важно да включите много пространство между елементите. Това ще улесни навигацията и избора, но също така ще помогне на хората да видят всеки отделен елемент.

Типография и текст

San Francicso (SF) е страхотен системен шрифт за tvOS. Има два варианта: San Francisco Display и San Francisco Text. Когато проектирате, използвайте SF Text за текст от 19 точки или по-малък и SF Display за текст 20 точки или по-голям и коригирайте разстоянието между буквите по подходящ начин. Ако използвате този шрифт, tvOS автоматично прилага най-подходящия стил на текст въз основа на размера на точката. Ако искате да използвате персонализиран шрифт, уверете се, че е четлив на разстояние и спазва настройките за достъпност.

Показвайте, не казвайте. Четенето на много текст на телевизионен екран от цялата стая не е много забавно и напряга очите. Затова се опитайте да ограничите количеството текст и вместо това използвайте изображения, илюстрации или анимация.

Шаблони и оформления на мрежата

Apple tvOS предоставя много красиви и последователни оформления, които правят съдържанието център на вниманието. Ако приложението ви е съсредоточено върху съдържанието, би било разумно да обмислите използването на някои от тези шаблони. Шаблоните на оформлението са много адаптивни, просто внимавайте, за да го направите на вкус и да разберете целта на шаблона, преди да го използвате. Използвахме шаблони за съдържание като предупреждение и търсене.

Наистина обичах да използвам решетката на мрежата, показана в HIG на Apple. Има решетка от три до девет колони. Той показва добре съдържанието, лесно е за разглеждане на разстояние и бърза навигация с дистанционното. Наистина препоръчвам да използвате тази мрежа, за да направите дизайна си последователен и удобен за потребителя.

Съвет за съдържанието на екрана

Редовете и колоните със съдържание, което надхвърля екрана, трябва да бъдат подравнени по начин, който показва поне 10-20% от това съдържание. Това позволява на потребителя да разбере, че е възможно да се движите по-нататък. Ако следвате оформлението на мрежата, показано в HIG на Apple, съдържанието ще бъде подравнено както трябва.

взаимодействие

Споделен срещу личен / мобилен срещу стационарен

Apple TV е най-неподвижното и споделено устройство. Използваме телевизора в комунални среди като дневната, общите офис помещения, спортните барове и други обществени пространства. Това е устройство, на което могат да се наслаждават едновременно множество хора, което прави изживяването уникално от останалите устройства на Apple. Така че при проектирането за tvOS имайте предвид този споделен опит. Останалите устройства са по-лични, частни и мобилни. Въпреки че MacBook ви позволява да имате множество потребители, той все още се чувства много по-личен в сравнение с Apple TV.

Loose vs прецизно взаимодействие

На MacBook имате клавиатура и мишка, което ви позволява да бъдете наистина прецизни. Същото важи и за iPad (още повече, когато използвате молива). От друга страна, Apple Watch с малкия си екран прави по-трудно да бъдете прецизни. Също така повечето от устройствата са по-близо до вас. Имаме ги на ръце и си взаимодействаме директно с тях. Но, телевизор не е в ръка, дистанционно е. Дистанционното управление на базата на докосване кара контрола ни да се чувства намален в сравнение с другите устройства.

Отдалечени взаимодействия

Запознайте се с дистанционното, вашия нов най-добър приятел. Той има повърхност, базирана на допир, акселерометър и жироскоп. Това ви предоставя разнообразни възможности да помогнете на потребителя да се чувства свързан с приложението ви, въпреки че седи на разстояние. tvOS използва три основни жеста: прекарайте пръст, щракнете и докоснете.

Що се отнася до игрите, хората може да купуват игрови контролери за своя Apple TV, но това е само опция. Така че, ако искате да поддържате контролери за игри във вашето приложение, определено трябва да помислите дали да направите дистанционното използваемо и като контролер за игри.

https://developer.apple.com/tvos/human-interface-guidelines/remote-and-controllers/remote/

Фокусирани взаимодействия

В Apple TV използваме дистанционно, за да взаимодействаме косвено с елементи на екрана. Навигацията се основава на модел за фокусиране. Прекарвате пръст през съдържание и контроли, като винаги е избран един обект. С промяната на фокуса, фините анимации и паралакс ефектът създават усещане за дълбочина, което ясно идентифицира елемента, който в момента е във фокус. Този начин на навигация е огромна разлика от всички останали устройства. За да осигурите завладяващо преживяване е от съществено значение да разберете фокусиращия механизъм и да помислите как трябва да изглеждат елементите, когато са съсредоточени.

В Apple TV фокусираните елементи могат да имат до пет различни състояния, всяко от които трябва да изглежда визуално различно.

Хоризонтално спрямо вертикално превъртане

Хоризонталното превъртане е по-лесно и гладко от вертикалното превъртане. Това важи за самия жест на дистанционното, като плъзгането на палеца ви отстрани се чувства по-лесно, отколкото да го движите нагоре и надолу. Също така, когато става въпрос за самото съдържание на екрана. По-гладко е да плъзгате съдържанието отстрани, отколкото да премествате всички обекти (което обикновено се случва при вертикално превъртане). Тъй като вертикалното превъртане е по-тежко взаимодействие, интерфейсът трябва да отразява това и да се използва за съществени неща като промяна на категории.

Ключово обобщение

  1. Запознайте се с Насоките за човешки интерфейс на Apple за tvOS. Използвайте насоките на платформата за разстоянието, типографията, шаблоните за оформление, параметрите на мрежата и размерите на компонентите на интерфейса, за да направите интерфейса на приложението ви естествен и интуитивен. Имайте предвид, че това са само насоки и не забравяйте да накарате марката си да заблести и да бъдете креативни.
  2. Приложенията за tvOS са предимно за споделена среда. Потребителите се наслаждават на приложението от цялата стая с дистанционно. Това е огромна разлика в сравнение с други устройства. Опитът за вашето приложение трябва да отразява това споделено потребителско изживяване.
  3. Накарайте хората да се чувстват свързани с вашето съдържание, като използвате сензорната повърхност, акселерометъра и жироскопа на дистанционното. От изключително значение е интерфейсът да улеснява фокусираните взаимодействия. Винаги обмислете как трябва да изглеждат елементите, когато са съсредоточени, и направете напълно очевидно къде е следващото фокусирано управление.

Полезни връзки