Методи та засоби оцінювання дизайну інтерфейсу мобільних додатків на основі використання технології відслідковування погляду

Abstract

Дисертаційна робота присвячена вирішенню актуальної науково-практичної задачі підвищення ефективності оцінювання зручності користування мобільними інтерфейсами шляхом розробки методів та програмного засобу мобільного айтрекінгу на основі фронтальної камери смартфона. Стрімке зростання кількості мобільних додатків та користувачів смартфонів висуває підвищені вимоги до якості інтерфейсів та обумовлює потребу в об’єктивних інструментах оцінки їх зручності. Існуючі методи юзабіліті-тестування переважно базуються на суб’єктивних оцінках (опитувальники, інтерв’ю, експертна оцінка) та не завжди відображають реальну поведінку користувачів. Технологія відслідковування погляду (eye-tracking) дозволяє вимірювати когнітивні процеси в режимі реального часу, проте її застосування у дослідженнях мобільних інтерфейсів обмежене високою вартістю спеціалізованого обладнання, необхідністю фіксації положення пристрою та відсутністю цілісної методики оцінювання. У першому розділі дисертації проведено аналіз сучасного стану технологій айтрекінгу. Розглянуто основні типи апаратних комплексів для відслідковування погляду: настільні трекери, мобільні окуляри, а також системи для віртуальної та доповненої реальності. Окремо проаналізовано мобільний та веб-камерний айтрекінг. Досліджено параметри, що впливають на якість відслідковування і алгоритми виявлення фіксацій: роздільність камери, частоту кадрів, точність, кучність, латентність синхронізації, час відновлення погляду та ергономічні характеристики. Проведено класифікацію та аналіз методів локалізації очей. Це охоплює підходи на основі форми, особливостей форми та зовнішнього вигляду. Проаналізовано також методи гейз-трекінгу. Розглянуто алгоритми виявлення фіксацій: I-VT (за порогом швидкості), I-DT (за порогом розсіювання) та I-HMM (на основі прихованих моделей Маркова). Встановлено, що жодне з розглянутих рішень не поєднує мобільну платформу на базі стандартної фронтальної камери з формалізованою методикою аналізу, адаптованою до різних типів екранів. На основі виявлених обмежень сформульовано задачі дослідження. У другому розділі розроблено два методи оцінювання дизайну мобільних інтерфейсів на основі айтрекінгу. Перший метод орієнтований на статичні екрани: визначено систему метрик візуальної уваги, запропоновано класифікацію типів екранів мобільних додатків із визначенням пріоритетних зон інтересу для кожного типу та описано шестиетапний процес проведення дослідження. Методологічну відмінність від існуючих протоколів становить те, що тип екрану і склад AOI визначаються до початку збору даних, а суб’єктивне оцінювання зручності проводиться після кожного окремого завдання, що дає змогу безпосередньо зіставити об’єктивні метрики погляду з враженнями учасника. Другий метод орієнтований на динамічні екрани: екрани з прокручуванням, навігаційними переходами, відеоконтентом та анімованими елементами. Для таких екранів введено поняття часової зони інтересу, прив’язаної до координат повного документа і тайм-кодів; визначено метрики охоплення і залученості; алгоритм обробки даних розширено трьома операціями попередньої обробки. Цей метод описано і теоретично обґрунтовано, його емпірична валідація визначена як напрям подальших досліджень. Формалізовано правило прийняття рішення про якість дизайну, що зводить показники візуальної уваги до єдиного комплексного показника з урахуванням вагомості критеріїв, визначеної експертно для кожного типу екрана. У третьому розділі описано проєктування та реалізацію програмного засобу EyeSense – кросплатформеного мобільного додатка на Flutter/Dart для проведення айтрекінг-досліджень на основі фронтальної камери з використанням Eyedid SDK. Реалізовано алгоритми згладжування координат погляду, виявлення фіксацій методом I-DT, побудови теплових карт і маршрутів погляду. Передбачено п’ятиточкове калібрування та хмарне збереження анонімізованих даних, що дає змогу проводити польові дослідження без прив’язки до лабораторного середовища. Обробка координат погляду реалізована дворівневим конвеєром: EMA-буфер усуває шумові коливання сирих координат і дискретизує сигнал з кроком 150 мс, тоді як модифікований алгоритм I-DT розбиває безперервний потік точок погляду на дискретні фіксації з мінімальною тривалістю 150 мс і порогом розсіювання 30 пікселів. У хмарне сховище Firebase потрапляють лише анонімізовані координати, теплові карти та демографічні метадані (UUID, вік, стать, без імені), що відповідає вимогам платформи Prolific щодо конфіденційності учасників. Функція очищення профілю між сесіями робить можливим масштабні польові дослідження на одному пристрої за будь-якого розміру вибірки. У четвертому розділі проведено експериментальне дослідження розподілу візуальної уваги на типових екранах мобільних додатків з використанням розробленого методу та програмного засобу EyeSense. У дослідженні взяли участь 55 осіб віком від 20 до 60 років, рекрутованих через платформу Prolific, що забезпечило різноманітність вибірки за національністю, віком, статтю та цифровим досвідом. Учасники виконували завдання на трьох типових екранах: картці товару (e-commerce), екрані медичних результатів та навігаційній карті. Проведено аналіз за групами: за віком (молодші/старші 40 років) та за рівнем цифрової компетентності. Результати показали, що просторова ієрархія елементів є домінантним чинником розподілу уваги незалежно від характеристик користувача: елементи у верхній та центральній частинах екрану стабільно отримували найвищу увагу. Статистично значущих вікових відмінностей в об’єктивних метриках айтрекінгу (Tff, Tfd, Ff) не виявлено, однак старші учасники систематично гірше оцінювали зручність інтерфейсу в суб’єктивних анкетах, що вказує на недостатність поведінкових показників для повноцінної оцінки когнітивного навантаження. Розрив між суб’єктивними оцінками молодших і старших учасників становив від 0,24 до 0,58 бали за п’ятибальною шкалою, за відсутності будь-яких паралельних відмінностей в об’єктивних айтрекінг-метриках. Цифрова компетентність вплинула на стратегії взаємодії: досвідченіші користувачі спочатку зчитували контекстну інформацію (ціну, характеристики) і лише потім зверталися до елемента дії (CTA-кнопки), що корелювало з кращим розумінням інтерфейсу. Менш досвідчені користувачі частіше фіксувалися безпосередньо на кнопці дії, пропускаючи важливу контекстну інформацію. Виявлені закономірності розкриваються за допомогою ключових метрик. На екрані картки товару зона знижки (AOI 1) не отримала жодної фіксації у 33% учасників; медіанний час до першої фіксації для неї склав 3666 мс проти 1672 мс для блоку ціни, розташованого вище на тому ж екрані. На медичному екрані розрив виявився більшим: показник вітаміну D (нижня зона інтересу) залишився поза увагою у 54,5% учасників із Tff = 6563 мс, проти 3718 мс для глюкози у верхній зоні, попри однакову діагностичну значущість обох відхилень. На навігаційному екрані різниця стосувалася не стільки ієрархії уваги, скільки стратегії сканування: учасники з низькою цифровою компетентністю зверталися до курсора карти при медіанному Tff = 1206 мс, тоді як досвідченіші приймали навігаційне рішення лише після зчитування числових даних панелі (медіана Tff = 4652 мс). На всіх трьох екранах вертикальне розташування елемента виявилося надійнішим фактором ймовірності його фіксації, ніж функціональна пріоритетність. Поєднання об’єктивних метрик із суб’єктивними оцінками виявилося методологічно продуктивним підходом. На основі результатів сформульовано практичні дизайн-рекомендації щодо розташування критичних елементів, візуального контрасту CTA-кнопок, необхідності подвійної валідації для різних вікових груп та підвищеного виділення навігаційних елементів. Наукова новизна отриманих результатів полягає у наступному. Вперше розроблено модель інформаційної взаємодії користувача з мобільним інтерфейсом в умовах айтрекінг-дослідження, яка за рахунок формалізації процесу взаємодії у вигляді чотирифазного циклу (сенсорна реєстрація, візуальне декодування, когнітивне інтерпретування, поведінкова реакція) з трьома паралельними інформаційними каналами (візуальним, когнітивним і суб’єктивним) встановлює відповідність між кожною фазою та вимірюваними показниками айтрекінгу, що дозволяє локалізувати дизайн-проблему в конкретній частині взаємодії. Вперше розроблено метод оцінювання дизайну статичних мобільних інтерфейсів на основі айтрекінгу, який за рахунок використання фронтальної камери смартфона як єдиного апаратного сенсора, набору спеціалізованих метрик візуальної уваги та структурованої послідовності з шести етапів проведення айтрекінг-дослідження: (1) визначення об’єкта та цілей дослідження, (2) налаштування технічного середовища, (3) проведення експериментальної сесії, (4) збір та аналіз метрик погляду, (5) інтерпретація результатів, (6) формування рекомендацій і повторне тестування – дозволяє отримати об’єктивну оцінку дизайну інтерфейсу без використання спеціалізованого обладнання. Вперше розроблено метод оцінювання ефективності дизайну динамічних мобільних екранів, який за рахунок використання часової зони інтересу (T-AOI) з прив'язкою до координат повного документа і тайм-кодів, паралельної реєстрації стану інтерфейсу під час сесії та розширеного набору метрик охоплення і залученості (глибина, швидкість і кількість зупинок прокрутки), що реалізуються у шість послідовних етапів: (1) підготовка та розмітка T-AOI з документуванням динаміки, (2) налаштування середовища з організацією синхронізованого запису, (3) проведення сесії, (4) обробка даних із виключенням переходів та перерахунком координат у простір документа, (5) інтерпретація результатів із аналізом глибини прокрутки, (6) формування рекомендацій та верифікація змін, – що дозволяє коректно аналізувати розподіл візуальної уваги в сценаріях з динамічним контентом, де стандартна AOI, прив'язана до статичних координат екрану, не забезпечує повної картини взаємодії. Достовірність отриманих результатів забезпечена такими чинниками. По-перше вибірка з 55 учасників перевищує мінімальний поріг, обґрунтований у методологічній літературі з айтрекінгу, і має достатню статистичну потужність для виявлення міжгрупових ефектів. По-друге залучення через Prolific дало географічно та демографічно неоднорідну групу, що суттєво для методу, розрахованого на широке практичне застосування. По-треттє проведення експерименту з учасниками, які тримали власні пристрої на природній відстані перегляду, зберегло екологічну валідність; те, що дані залишилися придатними для стандартизованої постобробки, підтверджує: конвеєр стабільно працює в реальних умовах, а не лише в контрольованому середовищі. Практичне значення результатів полягає у створенні доступного інструментарію для оцінювання мобільних інтерфейсів, що не потребує спеціалізованого обладнання. Розроблені методи та програмний засіб EyeSense можуть використовуватися UX-дослідниками, розробниками мобільних додатків і викладачами дисциплін з проєктування інтерфейсів.

The dissertation addresses the problem of improving the efficiency of mobile interface usability evaluation by developing methods and a software tool for mobile eye-tracking using the smartphone’s front-facing camera. The rapid growth of mobile applications and smartphone users is placing increasing demands on UI quality and highlighting the need for objective usability assessment tools. Existing usability testing methods rely predominantly on subjective judgments – questionnaires, interviews, expert evaluation – and do not consistently capture actual user behavior. Eye-tracking technology records mental activities in real time, yet its application in mobile interface research remains limited by the high cost of specialized hardware, the need to fix the device’s position, and the lack of an extensive evaluation methodology. The first chapter analyses the current state of eye-tracking technologies. The main hardware categories are reviewed: desktop trackers, mobile glasses, and systems for virtual and augmented reality environments. Mobile and webcam-based eye-tracking are examined separately. Parameters affecting tracking quality are investigated, including camera resolution, frame rate, accuracy, precision, synchronization latency, gaze recovery time, and ergonomic characteristics, as well as algorithms for fixation detection. Eye localization methods are classified, covering shape-based, feature-based, and appearance-based approaches, as well as gaze-tracking techniques. Fixation detection algorithms are reviewed: I-VT (velocity threshold), I-DT (dispersion threshold), and I-HMM (hidden Markov model). The analysis shows that none of the reviewed solutions combines a mobile platform built on a standard front-facing camera with a formalized evaluation methodology adapted to different screen types. Research objectives are formulated based on the identified limitations. The second chapter presents two eye-tracking-based methods for evaluating mobile interface design. The first method targets static screens: a visual attention metric system is defined, a classification of mobile application screen types with prioritized areas of interest for each type is proposed, and a six-stage research process is described. The key methodological distinction from present protocols is that the screen type and AOI composition are fixed before data collection begins, and subjective usability ratings are collected after each task – thereby supporting direct comparison of objective gaze metrics with participant experience. The second method targets dynamic screens: screens with scrolling, navigational transitions, video content, and animated elements. For such screens, the concept of Temporal Area of Interest (T-AOI) anchored to full-document coordinates and timecodes is introduced; coverage and engagement metrics are defined (scroll depth, scroll velocity, scroll stops); and the data processing pipeline is extended with three mandatory pre-processing operations. This method is presented as a conceptual framework, and its experimental assessment is identified as a direction for further research. A decision rule for design quality assessment is formalized, aggregating visual-attention metrics into a single composite index with criteria weights determined by experts for each screen type. The third chapter describes the design and implementation of EyeSense – a cross-platform mobile application built on Flutter/Dart for conducting eye-tracking research using the front-facing camera with the Eyedid SDK. Algorithms for gaze coordinate smoothing, fixation detection via I-DT, and heatmap and scan-path generation are implemented. Five-point calibration and cloud storage of anonymized data are provided, enabling field research outside laboratory settings. Gaze signal processing is realized through a two-level pipeline in which raw coordinate noise is removed and sampled at 150 ms intervals in an EMA buffer (effective 6-7 Hz), while a modified I-DT algorithm has divided the continuous CP stream into discrete fixations with a minimum duration of 150 ms and at a threshold of 30 pixels. Firebase Cloud Storage only has anonymized coordinates, heatmaps, as well as demographical metadata (UUID, age, gender without names), and is complying with the requirements of Prolific's platform privacy. The fourth chapter reports an experimental study of the distribution of visual attention across representative mobile application screens, using the developed method and the EyeSense software tool. The study involved 55 participants aged 20 to 60, recruited via the Prolific platform, ensuring a diverse sample across nationalities, ages, genders, and levels of digital experience. Participants completed tasks on three screen types: a product card (e-commerce), a medical results screen, and a navigation map. Group-level analysis was performed by age (below/above 40) and digital competence level. Results showed that the spatial hierarchy of elements is the dominant factor in attention distribution, regardless of user characteristics: elements in the upper and central screen areas consistently attracted the most attention. No statistically significant age-related differences were found in objective eye-tracking metrics (Tff, Tfd, Ff); however, older participants systematically gave lower usability ratings in subjective questionnaires, indicating that behavioral measures alone are insufficient for assessing mental workload. The gap between the subjective ratings of younger and older participants ranged from 0.24 to 0.58 points on a five-point scale, with no parallel differences in objective eye-tracking metrics. Digital competence level shaped interaction strategies: more experienced users scanned contextual information (price, specifications) before engaging with the call-to-action element, which correlated with better interface comprehension, while less experienced users fixated on the action button directly, bypassing appropriate context. The session-clearing function allows for large-scale field research in one device with high participant pool sizes. Key figures for the quantitative profile of the patterns found are: Discount zone (AOI 1) was not fixed on 33% of patients on the product card screen; median Tff was 3666 ms in the discount zone, versus 1672 ms for the price block. On the screen for medical results, the vitamin D indicator (lower AOI) failed to achieve fixation in 54.5% of participants at a Tff of 6563 ms, versus 3718 ms for glucose, in the upper zone, with both deviations having equal diagnostic significance. Participants with low digital competence on navigation screen presented directing attention on map cursor at a median Tff of 1206 ms compared to more experienced users that made navigational decisions only after reading numeric data panel (median Tff = 4652 ms), which implies that vertical screen position is a more accurate predictor of fixation probability than functional priority. The combination of objective metrics and subjective ratings proved methodologically productive. Practical design recommendations are formulated for the placement of critical elements, the visual contrast of CTA buttons, dual validation throughout age groups, and enhanced highlighting of navigational elements. Three aspects help establish the credibility of the results. First, the total of 55 respondents is higher than the minimum number for eye-tracking experiments and gives substantial statistical power to report between-group differences. Second, recruitment methods based on Prolific allowed the distribution of the data across countries of residence, gender and digital literacy levels, which improves the external validity of the results. Third, the combination of a naturalistic collection format with centralized cloud storage facilitated standardized post-processing of raw gaze data, avoiding the need for laboratory infrastructure. Scientific novelty. For the first time, a model of user-interface information interaction under eye-tracking conditions is proposed, describing the interaction as a four-phase cycle with three information channels and formalizing the correspondence within interaction phases and gaze metrics. For the first time, a method for evaluating static mobile screen design using eye-tracking is developed, combining a specialized visual attention metric system, a screen-type classification, and a six-stage research process, validated with a sample of 55 participants. For the first time, a method for evaluating the design effectiveness of dynamic mobile screens is developed, introducing the concept of Temporal AOI (T-AOI) and synchronized interface-state recording for scrolling, navigational transition, and video content scenarios. Practical significance. The results deliver an accessible toolkit for mobile interface evaluation that requires no specialized hardware. The developed methods and the EyeSense software tool can be applied by UX researchers, mobile application developers, and educators in interface design disciplines.