Keräilykorttipelin toteutus HTML5- ja Javascript-tekniikoilla

HTML5-tekniikka sekä Javascript tuen laajuus selaimissa vaihtelee. Tässä työssä kyseisiä tekniikoita tutkitaan ja selvitetään niiden toimivuus keräilykorttipelin tarvittavien ominaisuuksien osalta. Tuet kartoitetaan viiden yleisimmän selaimen osalta. HTML5 tukee WebSocket-ominaisuutta, mutta kaikki selaimet eivät tue ominaisuutta tai se on poistettu käytöstä. Työssä etsitään tiedonsiirtotekniikan korvaaja, jota testataan ja verrattaan yleisesti käytettäviin tekniikoihin. Socket.io oli nopea tekniikka ja viisi yleisintä selainta tuki kyseistä tekniikkaa. Tämän vuoksi Socket.io-tekniikka soveltuu keräilykorttipeliin hyvin. Työssä tutkitaan keräilykorttipeliin liittyviä ongelmia sekä ratkaistaan ilmenneet ongelmat. Keräilykorttipelissä kyseisiä ongelmia ilmeni hyvin vähän. HTML5 animaatio tutkitaan että se on optimoitu hyvin, jotta käyttäjälle tulee miellyttävä peli kokemus. Keräilykorttipeliin lisäksi tehdään käytännön toteutuksena pakkaeditorin prototyyppi, jossa käytetään drag&drop-tekniikkaa. Tämän vuoksi myös drag&drop-tekniikan tuki on selainten osalta kartoitettu myös työssä, sekä testattu käytännön toteutuksena prototyypissä. Prototyypin tarkoitus on kartoittaa mahdolliset tulevat ongelmat sekä auttaa varsinaisen pakkaeditorin tuotantoversiossa.

Opetuskäyttöön suunnatun videoneuvottelteluportaalin prototyypin suunnittelu ja toteuttaminen avoimilla tekniikoilla

Työ tutkii, miten yksinkertaisen opetuskäyttöön suunnatun videoneuvotteluportaalin prototyypin rakentaminen onnistuu avoimilla tekniikoilla. WebRTC mahdollistaa selaimen päällä toimivan videoneuvottelusovelluksen rakentamisen avoimia ohjelmistorajapintoja käyttäen. Prototyypin toteuttamiseen käytetään WebRTC:n lisäksi WebSocket-standardia keskustelun tahojen yhdistämiseen. WebSocket toteutetaan Node.js:ää käyttävällä socket.io-kirjastolla. Sovelluksen avulla on tarkoitus pystyä muodostamaan ääni- ja videoyhteys kahden asiakasohjelman välille. Opetuskäyttöä tukevina ominaisuuksina mukana on myös tekstipohjainen keskustelu ja mahdollisuus opetuskalvojen selaamiseen. Lopputuloksena on laajennettavissa oleva avoin videoneuvottelusovelluksen prototyyppi.

Opittavuus WWW-sovelluksissa

Nykyisin yhä laajempia sovelluksia toteutetaan WWW-sovelluksina, joita myös vähän tietokoneita käyttäneiden pitäisi oppia käyttämään. Ohjelmiston oppimisen helppoutta mitataan opittavuudella, jota parantavat yksinkertaistaminen, graafinen suunnittelu, kuvakkeiden selkeys ja yleisesti käytettävät toimintatavat. Tässä työssä tarkastellaan HTML5:ttä ja kolmea WWW-sovellusta edellä mainittujen opittavuuden tekijöiden suhteen. HTML5:ssä on muutamia opittavuutta parantavia uusia ominaisuuksia, kuten tehokkaammat tietojensyöttötavat ja median toisto. Tutkituilla sivuilla opittavuuteen vaikuttavat tekijät olivat pääosin kunnossa. Hyvin toteutettuna laajakin WWW-sovellus on helposti opittava. HTML5 tuo yhtenäisyyttä ja häivyttää yhä enemmän WWW-sovellusten ja työpöytäsovellusten rajaa. Jatkossa sisällön visualisointia voisi kehittää opittavuuden parantamiseksi.

Mobile learning and video experience in delivering digital content

In recent years, the worldwide distribution of smartphone devices has been growing rapidly. Mobile technologies are evolving fast, a situation which provides new possibilities for mobile learning applications. Along with new delivery methods, this development enables new concepts for learning. This study focuses on the effectiveness and experience of a mobile learning video promoting the key features of a specific device. Through relevant learning theories, mobile technologies and empirical findings, the thesis presents the key elements for a mobile learning video that are essential for effective learning. This study also explores how previous experience with mobile services and knowledge of a mobile handset relate to final learning results. Moreover, this study discusses the optimal delivery mechanisms for a mobile video. The target group for the study consists of twenty employees of a Sanoma Company. The main findings show that the individual experience of learning and the actual learning results may differ and that the design for certain video elements, such as sound and the presentation of technical features, can have an impact on the experience and effectiveness of a mobile learning video. Moreover, a video delivery method based on cloud technologies and HTML5 is suggested to be used in parallel with standalone applications.

Drivers and barriers of mobile travel and tourism service adoption : a study of individual perceptions and business model development in a travel and tourism context

The Travel and Tourism field is undergoing changes due to the rapid development of information technology and digital services. Online travel has profoundly changed the way travel and tourism organizations interact with their customers. Mobile technology such as mobile services for pocket devices (e.g. mobile phones) has the potential to take this development even further. Nevertheless, many issues have been highlighted since the early days of mobile services development (e.g. the lack of relevance, ease of use of many services). However, the wide adoption of smartphones and the mobile Internet in many countries as well as the formation of so-called ecosystems between vendors of mobile technology indicate that many of these issues have been overcome. Also when looking at the numbers of downloaded applications related to travel in application stores like Google Play, it seems obvious that mobile travel and tourism services are adopted and used by many individuals. However, as business is expected to start booming in the mobile era, many issues have a tendency to be overlooked. Travelers are generally on the go and thus services that work effectively in mobile settings (e.g. during a trip) are essential. Hence, the individuals’ perceived drivers and barriers to use mobile travel and tourism services in on-site or during trip settings seem particularly valuable to understand; thus this is one primary aim of the thesis. We are, however, also interested in understanding different types of mobile travel service users. Individuals may indeed be very different in their propensity to adopt and use technology based innovations (services). Research is also switching more from investigating issues of mobile service development to understanding individuals’ usage patterns of mobile services. But designing new mobile services may be a complex matter from a service provider perspective. Hence, our secondary aim is to provide insights into drivers and barriers of mobile travel and tourism service development from a holistic business model perspective. To accomplish the research objectives seven different studies have been conducted over a time period from 2002 – 2013. The studies are founded on and contribute to theories within diffusion of innovations, technology acceptance, value creation, user experience and business model development. Several different research methods are utilized: surveys, field and laboratory experiments and action research. The findings suggest that a successful mobile travel and tourism service is a service which supports one or several mobile motives (needs) of individuals such as spontaneous needs, time-critical arrangements, efficiency ambitions, mobility related needs (location features) and entertainment needs. The service could be customized to support travelers’ style of traveling (e.g. organized travel or independent travel) and should be easy to use, especially easy to take into use (access, install and learn) during a trip, without causing security concerns and/or financial risks for the user. In fact, the findings suggest that the most prominent barrier to the use of mobile travel and tourism services during a trip is an individual’s perceived financial cost (entry costs and usage costs). It should, however, be noted that regulations are put in place in the EU regarding data roaming prices between European countries and national telecom operators are starting to see ‘international data subscriptions’ as a sales advantage (e.g. Finnish Sonera provides a data subscription in the Baltic and Nordic region at the same price as in Finland), which will enhance the adoption of mobile travel and tourism services also in international contexts. In order to speed up the adoption rate travel service providers could consider e.g. more local initiatives of free Wi-Fi networks, development of services that can be used, at least to some extent, in an offline mode (do not require costly network access during a trip) and cooperation with telecom operators (e.g. lower usage costs for travelers who use specific mobile services or travel with specific vendors). Furthermore, based on a developed framework for user experience of mobile trip arrangements, the results show that a well-designed mobile site and/or native application, which preferably supports integration with other mobile services, is a must for true mobile presence. In fact, travel service providers who want to build a relationship with their customers need to consider a downloadable native application, but in order to be found through the mobile channel and make contact with potential new customers, a mobile website should be available. Moreover, we have made a first attempt with cluster analysis to identify user categories of mobile services in a travel and tourism context. The following four categories were identified: info-seekers, checkers, bookers and all-rounders. For example “all-rounders”, represented primarily by individuals who use their pocket device for almost any of the investigated mobile travel services, constituted primarily of 23 to 50 year old males with high travel frequency and great online experience. The results also indicate that travel service providers will increasingly become multi-channel providers. To manage multiple online channels, closely integrated and hybrid online platforms for different devices, supporting all steps in a traveler process should be considered. It could be useful for travel service providers to focus more on developing browser-based mobile services (HTML5-solutions) than native applications that work only with specific operating systems and for specific devices. Based on an action research study and utilizing a holistic business model framework called STOF we found that HTML5 as an emerging platform, at least for now, has some limitations regarding the development of the user experience and monetizing the application. In fact, a native application store (e.g. Google Play) may be a key mediator in the adoption of mobile travel and tourism services both from a traveler and a service provider perspective. Moreover, it must be remembered that many device and mobile operating system developers want service providers to specifically create services for their platforms and see native applications as a strategic advantage to sell more devices of a certain kind. The mobile telecom industry has moved into a battle of ecosystems where device makers, developers of operating systems and service developers are to some extent forced to choose their development platforms.

Mobiilipelien kehitys ja julkaisu monialustakehitystyökaluja hyödyntäen

Tässä kandidaatintyössä esitellään mobiilimarkkoiden pirstaloitumisongelma, ja se millaisia haasteita kehittäjät voivat kokea kehittäessään sovelluksia, jotka tukevat useampia mobiilialustoja. Lisäksi työssä esitellään erilaisia mobiilisovelluksissa käytettäviä monetisaatiomalleja. Työssä tarkastellaan myös monialustakehitystyökalujen ja HTML5-tekniikan soveltuvuutta mobiilialustojen kehityshaasteiden ratkaisemiseen. Työn lopuksi toteutetaan ja julkaistaan käytännön pelisovellus monialustatyökalulla eri alustoja tukien. Tämän demosovelluksen avulla perehdytään julkaisuprosesseihin käytännössä, tuoden esille eri alustojen asettamia vaatimuksia kehittäjälle.

Offline-tila web-sovelluksissa

Selainpohjaiset sovellukset ovat yleistyneet viimeisen kymmenen vuoden aikana. Samanaikaisesti ympäristö, jossa ihmiset käyttävät sovelluksia, on muuttunut. Nykyään sovelluksia käytetään yhä enenevissä määrin myös mobiililaitteilla, joissa verkkoyhteyden luotettavuus on huomattavasti heikompi kuin työpöytäympäristössä. Verkkoyhteyden toiminta on ehdoton edellytys web- sovelluksen toiminnalle. Kun verkkoyhteyttä ei ole, sovellusta ei useimmiten voi käyttää. Tilanne on käyttäjän kannalta sama myös, jos verkkoyhteyden laatu on hyvin heikko. Tämä uusi käyttöympäristö asettaa web-sovelluksen saavutettavuudelle haasteen, johon sovelluskehittäjien tulisi pystyä vastaamaan uusien teknologioiden avulla ja mahdollisesti sovelluksen arkkitehtuuria muuttamalla. Johdantona aiheeseen kerrotaan mitä hyötyjä offline-tilan tukemisesta on. Selainpohjaiset sovellukset kilpailevat jossain määrin mobiilialustojen natiivisovellusten kanssa. Web-sovelluksia on verrattu natiivisovelluksiin niiltä osin miten ne toimivat offline-tilassa. Pohjustuksena offline-tilan mahdollistavien teknologioiden arvioinnille esitellään Web-sovelluksen arkkitehtuuri yleisellä tasolla. Tässä tutkielmassa on esitelty muutamia offline-tilan asettamia vaatimuksia sovellukselle. Sovelluksen on kyettävä tunnistamaan, onko laitteella internet-yhteyttä. Yhteyden tilan tarkastukseen esitellään muutama vaihtoehto. Käyttäjän luoma tieto on myös tallennettava paikallisesti. Kun käyttäjä luo uutta sisältöä, se pitää tallentaa väliaikaisesti tai pysyvästi selaimeen. Ainakin osa sovelluksessa käsiteltävästä tiedosta pitäisi olla koko ajan saatavilla, käyttäjän internet-yhteyden tilasta riippumatta. Tähän tarkoitukseen selaimissa on nykyään käytettävissä muutamia erityyppisiä tietovarastoja. Kun selain on online-tilassa, sovelluksen tarvitsemat resurssit on tallennettava offline-tilaa varten. Tähän tarkoitukseen on luotu kaksi eri teknologiaa, HTML5 Application cache ja Service worker. Niiden avulla voi toteuttaa selaimen sisäisen välipalvelimen, joka vastaa sovelluksen tekemiin verkkopyyntöihin. Tutkielmassa esitellään näiden teknologioiden toimintaa teknisten määrittelydokumenttien ja verkkoartikkelien pohjalta. Mainittuja teknologoita vertaillaan keskenään toiminnallisten vaatimusten pohjalta. Tutkimuksen perusteella voidaan päätellä, että esitellyillä teknologioilla voidaan toteuttaa offline-tuki web-sovellukseen. Service worker osoittautuu paremmaksi vaihtoehdoksi kuin Application cache toiminnallisuudeltaan.

Verkkosivujen grafiikkatyökalut

Tutkielman tarkoituksena on vertailla verkkosivujen grafiikkatyökaluja. Tutkielmassa käsitellään kahta 2D-grafiikkaan liittyvää web-tekniikkaa: SVG:tä ja HTML5:n canvas-elementtiä. Ensin esitellään molemmat teknologiat, sitten käydään läpi molempien käyttöä esimerkkien ja kuvien avulla. Työssä esitetään myös eri tapoja toteuttaa animaatioita. Lopuksi teknologioita ja niiden käyttömahdollisuuksia vertaillaan. Tutkielmassa pyritään vastaamaan seuraaviin kysymyksiin: Mitä ovat SVG ja HTML5:n canvas-elementti? Miten niitä käytetään? Miten ne eroavat toisistaan? Mihin käyttötarkoituksiin ne sopivat? SVG on skaalautuvan vektorigrafiikan formaatti kaksiulotteisen grafiikan esittämiseen. SVG perustuu vektoreihin ja se kuvataan XML-tyylisellä kielellä. SVG soveltuu tilanteisiin, joissa kuviota halutaan suurentaa ja pienentää laadun kärsimättä. HTML5:n uutuus canvas-elementti luo verkkosivulle piirtoalustan, johon voidaan piirtää JavaScriptillä Canvas API:n kautta. Canvas-alustalle piirretyt kuvat perustuvat bittikarttaan, joten teknologia soveltuu parhaiten pikseleiden tasolla tehtyihin operaatioihin ja esimerkiksi web-ohjelmien toteuttamiseen.

Design of Streaming Media Panoramic Video System Based on WebGL

2016 is the outbreak year of the virtual reality industry. In the field of virtual reality, 3D surveying plays an important role. Nowadays, 3D surveying technology has received increasing attention. This project aims to establish and optimize a WebGL three-dimensional broadcast platform combined with streaming media technology. It takes streaming media server and panoramic video broadcast in browser as the application background. Simultaneously, it discusses about the architecture from streaming media server to panoramic media player and analyzing relevant theory problem. This paper focuses on the debugging of streaming media platform, the structure of WebGL player environment, different types of ball model analysis, and the 3D mapping technology. The main work contains the following points: Initially, relay on Easy Darwin open source streaming media server, built a streaming service platform. It can realize the transmission from RTSP stream to streaming media server, and forwards HLS slice video to clients; Then, wrote a WebGL panoramic video player based on Three.js lib with JQuery browser playback controls. Set up a HTML5 panoramic video player; Next, analyzed the latitude and longitude sphere model which from Three.js library according to WebGL rendering method. Pointed out the drawbacks of this model and the breakthrough point of improvement; After that, on the basis of Schneider transform principle, established the Schneider sphere projection model, and converted the output OBJ file to JS file for media player reading. Finally implemented real time panoramic video high precision playing without plugin; At last, I summarized the whole project. Put forward the direction of future optimization and extensible market.