Въведение в основните съставки на телевизионния потребителски интерфейс
По-голямата част от потребителите в наши дни прекъсват кабела с платена телевизия, но това не означава, че са избягали от големия екран, за да консумират съдържанието му.
Според съобщение от Нилсен Американските навици за гледане на възрастни установяват, че 92% от цялото гледане все още се извършва на телевизионния екран. Тези числа са много големи.
Повече от 92% от публиката сред възрастните американци все още е на телевизионния екран.
Значението на „гледане на телевизия“ се е променило много през последните десетилетия. Вече не сме ограничени до кабелна и отдалечена кутия, която да запълни екраните ни; ние използваме Smart TV, или стрийминг, използвайки дискове като Roku, Amazon Fire и Apple TV, или свързваме конзоли за видеоигри като Xbox и Playstation. И всяко от тези устройства позволява потребителски интерфейс, който е далеч по-мощен от стария ви екранен справочник.
Плащането за гледане на излъчване или програмиране на VOD чрез базирани на абонамент онлайн услуги като Hulu, Netflix или Amazon представлява 26% от глобалните онлайн респонденти ( Нилсен ). Това е значителен брой. 72% от анкетираните обаче потвърдиха, че все още плащат, за да гледат съдържанието си чрез традиционна телевизионна връзка.
Означава ли това, че традиционната телевизионна връзка е тук, за да остане?
Изглежда всички ние смятаме, че въжетата там ще представляват по-голям брой. Нилсен съобщава, че се очаква 116,4 милиона домакинства в САЩ да гледат телевизия през сезон 2015-16. Това е огромен брой и докладът също така установява, че около 9,5 милиона от тези домове са преминали към безплатна OTA TV. От всички услуги за стрийминг там Netflix (60,7%) изглежда е по-напред от играта, следван от Amazon Prime Video (49,4%) и Hulu (26%). Мисля, че една от най-големите причини хората да прекъсват кабела е, че искаме да плащаме само за това, което използваме.
В сравнение с компютрите и дори мобилните телефони, дизайнът на потребителския интерфейс за телевизия все още е сравнително нова област. Това също е принципно различна платформа и начинът, по който консумираме съдържанието си, е различен. Проектирането за телевизия изисква уникален набор от съображения, включително размер на екрана и разстояние на зрителя, технически ограничения и контекст на употреба. Потребителите са в 'спокойно' преживяване, като седят средно на 10 фута един от друг и потребителският интерфейс и опит трябва да отразяват това. За разлика от телефоните и таблетите със сензорен екран, взаимодействията по телевизорите се извършват чрез D-pad (управление на посоката) с помощта на дистанционно управление или контролер за видеоигри, което прави рекламите по-сложни.
Мониторът
Телевизорите не са като таблетите и телефоните.
Телевизорите са се променили много с течение на времето от огромна мебел до елегантен минималистичен екран, окачен на едната стена. Когато телевизорите заемат целия хол, те използват технология, която създава непоследователни изображения на телевизорите, особено близо до краищата. За да компенсират тези проблеми, CRT телевизорите бяха обект на пресканиране. Това просто означава, че изображенията са леко увеличени, така че ръбовете не са извън границите на зоната за гледане.
Традиционно телевизионните оператори очакваха това и искаха да предотвратят показването на критичната им информация твърде близо до краищата на екрана. За да разрешат този проблем, те създадоха безопасна зона за заглавие за показване на текста без изкривяване и безопасна зона за действие, където изображението може безопасно да се покаже.
По причини извън нашия контрол, пресканирането все още е нещо ... дори на по-новите ви HDTV телевизори. Размерът на свръхсканирането не е последователен за всеки телевизор. За да сте сигурни, че цялата ви основна информация, като важни заглавия и запаси, е сигурна, пазете я в безопасни граници.
Понастоящем няма 'стандарт' за зони за безопасно действие, тъй като той се определя предимно от самата платформа. Google държи тясно защитената си зона, а Apple е малко по-щедра. От многото ми търсения в мрежата тези области варират между 85% и 95% от телевизионния екран от центъра. За да отговорите на изискванията на всички различни платформи, с които може да работите, бих препоръчал да използвате безопасна зона от 60px горни и долни полета и 90px странични полета. Това означава, че цялата ви основна информация ще трябва да се побере в тази област, за да побере всички телевизионни екрани и да отговори на всички изисквания на платформата.
За да стартирате новия си дизайн на потребителския интерфейс на телевизора, създайте ново платно 1920 x 1080. Запълването му (безопасна зона) трябва да бъде 90 пиксела отстрани (отляво и отдясно), както и 60 пиксела отгоре и отдолу. Можете да получите безплатния си файл изтегляйки го тук .
Навигация
Как „горе-долу-ляво-дясно“ оформят телевизионните интерфейси.
Като дизайнер, хардуерът, с който проектираме, ще определи някои от нашите дизайнерски модели. На мобилния телефон предаваме, натискаме, дълго натискаме, дърпаме и т.н., за да изпълняваме действия. Разделите и менютата се използват като навигационни модели на нашите устройства. Телевизията предлага голямо платно, което лесно може да стане твърде сложно, ако не се направи правилно. Преглеждането на дълги редове съдържание, за да се увеличи максимално количеството на видимото за потребителите, се превърна в стандартен елемент на телевизионните потребителски интерфейси.
За разлика от мобилните устройства, които контролираме с пръсти, повечето телевизионни потребителски интерфейси се управляват от D-pad и се използват на разстояние от екрана. Независимо дали е на дистанционно управление или геймпад, D-pad ограничава навигацията до четири посоки: нагоре, надолу, наляво и надясно.
Всяка платформа има и свои установени конвенции. Например на Xbox тригерите осигуряват контрола „Page Up“ и „Page Down“, докато бромовете се използват за разделяне между изгледите на съдържанието. На всяка платформа има и редица бутони за „потребител на мощност“, с които по-опитните геймъри биха били запознати.
Другият критичен елемент в потребителските интерфейси на телевизора е състоянието на фокуса. Без възможността да докосват екрана или да използват мишка, потребителите трябва да отидат до елемента, който искат да изберат. Докато потребителят навигира в приложението, различни елементи на потребителския интерфейс трябва да бъдат маркирани, за да покажат, че елементът за навигация е на фокус.
Фокусирайте се и подчертайте състоянията при проектирането за телевизия, тъй като те са много важни. Това състояние на фокуса е елементът, който подчертава избираем компонент и означава текущото местоположение на потребителя на екрана. Начинът на показване на фокуса може да варира; в зависимост от компонента обаче последователността винаги ще бъде от ключово значение. Ясният и добре видим фокус помага на потребителя бързо да разпознае текущото си местоположение на екрана и улеснява навигацията. Когато потребителят за миг се обърне от телевизора и след това погледне назад, трябва да е ясно коя опция е избрана за навигация. Всеки елемент на екрана трябва да бъде достъпен от курсора и винаги трябва да е ясно къде курсорът може да се придвижва по-нататък.
Примери за оформления, които могат да накарат потребителите да се чудят къде се намират в приложението. Тези примери не осигуряват достатъчна визуална индикация (състояние на фокуса) на позиционирането. Потребителите трябва да могат ясно да виждат къде се намират по всяко време, без да се налага да се движат нагоре или надолу. Трябва да можете да отклоните поглед от телевизора и обратно и все пак да знаете позицията му.
как да използвате медийни заявки за отзивчив дизайн
Типография
Прочетете на разстояние десет метра.
Телевизионните приложения често се наричат опит с десет фута, термин, който се отнася до общо разстояние между вас и вашия телевизор. За разлика от други устройства като мобилни устройства и настолни компютри, телевизията е настроена да бъде по-скоро среда за „отпускане и наслада“. Като се има предвид това разстояние, трябва да се отнасяме към малко по-различен потребителски интерфейс, отколкото в мрежата или мобилните устройства.
Телевизионните екрани обикновено са по-големи от мобилните устройства и мониторите за настолни компютри, но се гледат от по-голямо разстояние. Четливостта се превръща във важна характеристика, което означава, че размерът на текста и другите елементи трябва да се коригират съответно. В зависимост от възрастта ви 18px вероятно ще бъде най-малкият четим размер и подходящ само за несъществени маркери, като миглите за вежди. И все пак, като общо правило, избраните размери на шрифта никога не трябва да бъдат по-малки от 24 pt. Това бих помислил за минималния размер на шрифта, за да побере всеки тип потребител.
Ключът към добрата типография по телевизията е непрекъснатото тестване. Финият, малък шрифт на вашия монитор ще изглежда чист и остър, но след като се появи на телевизор, той може да изглежда издухан или неразбираем.
купувачите са силно чувствителни към цената, когато
Ключът към добрата типография по телевизията е да тествате постоянно. Тънкият малък шрифт на вашия монитор ще изглежда чист и свеж, но след като се появи на телевизор, той може да изглежда издухан или да стане неразбираем.
Изследователски линии
Какво представляват линиите за сканиране?
За разлика от екраните на настолни компютри, мобилни устройства и таблети, изображението на телевизионния екран се състои от нечетни и равни линии за сканиране. Телевизията превръща тези линии във фази, като бързо се редува между нечетни и четни линии за сканиране. Всеки пиксел (или линия от пиксели), който попадне върху една линия на сканиране, ще мига. За да избегнете трептене на вашите елементи на екрана, винаги трябва да държите линиите си с четни числа и не по-тънки от 2 пиксела. Това е нещо, което трябва да имате предвид, когато работите върху крос-платформени проекти и се подготвяте за прехвърляне на вашите дизайни към сензорни устройства (мобилни и таблетни), където често можете да намерите създаване на бутони за границата 1px за телевизия.
Друг начин да избегнете тези размазани линии или форми е да се уверите, че вашите дизайни винаги са перфектни с пиксели. Следващата идея е добър пример за редове, които са създадени с помощта на неправилни числа. Както можете да видите, можем ясно да видим ефектите от това и то става преследващо за очите.
Цвят
Телевизионните монитори имат ограничения.
Първият елемент, който трябва да имате предвид, е, че телевизорите имат много по-висока гама стойност от настолните, таблетите и телефонните устройства. Най-добрият начин да се опише как гамата влияе върху качеството на изображението е, че гамата представлява нивото на разлика в яркостта между всяка стъпка от сивата скала или как 'бързите' черни стават по-ярки. Ние възприемаме светлината два пъти по-ярко от фракцията. Различните марки и модели телевизори се различават значително по отношение на яркостта, дисплея и други настройки. Подобно на типа, цветът трябва да се тества рано и често на телевизори.
Някои насоки, които да следвате при избора на вашите цветове: Ярките цветове могат да бъдат резки на очите, когато гледате телевизия през нощта или в тъмна стая. Избягвайте да използвате прекалено наситени цветове (особено червено) и да използвате интензивно бяло върху големи елементи или фонове. Чисто бялото ще създаде ореоли и други визуални разсейвания. При избора на заготовки се препоръчва да изберете шестнадесетична стойност # f1f1f1 за да се избегне трептене. За да се увеличи четливостта, не забравяйте да създадете достатъчно контраст между вашите елементи
Общото правило е да се избягват остри ръбове между силно контрастни цветове (особено ярките цветове заедно с тъмните цветове) и да се избягват „горещи“ цветове като силно наситени червени и жълти. Те кървят по-лесно от по-наситените цветове или по-студените цветове като блус и зелени.
Винаги тествайте цветовете на истински телевизор, за да разберете как вашите цветови решения се превеждат на големия екран. Ако е възможно, прегледайте приложението си на няколко телевизора, защото цветовете могат да се различават драстично в различните модели телевизори. Просто включете HDMI кабела от вашия телевизор и опитайте.
Основите
Няколко малки неща, които трябва да имате предвид.
Тези елементи трябва да се използват за насочване на вашите проекти като цяло. Най-важните съображения при проектирането на потребителските интерфейси на телевизора са простота и леко взаимодействие.
Въпреки че много от основи и най-добри практики за проектиране на взаимодействие все още се прилага, телевизията се използва по-спокойно, за разлика от компютър или мобилно устройство. Потребителският интерфейс на телевизор трябва да бъде ясен, опростен и визуален. Дизайнът изисква простота и яснота с ниска плътност на информацията. Елементите трябва да са големи и отдалечени достатъчно отдалечени, за да се четат от разстояние. Представя ясен набор от действия или опции за всеки екран.
Този дизайн е изчистен и опростен, използвайки хубави големи процедури на картата. Състоянията на фокус се постигат с мащаб и падащи сенки, които са подравнени с останалата част от изчистения дизайн.
Този дизайн е изчистен и опростен, използвайки хубави обработки с големи карти. Състоянията на фокус се постигат с мащаб и падащи сенки, които са подравнени с останалата част от изчистения дизайн. Метаданните също се виждат само в състояние _hover_, което позволява на потребителите да останат фокусирани върху текущата карта.
Този дизайн е изчистен и опростен, използвайки хубави обработки с големи карти. Състоянията на фокус се постигат с мащаб и падащи сенки, които са подравнени с останалата част от изчистения дизайн.
Разширяване на границите на традиционните телевизионни дизайни. Това осигурява алтернативен кинематографичен подход към обичайното лечение с карти 16 x 9, което много други използват. В сравнение с много други услуги, фокусът беше да се изведе менюто в долната част на екрана
Разширяване на границите на традиционните телевизионни дизайни. Извеждайки новините на преден план, потребителите се фокусират върху една новина в даден момент срещу. редове и редове от съдържание.
Детските потребителски интерфейси трябва да бъдат интуитивни, забавни и лесни за използване. Този дизайн показва, че компаниите са в състояние да изтласкат своите проекти отвъд традиционната мрежа, като се фокусират върху карти 1x1, 2x3 или дори 16x9.
Поставете най-важното съдържание или опции на първо място на екрана, за да бъдат лесно видими и навигационни от потребителя. Излишните нива на екрана трябва да бъдат премахнати. Влизането в различни нива и излизането отново трябва да е лесно и очевидно.
Най-важният фактор при проектирането на телевизионно приложение е да се включи ясна и прецизна навигация за потребителските операции. Ако навигацията е двусмислена, потребителите ще се чувстват объркани и несигурни.
Накратко, потребителите винаги трябва да знаят точно къде се намират в дадено приложение. Не забравяйте, че потребителят използва само основните контроли за навигация. Move, Back, Enter и други основни функции за навигация трябва да са ясни. Потребителите трябва да могат да използват операциите, които искат с тези действия.
Фокусът беше да се разширят границите на традиционния телевизионен дизайн. Намирате креативни начини да демонстрирате широкия набор от съдържание, достъпно за потребителите, като същевременно го правите интуитивен и лесен за използване.
Като дизайнери, нашата работа е да създаваме и проектираме потребителски интерфейси, които позволяват на потребителите да имат достъп до съдържанието по ясен и лесен за навигация начин. Не можем да очакваме потребителите да възприемат нови навици, за да могат да разглеждат нашето съдържание. По-скоро трябва да адаптираме потребителските си интерфейси, така че да могат да се управляват на тъмно от някой, който ни дава по-малко от пълното им намерение, и с много ограничено входно устройство. Това е голямо предизвикателство, но потенциалната печалба е огромна. Приятно проектиране!
