Implementation of UI support for Touch Enabled Media Platforms
Törnroos, Christoffer (2021)
Törnroos, Christoffer
2021
All rights reserved. This publication is copyrighted. You may download, display and print it for Your own personal use. Commercial use is prohibited.
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2021052812265
https://urn.fi/URN:NBN:fi:amk-2021052812265
Tiivistelmä
This thesis looks into the implementation of touch support for Hibox Systems interactive media and information system. The purpose of the implementation is that the system can be used on touch enabled media platforms, such as a tablet. From the beginning, the system was only intended to be used on TVs and STBs and that is why there is no support whatsoever for use on a touch enabled platform. In addition to the implementation of touch support, a way of handling and running animations should be implemented as well to improve the use-flow of the UI.
The implementation will be done in dlx; the frontend web application that is run on the end-user devices using JavaScript, CSS, and HTML. This task also includes evaluating several different libraries that will be used to extend JavaScript functionality and also extend touch support functionality.
The results of this task were a proper implementation to lean on when developing for touch enabled platforms allowing for an easy and structured use when in need of touch support when developing new applications or user interaction functionality. Moreover, there is also a user-friendly animation component ready to use when developing new features. Detta examensarbete behandlar implementationen av pekskärmsstöd för Hibox Systems interaktiva media- och informationssystem. Implementationens syfte är att systemet ska kunna användas på pekskärmsbaserade plattformar. Systemet från sin början är utvecklat för TV-apparater och TV-boxar och har därför inget stöd för att användas på en pekskärm. I samband med utvecklingen av pekskärmsstöd ska även ett systemanpassat sätt att använda animationer implementeras för att förbättra användningen av systemet på en pekskärm.
Implementationerna sker i systemets webbapplikation, dlx, som körs på slutanvändarens enhet. Webbapplikationen är utvecklad i JavaScript, CSS och HTML och därav kommer implementationen göras i dessa språk med hjälp av några bibliotek som utökar funktionaliteten i JavaScript men också bidrar med utökad funktionalitet för användning av pekskärmar.
Slutprodukten av arbetet blev en ordentlig bas att använda sig av när funktionaliteten av pekskärmsstödet skulle implementeras i alla diverse applikationer och menyer. I dessa applikationer och menyer kunde även animationer implementeras med hjälp av den nya animationskomponenten.
The implementation will be done in dlx; the frontend web application that is run on the end-user devices using JavaScript, CSS, and HTML. This task also includes evaluating several different libraries that will be used to extend JavaScript functionality and also extend touch support functionality.
The results of this task were a proper implementation to lean on when developing for touch enabled platforms allowing for an easy and structured use when in need of touch support when developing new applications or user interaction functionality. Moreover, there is also a user-friendly animation component ready to use when developing new features.
Implementationerna sker i systemets webbapplikation, dlx, som körs på slutanvändarens enhet. Webbapplikationen är utvecklad i JavaScript, CSS och HTML och därav kommer implementationen göras i dessa språk med hjälp av några bibliotek som utökar funktionaliteten i JavaScript men också bidrar med utökad funktionalitet för användning av pekskärmar.
Slutprodukten av arbetet blev en ordentlig bas att använda sig av när funktionaliteten av pekskärmsstödet skulle implementeras i alla diverse applikationer och menyer. I dessa applikationer och menyer kunde även animationer implementeras med hjälp av den nya animationskomponenten.