Uporaba HTML5 elementa Canvas za izradu multimedijskog tutorijala

undergraduate thesis

• Title (english): Usage of HTML5 element Canvas for creating multimedia tutorial
• Author: Josipa Horvatić
• Mentor: Tomislava Lauc (mentor)
• Committee member: Sanja Kišiček (predsjednik povjerenstva)
• Committee member: Sanja Seljan (član povjerenstva)
• Committee member: Tomislava Lauc (član povjerenstva)
• Granter: University of Zagreb; University of Zagreb, Faculty of Humanities and Social Sciences; (Department of information and Communication sciences); Zagreb
• Defense date and country: 2020-12-07, Croatia
• Scientific / art field, discipline and subdiscipline: SOCIAL SCIENCES; Information and Communication Sciences

Abstract

U ovom završnom radu uvodno je predstavljen povijesni razvoj HTML-a od njegovog nastanka do pojave HTML5 i canvas elementa. U prvom dijelu rada definirano je što je canvas element, te opisano kako se koristi JavaScript jezik za crtanje na canvas-u. Većina metoda i svojstva canvas-a opisana je kroz primjere koda i uz prikaze rezultata u web pregledniku. Prikazano je crtanje više tipova linija, likova i slika, kao i uporaba i stilizacija teksta. U drugom dijelu rada opisana je izrada multimedijskog tutorijala za Hangul, korejsku abecedu. Objašnjena je primjena metoda i svojstva za crtanje sadržaja te kako dijelove sadržaja napraviti interaktivnim i animiranim. Također, prikazana je uporaba bitnih značajki multimedijskog tutorijala poput slike i zvuka, te kviza. Cjelokupni sadržaj implementiran je pomoću jednog canvas elementa bez uporabe drugih HTML elementa.

Abstract (english)

The paper presented the historical development of HTML from its origin to the appearance of HTML5 and the canvas element. In the first part, the paper defined the canvas element and described the usage of JavaScript for drawing on canvas. Majority of methods and properties were shown through code examples and screenshots of the results in the web browser. The paper explained how to draw different lines, shapes, and pictures, as well as the usage and stylization of text. In the second part, it explained the making of the multimedia tutorial for Hangul, the Korean alphabet. The work demonstrated the implementation of methods and properties for content drawing and how to make the content interactive or animated. Also, the work showed the usage of the important features of the multimedia tutorial, such as image, sound, and quiz. The overall content is implemented on only one canvas element and without the usage of other HTML elements.

• Keywords: HTML5; canvas; tutorijal; multimedija; JavaScript; Hangul
• Keywords (english): HTML5; canvas; tutorial; multimedia; JavaScript; Hangul
• Language: croatian
• URN:NBN: urn:nbn:hr:131:160755
• Study programme: Title: Information Sciences; Study programme type: university; Study level: undergraduate; Academic / professional title: sveučilišni/a prvostupnik/prvostupnica (baccalaureus/baccalaurea) informacijskih znanosti (sveučilišni/a prvostupnik/prvostupnica (baccalaureus/baccalaurea) informacijskih znanosti)
• Type of resource: Text
• File origin: Born digital
• Access conditions: Access restricted to authenticated users
• Created on: 2020-12-14 17:04:44