View
4
Download
0
Category
Preview:
Citation preview
UNIVERZA V MARIBORU
FAKULTETA ZA ELEKTROTEHNIKO,
RAČUNALNIŠTVO IN INFORMATIKO
Blaž Udovč
RAZVOJ MOBILNE APLIKACIJE ZA UČENJE ABECEDE
Diplomsko delo
Maribor, september 2017
UNIVERZA V MARIBORU
FAKULTETA ZA ELEKTROTEHNIKO,
RAČUNALNIŠTVO IN INFORMATIKO
Blaž Udovč
RAZVOJ MOBILNE APLIKACIJE ZA UČENJE ABECEDE
Diplomsko delo
Maribor, september 2017
I
RAZVOJ MOBILNE APLIKACIJE ZA UČENJE ABECEDE
Diplomsko delo
Študent: Blaž Udovč
Študijski program: Visokošolski strokovni študijski program
Informatika in tehnologije komuniciranja
Smer: Sistemska podpora informatiki in tehnologijam komuniciranja
Mentor: doc. dr. Domen Verber
Somentor: /
Lektorica: Magda Kastelic Hočevar, prof. RP
II
Razvoj mobilne aplikacije za učenje abecede
Ključne besede: Android, aplikacija, mobilno učenje, abeceda
UDK: 621.397.7-026.26:003(043.2)
Povzetek
V tem diplomskem delu smo predstavili izobraževalne aplikacije in postopek razvoja
tovrstne aplikacije za mobilne naprave, in sicer za operacijski sistem Android ob uporabi
priljubljenih tehnologij in orodij kot so SQLite in razvojno okolje Android Studio. V prvem
delu so predstavljeni ideja za aplikacijo, teoretično ozadje ter podobni izdelki na tržišču.
Nato je na primeru prikazan proces razvoja tovrstne aplikacije. V zadnjem delu smo
predstavili ugotovitve in spoznanja ob delu in možnosti za nadaljevanje projekta. Rezultat
diplomskega dela je delujoča aplikacija za učenje abecede.
III
Development of mobile app for learning the alphabet
Key words: Android, Application, Mobile learning, Alphabet
UDK: 621.397.7-026.26:003(043.2)
Abstract
In this thesis we presented educational apps and the development of such application for
mobile devices, more specifically for operating system Android, using popular tools and
technologies like SQLite and Android Studio IDE. In the first part of the thesis we presented
the idea for aplication, theoretical background and few similar products on the current
market. Next part showcases the development process using our example. We concluded
the thesis with observations we made while working on the thesis and options for further
development. The result of this thesis is a functional application for learning the alphabet.
IV
KAZALO VSEBINE
1 Uvod ............................................................................................................................... 1
2 Teoretično področje ....................................................................................................... 2
2.1 Mobilno učenje in izobraževalne aplikacije ............................................................ 3
2.2 Primeri izobraževalnih aplikacij .............................................................................. 5
3 Analiza in načrtovanje .................................................................................................. 13
3.1 Perspektiva ............................................................................................................ 13
3.2 Uporabniki............................................................................................................. 13
3.3 Funkcionalnosti ..................................................................................................... 13
3.4 Načrtovanje ključnih funkcionalnosti ................................................................... 15
3.5 Načrtovanje podatkovnega modela ..................................................................... 17
3.6 Načrtovanje uporabniškega vmesnika .................................................................. 18
4 Implementacija ............................................................................................................. 23
4.1 Podatkovna baza ................................................................................................... 24
4.2 Multimedijske vsebine v aplikaciji ........................................................................ 26
4.3 Uporabniški vmesnik ............................................................................................. 27
4.4 Glavne funkcionalnosti ......................................................................................... 32
4.5 Testiranje .............................................................................................................. 37
5 Sklep ............................................................................................................................. 38
5.1 Možnosti za nadgradnjo in nadaljevanje projekta ............................................... 38
5.2 Zaključek ............................................................................................................... 40
Bibliografija .......................................................................................................................... 42
V
KAZALO SLIK
Slika 1: Duolingo vmesnik ................................................................................................................... 5
Slika 2: Duolingo vmesnik ................................................................................................................... 6
Slika 3: Duolingo – nadzorna plošča ................................................................................................... 6
Slika 4: Ježkove dogodivščine za otroke – vmesnik ............................................................................ 8
Slika 5: Varuh morij – vmesnik ........................................................................................................... 9
Slika 6: Uporabniški vmesnik aplikacije Abecedko ........................................................................... 10
Slika 7: Vodič za črke ........................................................................................................................ 11
Slika 8: Uporabniški vmesnik aplikacije Endless Aplhabet ............................................................... 11
Slika 9: Diagram primerov uporabe ................................................................................................. 16
Slika 10: Entitetno-relacijski model .................................................................................................. 18
Slika 11: Navigation Drawer ............................................................................................................. 20
Slika 12: Prototip domače strani aplikacije ..................................................................................... 21
Slika 13: Prototip vmesnika za kviz................................................................................................... 22
Slika 14: Primer ustvarjanja tabele ................................................................................................... 25
Slika 15: Reaper – zvočni posnetek .................................................................................................. 26
Slika 16: Projektna struktura – mape za vire .................................................................................... 27
Slika 17: Primer uporabniško definiranih značk ............................................................................... 27
Slika 18: Layout Editor ...................................................................................................................... 28
Slika 19: Preklop Fragmenta ............................................................................................................. 29
Slika 20: Component tree ................................................................................................................. 29
Slika 21: Viri ...................................................................................................................................... 30
Slika 22: XML – kazalec na vir ........................................................................................................... 30
Slika 23: Layout editor – kazalec na vir ............................................................................................ 31
Slika 24: Menjava vira ...................................................................................................................... 32
Slika 25: Uporabniški vmesnik funkcionalnosti kviz ......................................................................... 32
Slika 26: Kviz – Izberi prvo črko besede............................................................................................ 33
Slika 27: Igra Spomin ........................................................................................................................ 34
Slika 28: Spomin – logika .................................................................................................................. 35
Slika 29: Profil, Nastavitve, dialog za datum .................................................................................... 36
VI
SEZNAM UPORABLJENIH KRATIC
GUI – Grafični uporabniški vmesnik
IDE – Integrirano razvojno okolje
APK – Namestitveni paket za aplikacijo
SDK – Komplet orodij za razvijanje programske opreme
OS – Operacijski sistem
1
1 UVOD
S hitrim razvojem mobilnih tehnologij in mobilnih naprav so te postale del našega vsakdana.
Že skoraj vsak izmed nas ima vsaj eno izmed takih naprav zaradi njihove dostopnosti,
priročnosti in zmogljivosti, ki se kosa z osebnim računalnikom. Poleg osnovnih
funkcionalnosti, ki jih omogoča operacijski sistem mobilne naprave, lahko uporabniki
izbiramo med nešteto brezplačnimi ali plačljivimi namenskimi aplikacijami.
Prav zaradi dostopnosti in priljubljenosti mobilnih aplikacij med uporabniki mobilnih naprav
in želje po spoznavanju tehnologij za izdelavo tovrstnih aplikacij smo se odločili za razvoj
mobilne aplikacije za operacijski sistem Android, ki bi omogočila otrokom učenje abecede
na bolj sodoben način. Aplikacija bi vključevala nekaj preverjenih metod, ki jih starši in
učitelji uporabljajo že vrsto let. Cilj je bil združiti in prirediti nekaj izmed teh metod za
uporabo na mobilnih napravah, kar bi rešilo problem uporabe več različnih učnih
pripomočkov ter tako olajšalo staršem in otrokom učenje abecede.
V tem diplomskem delu smo raziskali področje izobraževalnih aplikacij in podrobneje
predstavili izobraževalne aplikacije, idejo za aplikacijo ter proces razvoja aplikacije in
predstavili nekaj tehnologij za razvoj aplikacij, ki smo jih uporabili. Predstavili smo tudi
ključne funkcionalnosti naše aplikacije, načrtovanje podatkovnega modela ter prototipa
uporabniškega vmesnika, implementacijo uporabniškega vmesnika, podatkovne baze ter
glavnih funkcionalnosti.
2
2 TEORETIČNO PODROČJE
Pismenost je sposobnost branja in pisanja in po terminologiji UNESC-a, zmožnost
razumevanja vsakdanjih sporočil. [1] Med prvimi koraki na poti k opismenjevanju je učenje
črk abecede ter števk. Otroci so neprestano izpostavljeni črkam in zato začnejo hitro kazati
zanimanje zanje. [2] Vsak dan opazujejo starše, starejše brate in sestre pri branju knjig,
časopisov in revij, kar v njih vzbudi radovednost. [3] Ko pride ta čas, je pomembno, da se
otroku ponudi za igro igrače in zabavne dejavnosti, ki mu pomagajo pri spoznavanju imena
črk, glasov in njihovega zaporedja. [2].
Že dolgo časa prav v ta namen obstajajo raznovrstni pripomočki, kot so na primer
sestavljanke, kocke, spominske igre, knjige, tombola s črkami, pesmice. Otrok tako vsako
črko posebej prime v roko, vidi sličico, ki predstavlja njen pomen, in črke sestavi v celoto –
abecedo. Prav tako je v teh primerih omogočeno staršem, da se vključijo v otrokovo učenje.
Ob igri mu ponavljajo glasove črk, ki jih otrok odkriva. Ob tem čuti veliko zadovoljstvo, saj
je lahko pri igri samostojen in ponosen na svoj končni izdelek. [2] Skrajno neprimerno bi
bilo, če bi otroka skušali na silo naučiti pisati in brati, zato vse dejavnosti potekajo v obliki
igre, zabavnega in koristnega druženja z otrokom. [3]
Živimo v modernem času oz. času sodobne tehnologije, ko ima vsako gospodinjstvo doma
na dosegu otrok več tehnologije, kot so jo včasih imele šole. Povprečna družina ima na voljo
doma računalnik, prenosnik, tablico ali pametni telefon – veliko celo vse našteto. S tem
raste tudi zanimanje za tehnološke naprave pri otrocih. To zanimanje lahko izkoristimo in
otroke usmerimo v aktivnosti za pridobivanje znanja, saj so zanj izredno dovzetni. Hitrost
učenja majhnih otrok je neverjetna in prav je, da jim starši v tem obdobju, ko kar vpijajo
znanje, dajo čim več dolgoročno uporabnega znanja z uporabo sodobne tehnologije. [4]
Učenje je z uporabo različnih sodobnih naprav lažje. Kombinacija naprave, glasbe slike ter
poučne vsebine vpliva na to, da otrok hitro osvoji nova znanja. [4]
3
2. 1 Mobilno učenje in izobraževalne aplikacije
Definicija mobilnega učenja se še razvija zato obstaja več možnih definicij. Pomembne
točke v definicijah so, da je to učenje, ki poteka na različnih lokacijah in izkorišča prednosti,
ki jih ponujajo prenosne mobilne tehnologije. Gre tudi za podporo oz. nadgradnjo za
klasičen način učenja, poučevanja in e-učenje. Vse skupaj se je začelo z razvojem mobilnih
tehnologij, ki ponujajo veliko funkcionalnosti in s tem spreminjajo učenje. [5]
Nekaj teh funkcionalnosti:
Prenosljivost – Mobilne naprave so lahko prenosljive, kar pomeni, da omogočijo
aktivnosti učenja izven tradicionalnega učnega okolja.
Povezljivost – Uporabniki z lahkoto dostopajo do najrazličnejših vsebin in se hkrati
povezujejo med sabo v danem omrežju
Interaktivnost – Prej je bilo mobilno učenje pojmovano kot izolirana aktivnost, zdaj
pa mobilne naprave, ki so socialne naprave, promovirajo povezovanje
uporabnikov.
Individualnost – Različne aktivnosti na mobilnih napravah so lahko prilagojene
glede na uporabnika. Tako lahko uporabnik sam na primer oblikuje, kako bo
uporabljal podan učni material.
Mobilno učenje se lahko izvaja s hrambo informacij, zvokom, slikami/ilustracijami,
animacijami, sodelovanjem z drugimi uporabniki, preko iger, z iskanjem informacij,
branjem, reševanjem kvizov, anketiranjem z uporabo mnogih aplikacij, ki jih ponujajo
mobilne naprave. Aplikacije lahko tako na nek način predstavljajo digitalne nahrbtnike
orodij, ki so jih prej okrog uporabniki nosili fizično. [5]
Otroci in mobilno učenje
Pogosto se poudarjajo negativni učinki digitalnih medijev na otroke. Osnovala se je ideja,
da bi morali otroke pred novimi tehnologijami zaščititi, vendar so se napredki v tehnologiji
dogajali vedno. Dejstvo je da se pred spremembami v tehnologiji ne moremo izolirati.
Pomembno je, da smo pri uporabi previdni. Aplikacije pri otrocih spodbujajo domišljijo,
veliko jih pomaga pri razvoju mišljenja in tudi v šolstvu se izkažejo kot uporaben
4
pripomoček. Ključna je vloga staršev oz. pedagoških delavcev, da preverijo aplikacijo in
ocenijo, ali je primerna za otroka. [6]
Aplikacija naj
pri otroku spodbuja razmišljanje, da se ob uporabi zgolj ne kratkočasi.
bo smiselna. Pri učenju abecede na primer je pomembno, da otrok ugotovi, da se
zvoki povezujejo s črkami in nam omogočajo sporazumevanje. Novo pridobljeno
znanje morajo videti v uporabi.
vključuje učenje s podporo socialne interakcije. Znano je, da so ljudje najboljši pri
učenju ljudi. Zato naj aplikacija spodbuja otroke, da se igrajo skupaj s starši in
ostalimi prijatelji. Tudi uporaba slavnih likov, kot so Miki miška in podobni,
pomagajo otrokom, da se počutijo povezani, kar izboljša proces učenja. [7]
Negativni učinki tehnologije
Ne smemo zanemariti negativnih učinkov uporabe tehnologije pri otrocih. Pri pretirani
uporabi tehnologije lahko pri otrocih opazimo slabši fizični, osebni in socialni razvoj, saj se
otroci manj gibljejo in družijo z drugimi ljudmi. Pretirana uporaba lahko vodi tudi v
odvisnost od tehnologije. Odvisni otroci se ob neuporabi naprav počutijo osamljene,
vznemirjene, razdražene in nesrečne. [8] Starši so odgovorni, da njihovi otroci s tehnologijo
ravnajo primerno in jo uporabljajo v namene, ki so zanje koristni.
5
2.2 Primeri izobraževalnih aplikacij
Duolingo
Duolingo je aplikacija za učenje jezikov, ki je primerna za otroke in odrasle. Uporabniki se
lahko v obliki mini kvizov in iger učijo več kot 12 različnih jezikov. Razvijalci aplikacije trdijo,
da uporabniki v 34-ih urah osvojijo enako znanje kot v enem semestru šole. Duolingo
uspešno implementira tehnike igrifikacije. Ko uporabnik napačno odgovori na vprašanje, ga
aplikacija v obliki vodiča vodi do pravilnega odgovora. Aplikacija v obliki točk dodatno
motivira uporabnike, da jo uporabljajo vsak dan. Pri nepravilnih odgovorih uporabniki
izgubljajo »življenja« ter se tako borijo, da »preživijo« vsak test, kar je vidno z Slike 1 desno
zgoraj. Če izgubijo vsa »življenja« morajo ponoviti reševanje naloge od začetka. [9]
Na Slikah 1 in 2 so zaslonske slike uporabniškega vmesnika aplikacije.
Slika 1: Duolingo vmesnik
6
Slika 2: Duolingo vmesnik
Aplikacija je primerna tudi za uporabo v šolah, saj vsebuje funkcionalnosti za pedagoške
delavce. Aplikacija se prilagaja vsakemu uporabniku posebej v obliki individualnih lekcij.
Učitelji lahko sledijo napredku vsakega izmed učencev preko posebne nadzorne plošče. Del
vmesnika nadzorne plošče je prikazan na Sliki 3. Tako lahko učitelji združujejo učence v
skupine in lažje identificirajo področja, ki učencem delajo težave ter se bolj osredotočijo
nanje tekom pouka. [9]
Slika 3: Duolingo – nadzorna plošča
7
Ježkove dogodivščine za otroke
Aplikacija razvijalca Iana Robertsona ponuja interaktivno zgodbo o ježku in njegovih
prijateljih v slovenskem jeziku. Aplikacija ob pripovedovanju zgodbe otroku predstavi veliko
izobraževalnih nalog in mini iger, ki so bile načrtovane ob pomoči otroškega psihologa. Med
igranjem si otrok razvija pozornost, delovni spomin, logično mišljenje in prostorsko
inteligenco. Primerna je za otroke v starostni skupini od 4 do 6 let.
Ko uporabnik zaključi zgodbo, so mu na voljo še dodatne mini igre, ki jih lahko rešuje v
različnih težavnostnih stopnjah:
Lahko – 4 leta (majhni otroci),
Normalno – 5 let (otroci, ki se pripravljajo na šolo),
Težko - 6 let (osnovna šola),
Zelo težko – težavnostna stopnja za nadarjene otroke.
Nekaj nalog, ki jih vsebuje, so iskanje razlik med slikami, sestavljanke, iskanje napak na
slikah, labirinti, razvrščanje števil v zaporedja, križanke s predmeti in geometrijskimi
oblikami, spomin. Primeri uporabniškega vmesnika teh nalog so vidni s Slike 4. [10]
8
Slika 4: Ježkove dogodivščine za otroke – vmesnik
Aplikacija po namestitvah spada v kategorijo nad 1 milijon namestitev. Na voljo je
brezplačna različica, v kateri se prikazujejo oglasi, in plačljiva različica brez teh. [10]
Varuh morij
Dvojezična mobilna aplikacija za zgodnje učenje jezikov otroke zbliža tudi z vsebino o
varovanju morij in morskih živali. Njen namen je s pomočjo pravljice ozaveščati otroke o
nevarnostih, ki ogrožajo morske sesalce, kako se jim lahko pomaga in zvišanje zavedanja o
pomenu varovanje narave. Aplikacija je trenutno na voljo le v slovenščini in angleščini, v
prihodnje načrtujejo prevesti vsebino tudi v druge svetovne jezike. Poleg izobraževanja
predšolskih otrok je aplikacija namenjena tudi otrokom prve triade osnovnih šol. Na Sliki 5
je nekaj zaslonskih slik aplikacije. [11]
9
Slika 5: Varuh morij – vmesnik
Avtorica projekta je doktorica okolijskih znanost Mojca Stubelj Ars, ki je del doktorata
opravljala na Havajih. Projekt je delno finančno podprlo tudi Ameriško veleposlaništvo v
Sloveniji v sklopu programa NGO Small Grants. Aplikacija je brezplačna in je trenutno na
voljo samo za operacijski sistem Android. [11]
10
Abecedko – slovenska abeceda
Abecedko je aplikacija ponudnika Funstrict. Na Google Play ima nekje med 5000 in 10.000
namestitev. Aplikacija omogoča otroku, da se na zabaven način nauči izgovorjave črk, števil
in besed, izpeljanih iz slovenske abecede. [12] Za učenje uporablja zvočne efekte, animacije
in otrokom prijazne sličice in lepo oblikovan uporabniški vmesnik. Del uporabniškega
vmesnika je viden na Sliki 6. Aplikacija ne podpira večjezičnosti, prilagoditve uporabniške
izkušnje. V celoti je brezplačna in ne vsebuje oglasov ali plačljivih vsebin. Kljub temu da
aplikacija vsebuje minimalno količino funkcionalnosti za tovrstno aplikacijo, prejema
podporo ter visoke ocene uporabnikov.
Prednosti: preprostost, enostavnost uporabe, aplikacija deluje brez nakupov dodatkov
Slabosti: razmeroma malo funkcionalnosti
Slika 6: Uporabniški vmesnik aplikacije Abecedko
Alphabet
Alphabet je aplikacija ponudnika GoKids! Spada v kategorijo aplikacij z prenosi med 1
milijon in 5 milijoni prenosov. Aplikacija sicer ne omogoča učenja slovenske abecede,
ampak ponuja učenje abecede v angleščini, španščini in ruščini. [13] Omogoča postopno
učenje abecede, saj uporabnik najprej spozna vsako črko posebej v obliki sličic, s katerimi
povezuje črko, nato s pisanjem črke. Znanje nato utrjuje v obliki zabavnih kvizov, ob katerih
zbira točke. Dodatna vsebina se odklepa postopoma. Ponujena je tudi možnost plačila za
takojšen dostop do nje. S plačilom se uporabniki znebijo oglasov v aplikaciji. Na Sliki 7 je
11
viden uporabniški vmesnik za učenje pisanja črk. Otrok s pomočjo te funkcionalnosti spozna
zaporedje potez, ki so potrebne za zapis posamezne črke. Za vsako pravilno napisano črko
uporabnik dobi bombonček, ki predstavlja točke.
Slika 7: Vodič za črke
Prednosti: vodič za učenje črk, večjezičnost.
Slabosti: včasih slaba prepoznava uporabniškega vnosa.
Endless Alphabet
Aplikacija ponudnika Originator Inc. preskoči postopno učenje angleške abecede in se kar
takoj spusti v učenje besedišča ter sestavljanja besed. Uporabnik ob uporabi čudovito
razvitega uporabniškega vmesnika (Slika 8), ki je poln animacij, spoznava črke in iz njih
sestavlja besede. Po uspešnem zaključku naloge aplikacija še razloži pomen besede.
Brezplačna različica aplikacije ponuja samo 7 brezplačnih besed, za polno različico morajo
uporabniki odšteti 9,99 €. [14]
Slika 8: Uporabniški vmesnik aplikacije Endless Aplhabet
12
Prednosti: učenje besedišča ob učenju črk, prijazen uporabniški vmesnik za mlajše
uporabnike.
Slabosti: aplikacija je brez nakupa dodatne vsebine oz. polne različice aplikacije skoraj
neuporabna.
To so samo trije primeri podobnih aplikacij na tržišču. Mislimo, da še vedno obstaja
možnost za konkurenčne izdelke s tega področja. Najbolj smo pri raziskovanju pogrešali
aplikacije, ki imajo funkcionalnosti za starše oz. pedagoške delavce, in izdelke, ki beležijo
natančno statistiko ob uporabi. Vsi predstavljeni izdelki so močno v prednosti pred našo
aplikacijo v smislu uporabniškega vmesnika, ki je bolj interaktiven, prijazen in prilagojen za
mlajše uporabnike, prvotne uporabnike tovrstnih aplikacij. Vsi so oblikovani na principu
otroških risank, ki so v tem starostnem obdobju priljubljena aktivnost pri uporabnikih.
13
3 ANALIZA IN NAČRTOVANJE
3.1 Perspektiva
Cilj razvoja aplikacije za učenje abecede je bil združenje preverjenih metod učenja abecede
za uporabo na mobilnih napravah. Ob uporabi zvoka, slik interaktivnega vmesnika bi bilo
učenje abecede lažje, hkrati bi rešili problem množice različnih učnih pripomočkov.
Uporabnikom bi omogočili pregled napredka, prilagojeno uporabniško izkušnjo in učenje
ob igri. Aplikacija bi bila primerna za uporabo tako doma kot tudi v šolah in vrtcih.
3.2 Uporabniki
Uporabniki aplikacije bi bili v prvi vrsti otroci, vendar bi bila aplikacija primerna za
uporabnike vseh starostnih skupin. Tako bi aplikacijo na mobilno napravo namestili starši
teh otrok oziroma pedagoški delavci za potrebe izobraževanja. Uporabniki znotraj aplikacije
bi se delili na goste in uporabnike oz. na registrirane in neregistrirane uporabnike. Ti bi
lahko glede na status dostopali do različnih funkcionalnosti aplikacije. Aplikacijo bi se lahko
nadgradilo še z dodatno skupino uporabnikov, npr. pedagoški delavci, ki bi imeli možnost
združevanja več uporabnikov v skupine in pregled nad njihovim napredkom. Tako bi
aplikacija lahko postala še bolj atraktivna za uporabo v vzgojno-izobraževalnih zavodih.
3.3Funkcionalnosti
Registracija/prijava
Registracija uporabniškega računa uporabniku omogoča prijavo v aplikacijo ter s tem izbiro
različnih metod učenja črk. Uporabniški račun služi za pregled nad podatki uporabnika ter
napredkom pri učenju ter na podlagi uporabnikovih nastavitev prilagodi delovanje
aplikacije.
14
Vodič za učenje črk
Vodič za učenje črk služi v aplikaciji, ki smo jo razvili, kot temelj, na katerem smo nato
razvijali druge funkcionalnosti. V tem delu aplikacije ima uporabnik pregled nad črkami
abecede in se z njimi spoznava.
Kvizi
Uporabnik z različnimi kvizi utrjuje znanje abecede. Uporabnik s pravilnimi odgovori zbira
točke. Točke so indikator števila pravilnih odgovorov pri uporabi aplikacije. Želja
uporabnikov je, da dosežejo čim več točk, kar pomeni čim več pravilnih odgovorov in s tem
znanje. Uporaba tega elementa igre lahko poveča zadovoljstvo uporabnikov aplikacije. Tej
tehniki načrtovanja se reče igrifikacija (gamefication).
Spomin
Otroci se najlažje učijo skozi igro, zato aplikacija ponuja igro spomin, pri kateri uporabnik
nehote utrjuje znanje. Z rešitvijo igre uporabnik pridobi točke.
Nastavitve
Uporabnik si lahko izbere, katere črke želi vaditi pri kvizu oziroma pri spominu. Tovrstna
funkcionalnost se nam je zdela pomembna, saj učenje poteka postopoma. Težje bi se bilo
naučiti, če bi se od začetka učili z vsemi črkami. Tako smo ponudili uporabnikom možnost,
da začnejo z manj črkami in jih nato postopoma dodajajo. Zaradi tega se uporabnik počuti
uspešnega pri reševanju nalog že od začetka, kar še zviša motivacijo za nadaljevanje
uporabe izdelka.
15
3.4 Načrtovanje ključnih funkcionalnosti
Diagram primerov uporabe
Za načrtovanje diagrama smo uporabili GenMyModel, ki je spletna platforma za
modeliranje poslovnih procesov in IT modeliranje. Uporaba osnovnih funkcionalnosti je
brezplačna, vendar je na voljo plačljiva nadgradnja. [15]
Diagrami primerov uporabe so pri načrtovanju uporabljeni za opis akcij oz. primerov
uporabe, ki jih sistemi lahko izvedejo. Te »aktivnosti« lahko sistem izvaja samostojno ali v
sodelovanju z uporabnikom sistema, ki jih poimenujemo akterji. Povezava med primerom
uporabe in akterjem je predstavljena s polno črto. Dva primera uporabe sta lahko med sabo
povezana s povezavo extend oz. razširi ali include oz. vključi. [16]
Z uporabo nekaj preprostih pravil smo izdelali diagram primerov uporabe za našo aplikacijo.
Najprej smo identificirali obe vrsti uporabnikov (Gost, Uporabnik) in vse pomembne
funkcionalnosti, ki jih lahko uporabljata. Kot vidimo na Sliki 9 lahko Gost v aplikaciji
uporablja samo »Učenje črk«. Za uporabo ostalih funkcionalnosti aplikacije se mora prijaviti
oz. registrirati. Zanimiva je povezava med Uporabnikom in Gostom s Slike 9. Ta povezava
se imenuje generalizacija/generalization, pomeni pa, da »Uporabnik« lahko poleg tega, da
uporablja vse primere, s katerimi je povezan, dostopa tudi do primerov uporabe »Gosta«.
Ta povezava deluje v eno smer. Vsi primeri uporabe so obdani z okvirjem, kar predstavlja
zaključen sistem.
16
Slika 9: Diagram primerov uporabe
Najpomembnejše oz. ključne funkcionalnosti so reševanje kviza, igra Spomin ter učenje črk,
saj z njimi uporabnik doseže željene rezultate. Odločili smo se, da zaenkrat razvijemo dve
različici kviza, ki sta najpomembnejši. V prvi različici se uporabniku predvaja glas, nato mora
izmed treh možnih odgovorov izbrati črko oz. znak za glas, ki jo je slišal. V drugi različici
uporabnik ob poslušanju besede ter s pomočjo slike ugotavlja črko, s katero se beseda
začne. Pri obeh ima uporabnik možnost izbrati nabor črk za vprašanja. Tudi pri drugi različici
uporabnik izbira med tremi možnimi odgovori. Za reševanje kvizov mora imeti uporabnik
izbrane najmanj tri črke.
17
V razdelku za učenje črk ima uporabnik omogočen pregled nad vsemi črkami abecede. Tu
si lahko uporabnik izbere posamezno črko, si predvaja njen glas ter si ogleda sličico, s katero
lahko poveže posamezno črko.
Pri igri Spomin poizkuša uporabnik z odkrivanjem sličic najti par enakih. Za sličice pri igri
smo tokrat izbrali črke. Ob vsakem poizkusu se uporabniku predvaja glas črke, ki jo odkrije.
Tako se uporabniku podzavestno ustvarjajo povezave med črko in zvokom črke. Tako lahko
ob rednem ponavljanju igre hitro in brez napora osvoji črke abecede.
3.5 Načrtovanje podatkovnega modela
Modeliranje podatkov je oblikovanje modela podatkov. Model podatkov je abstraktna,
vendar lahko razumljiva predstavitev potrebnih podatkov celotne organizacije oziroma
njenega dela, kar pomeni predstavitev same organizacije oz. njenega dela z vidika
potrebnih podatkov. [17]
Zbiranje in analiza zahtev
Pri načrtovanju podatkovnega modela smo se morali najprej vprašati, kakšne podatke je za
delovanje aplikacije potrebno hraniti. Ugotovili smo, da moramo hraniti podatke o
uporabnikih aplikacije ter o vsebini. Za uporabnike smo se odločili, da shranjujemo podatke
o njihovih uporabniških imenih, geslih, osebnih podatkih (imena, priimki, datumi rojstva),
njihovimi točkami, ki jih pridobijo z reševanjem kvizov, ter igro Spomin. Med te podatke
smo vključili tudi podatke o nastavitvah v aplikaciji. Za vsebino aplikacije moramo hraniti
podatke o črkah in besedah. Vsaka izmed njih mora vsebovati vrednost, pot do slikovne ali
zvočne datoteke, ki črko oz. besedo predstavljata.
Podatki o črkah in besedah so povezani, saj lahko črka deluje samostojno ali predstavlja
prvo črko besede. Podatki o črkah in besedah so statični, kar pomeni, da se redko
spreminjajo, medtem ko se podatki o uporabnikih spreminjajo pogosto. Tudi sam
uporabnik mora imeti možnost, da posodobi svoje osebne podatke. Poleg urejanja
podatkov smo morali načrtovati, da uporabnik spreminja osebne nastavitve in redno
preverja napredek v številu točk.
18
Konceptualno načrtovanje
Konceptualno načrtovanje je faza, pri kateri se izdela konceptualni načrt, ki zajema tudi
omejitve, ki se nanašajo na podatke. Za predstavitev konceptualnega načrta smo za naš
projekt uporabili entitetno-relacijski diagram.
Slika 10: Entitetno-relacijski model
Na Sliki 10 je prikazan E-R model, ki smo ga ustvarili iz zahtev, pridobljenih z analizo.
Aplikacija za svoje osnovno delovanje pravzaprav ne potrebuje veliko podatkov. V primeru
nadaljevanja oz. nadgradnje projekta bi bilo potrebno bolje zastaviti podatkovni model. Na
primer razširjeno statistiko, ki bi vključevala točke ter nastavitve, bi lahko ločili v lastni
entiteti.
3.6 Načrtovanje uporabniškega vmesnika
Uporabniški vmesnik
Uporabniški vmesnik predstavlja vmesnik med uporabnikom in napravo oz. programsko
opremo. Na kratko: Uporabniški vmesnik je vse, kar uporabnik vidi in lahko uporabi pri delu
z aplikacijo. Grafični uporabniški vmesniki na zaslonu naprave prikazujejo elemente, kot so
ikone, okna, gumbe in druge pripomočke.
Smernice za razvoj uporabniških vmesnikov za Android
Android ekipa za uporabniško izkušnjo skrbi in razvija smernice za razvoj uporabniških
vmesnikov za sistem Android. Te smernice so namenjene oblikovalcem in vsebujejo
19
enostavne napotke, kako lahko oblikovalci čim bolj izboljšajo uporabniško izkušnjo za
uporabnike aplikacij.
Nekaj primerov:
Razvijalci pustijo uporabnikom, da premikajo in manipulirajo z objekti zaradi
lastnega zadovoljstva.
Razvijalci omogočijo prilagoditev uporabniškega vmesnika v smislu zaporedja
elementov, barv.
Uporaba slik namesto besed.
Skrivanje elementov vmesnika, ki jih uporabnik ne potrebuje pri določeni nalogi.
Hiter dostop do funkcionalnosti, ki so bolj pomembne v aplikaciji.
Uporabnik vedno ve, kje v aplikaciji se nahaja (Navigacija).
Uporabniška izkušnja za otroke
Uporabniki aplikacij za učenje abecede so v veliki meri otroci. Ustvarjanje lepe grafike in
animacij je izredno pomembno. Prav tako je uporaba navigacije, ki je dovolj preprosta, da
jo otrok uporablja sam. Pomembno je, da uporabniškega vmesnika ne nasičimo z elementi,
ki direktno ne vplivajo na potek izobraževalnih aktivnosti, saj otroci običajno klikajo povsod
po zaslonu. Pametno je, da se pri tovrstnih aplikacijah razvije elemente, ki so namenjeni
izključno odraslim uporabnikom z uporabo specialnih gest, kot so dvoklik, ščipanje, ki jih
otroci še ne razumejo.
Izdelava prototipa uporabniškega vmesnika
S smernicami za razvoj GUI smo tako izdelali prototip uporabniškega vmesnika. Za
navigacijo v aplikaciji smo se odločili uporabiti Navigation Drawer (Navigacijski predal). Gre
za navigacijski element v obliki menija, ki je dostopen uporabnikom kadarkoli, pri delu z
aplikacijo pa je skrit. Primer takega menija v Android aplikaciji vidimo na Sliki 11.
20
Slika 11: Navigation Drawer
Uporabili smo hierarhično navigacijsko strukturo, kar pomeni, da so strani organizirane kot
drevesne strukture. Do vsake strani lahko dostopamo preko menija, vendar imajo nekatere
strani med sabo povezave v obliki starš – otrok. Na primer z domače strani (Slika 12) lahko
s klikom na gumb »Reši kviz« dostopamo do strani za izbiro različice kviza. Obstajajo še
strukture vsak-z-vsakim (peer-to-peer), kjer je vsaka stran povezana z vsako v obliki na
primer zavihkov ali kombinacije obeh struktur.
21
Slika 12: Prototip domače strani aplikacije
Nato smo oblikovali še izgled preostalih strani aplikacije. Uporabljali smo elemente
grafičnih vmesnikov, kot so gumbi, tekst, vnosna polja, slike, ikone itd. Na Sliki 13 je viden
prototip vmesnika za kviz, in sicer različico, kjer uporabnik ugotavlja prvo črko besede. Na
vrhu imamo podatke o statusu trenutnega reševanja kviza s številko vprašanja in številom
doseženih točk. Nato sledi sličica, ki predstavlja besedo, gumb za predvajanje zvočne
datoteke in gumbe za podajanje odgovora. Že v fazi načrtovanja vmesnika smo obarvali
gumbe s pravilnim in nepravilnimi odgovori, kar je pomemben del funkcionalnosti, saj mora
uporabnik hitro identificirati pravilnost podanega odgovora. Ob strani vidimo možnosti za
navigacijo.
22
Slika 13: Prototip vmesnika za kviz
Pri implementaciji uporabniškega vmesnika se nismo striktno držali prototipa, saj smo med
izdelavo dobivali nove ideje za obliko, barve, postavitve elementov itd.
Za izdelavo prototipa uporabniškega vmesnika smo uporabili spletno aplikacijo Moqups, ki
omogoča oblikovanje, načrtovanje, izdelavo prototipov ter njihovo testiranje. Med
uporabnike tega orodja spadajo tudi večja podjetja kot so Mozilla, Intel, Microsoft, Amazon.
Brezplačna različica je primerna za zelo majhne projekte, saj se kmalu pokaže potreba po
nakupu razširjene različice. Prototip uporabniškega vmesnika bi lahko izdelali tudi ročno na
papir, vendar uporaba tovrstnega orodja zmanjša čas načrtovanja, omogoča možnost
sprememb, testiranja ter ponuja boljšo vizualizacijo posameznih vmesnikov.
23
4 IMPLEMENTACIJA
Razvoj mobilnih aplikacij hitro postaja prihodnost razvoja programskih rešitev, saj mobilne
naprave postajajo vse večji del našega življenja. Dandanes obstaja že nešteto ogrodij,
orodij, platform za razvoj mobilnih aplikacij. Razvoj tovrstnih rešitev omogoča unikatno
priložnost, da tudi en sam programer razvije dejansko uporabno aplikacijo v zelo hitrem
času. Na razvoj mobilnih aplikacij ljudje pogosto gledajo kot na razvoj programske opreme
za mobilne telefone, a temu ni tako. Mobilne aplikacije lahko delujejo tudi na drugih
prenosnih napravah, ki uporabljajo operacijski sistem, kot so na primer tablice, ure,
navigacijske naprave. Razvijalci so postavljeni pred problem velike količine naprav z
različnimi specifikacijami, velikostmi ter operacijskimi sistemi. Največji problem
predstavljajo različni operacijski sistemi.
Mobilni operacijski sistemi so posebej oblikovani za uporabo na mobilnih napravah. Ti
sistemi so drugačni od klasičnih operacijskih sistemov za osebne računalnike zaradi
omejenih virov, ki jih imajo mobilne naprave, kot so velikost zaslona, pomnilnik,
procesorska moč in omejena količina energije. Omejena je tudi interakcija z uporabnikom,
saj večino današnjih mobilnih naprav uporablja zaslone na dotik za razliko od osebnih
računalnikov, ki uporabljajo miško in tipkovnico.
Danes na trgu mobilnih naprav prevladujeta dva operacijska sistema, in sicer Android in
iOS. Android vsebujejo naprave proizvajalcev kot so Samsung, HTC, Huawei. iOS deluje na
napravah proizvajalca Apple.
Razvijali smo aplikacijo za Android, ki je odprtokodni operacijski sistem za mobilne naprave.
Sistem baziran na Linux-ovem jedru razvija podjetje Google, zasnovan je predvsem za
uporabo na napravah z zaslonom na dotik, vendar Google razširja sistem tudi za uporabo
na televizijah (Android TV), v avtomobilih (Android Auto) ter pametnih urah (Android
Wear). Različice sistema se uporabljajo tudi za igralne konzole, digitalne kamere,
računalnike itd. Android je najbolj prodajan operacijski sistem na tabličnih računalnikih od
leta 2013, prav tako je nameščen na veliki večini pametnih telefonov. [18] Ravno zaradi
tega dejstva smo se odločili za razvoj aplikacije prav za ta sistem.
24
Android namenske aplikacije, ki razširjajo osnovne funkcionalnosti sistema, so najpogosteje
razvite v programskem jeziku Java z uporabo Android SDK. [18] SDK ali komplet
programskih orodij za razvijanje programske opreme je zbirka orodij, ki programerjem
olajša pisanje aplikacij za posamezno napravo, operacijski sistem ali uporabniški vmesnik,
v tem primeru za sistem Android. [19] Razvijalci lahko svoje aplikacije nato objavijo v
»Google Play« digitalni trgovini, kjer lahko uporabniki izbirajo med več kot 2,7 milijona
plačljivih ali brezplačnih aplikacij. [20] Aplikacijo se namesti na napravo z uporabo
namestitvenega paketa – APK (Android Application Package).
Aplikacijo smo implementirali v Android Studiu, ki je uradno integrirano razvojno okolje
(IDE) za razvoj Android aplikacij, ki je bazirajo na IntelliJ IDEA. Poleg funkcionalnosti, ki jih
ponuja IntelliJ IDEA, ponuja še mnogo funkcionalnosti, ki omogočajo enostaven in hiter
razvoj aplikacij, kot so na primer emulator za vse Android naprave, integracija z GitHubom,
orodja za testiranje, podporo za uporabo Googlovih oblačnih storitev ter še mnogo drugih.
[21]
4.1 Podatkovna baza
Podatkovna bazo smo implementirali s pomočjo SQLite programsko knjižnico, ki zagotavlja
SUPB za relacijske podatkovne baze. Običajno tovrstni sistemi delujejo na principu
odjemalec-strežnik vendar to za SQLite ne drži. Za razliko od drugih sistemov SQLite bere
in zapisuje podatke v datoteke na disku naprave, kjer je aplikacija nameščena. Tako je
celotna SQL podatkovna baza, vključno z vsemi tabelami, indeksi, pogledi,
prožilci,vsebovana v eni datoteki, ki je neodvisna od operacijskega sistema. [22]
Vsi API-ji, ki smo jih potrebovali, da smo začeli z implementacijo podatkovne baze, se
nahajajo v programskem paketu android.database.sqlite.
Definiranje sheme podatkovne baze
Eden izmed glavnih principov SQL podatkovnih baz je shema. Shema je deklaracija, kako je
podatkovna baza urejena in je razvidna iz SQL ukazov, s katerimi jo ustvarimo. [23] Ustvarili
smo tabele, ki bodo shranjevale podatke, potrbne za delovanje aplikacije. Android vsebuje
funkcionalnost za upravljanje podatkovnih baz SQLite v razredu SQLiteOpenHelper. Ta
25
razred olajša ustvarjanje in posodabljanje podatkovne baze. Pri implementaciji podatkovne
baze smo razvili razred, ki deduje od tega razreda.
Database helper – pomožni razred za upravljane s podatkovno bazo
Razred mora vsebovati najmanj naslednje 3 metode:
konstruktor, ki kot parameter prejme kontekst (Aktivnost), ime podatkovne baze in
število, ki predstavlja verzijo sheme podatkovne baze;
onCreate(), ki kot parameter prejme SQLite podatkovno bazo in se proži, ko
aplikacija potrebuje podatkovno bazo in ugotovi, da baza ne obstaja;v tej metodi
smo ustvarili in napolnili tabele, ki smo jih potrebovali; na Sliki 14 vidimo izsek iz
kode, ki prikazuje ustvarjanje tabele »Uporabnik« za našo aplikacijo;
Slika 14: Primer ustvarjanja tabele
onUpgrade() sprejme kot parametere podatkovno bazo, staro verzijo sheme ter
novo verzijo sheme; proži se, ko verziji nista enaki.
Razred poleg teh osnovnih metod vsebuje tudi uporabniško definirane metode, ki se
uporabljajo za izvajanje operacij nad podatki v bazi. V primeru naše aplikacije smo
implementirali samo metode, ki smo jih za izvajanje trenutnih funkcionalnosti aplikacije
potrebovali. Uporabljali smo jih za izvedbo osnovnih oz. CRUD(create, read, update, delete)
operacij, ki ustvarjajo, berejo, posodabljajo in brišejo podatke. Primeri takih metod so na
primer dodajanje novega uporabnika, branje podatkov o uporabniku, posodabljanje
nastavitev, posodabljanje števila točk. Primerek takega razreda smo ustvarili in uporabljali
v željeni aktivnosti Android aplikacije.
26
4.2Multimedijske vsebine v aplikaciji
Vse zvočne vsebine v aplikaciji smo posneli kar z uporabo aplikacije Snemalnik na naši
mobilni napravi. V en posnetek smo združili izgovorjavo vseh črk abecede, v drugega pa
vseh besed, ki smo jih v aplikaciji potrebovali. Nato smo izgovorjavo vsake črke in
besede razdelili v več različnih datotek, jih ustrezno poimenovali in obdelali s
programom Reaper. Na Sliki 15 vidimo primer izrezanega zvočnega posnetka za črko C.
Slika 15: Reaper – zvočni posnetek
Slikovne datoteke za črke smo izdelali s programom Inkscape, za besede smo optično
prebrali sličice iz stavnice. Stavnica je otroški didaktični pripomoček za prvi razred
osnovnih šol. Otroci s pomočjo teh sličic in pripadajočih črk sestavljajo besede. Tudi te
datoteke smo ustrezno poimenovali.
Zvočne datoteke in slike smo ustrezno poimenovane nato dodali v Android projekt v
mapo res/raw na Sliki 16.
27
Slika 16: Projektna struktura – mape za vire
4.3 Uporabniški vmesnik
XML ali razširljivi označevalni jezik (eXtensible Markup Language) je preprost računalniški
jezik, ki je podoben HTML-ju, ki omogoča format za opisovanje strukturiranih podatkov.
Glavna razlika med HTML in XML je da si uporabniki lahko določijo svoja imena značk, kar
je razvidno iz slike 17 na kateri je primer sintakse XML. Uporablja se tudi kot format za
prenos podatkov in komunikacijo med dvema napravama ali aplikacijama.
Slika 17: Primer uporabniško definiranih značk
Uporabniški vmesnik v Android aplikacijah je definiran v obliki XML datotek za vsak zaslon
posebej. Postavitev elementov lahko definiramo direktno v teh datotekah v obliki urejanja
XML dokumentov in ob uporabi vgrajenega oblikovalca vmesnikov ali pa jih definiramo
tekom delovanja aplikacije z uporabo programske kode. Prednost definiranja vmesnika v
XML je, da ločimo izgled, elemente aplikacije in kodo, ki kontrolira njeno delovanje. V kodi
se na objekte vmesnika sklicujemo z uporabo enoličnih identifikatorjev za vsak objekt.
28
Android Studio Layout Editor
Android studio vsebuje orodje Layout Editor, s katerim lahko hitro razvijamo uporabniške
vmesnike. Namesto da sami pišemo XML definicije za posamezne elemente, jih lahko kar
na način Drag&Drop (povleci in spusti) prenesemo na delovno površino, ki predstavlja naš
uporabniški vmesnik. Orodje vsebuje paleto možnih elementov uporabniškega vmesnika,
ki jih po želji dodajamo, okno za lastnosti teh elementov, predogled vmesnika oz. delovno
površino ter okno s strukturo elementov za posamezni pogled. Med razvojem lahko prosto
preklapljamo med standardnim načinom razvoja in razvojem z Layout Editorjem. Pri razvoju
vmesnika za aplikacijo smo uporabljali oba načina oblikovanja vmesnika. Elemente smo
najprej iz palete dodali na delovno površino v Layout Editor-ju, nato smo njihove lastnosti
urejali preko XML atributov ter seznama lastnosti.
Slika 18: Layout Editor
Na Sliki 18 vidimo uporabniški vmesnik Layout Editorja ter del uporabniškega vmesnika iz
naše aplikacije, in sicer gre za pregled črk.
29
Deli uporabniškega vmesnika so definirani v večih različnih delih oz. pogledih, imenovanih
fragmenti, ki so med seboj neodvisni. Uporabnik pri navigaciji menjuje med različnimi
fragmenti vmesnika, ki mu omogočajo izvajanje željenih nalog.
Poleg osnovnih pogledov smo z uporabo fragmentov implementirali tudi delovanje
dialogov v aplikaciji. Dialoge smo nato prikazovali z uporabo razreda FragmentTransaction.
Na Sliki 19 je izsek kode, v katerem je prikazano ustvarjanje ter prikaz fragmenta
»NastavitveCrke«, ki predstavlja dialog za nastavitev črk. Tovrsten dialog smo uporabili, če
uporabnik ni imel izbranih dovolj črk za reševanje kviza ali igranje Spomina.
Slika 19: Preklop fragmenta
Uporabniški vmesnik – učenje črk
Uporabnik pri učenju črk klikne na gumb z željeno črko. Ob kliku se mu predvaja glas te
črke. Prav tako se zamenjata sliki, ki predstavljata znak črke ter besedo, ki črko predstavlja.
Uporabnik si nato lahko izbere novo črko ali si glas črke in zvočno datoteko za izgovorjavo
besede predvaja ponovno.
Uporabniški vmesnik za učenje ter pregled črk vsebuje naslednje elemente vidne na Sliki
20.
Slika 20: Component tree
30
Vsi elementi se nahajajo znotraj osnovnega LinearLayout elementa, nevidnega elementa,
ki skrbi samo za ustrezno postavitev vsebovanih elementov. Najprej smo dodali nov
horizontalni LinearLayout, v katerega smo postavili 2 ImageView-a, ki sta elementa za
prikaz slik. Pod njima smo dodali ImageButton – gumb. Za njegovo predstavitev smo
uporabili ikono za zvok iz Googlovih ikon za Material Design. Pod njim smo dodali gumbe
za vsako črko posebej. Te smo združili v GridLayout zaradi enostavnejšega oblikovanja
postavitve. ImageView-a in ImageButton uporabljata slike, ki se nahajajo v mapi za vire
aplikacije – Slika 21. Ikone smo shranili v mapo »drawable«, saj predstavljajo vektorske
slike, ki jih je možno modificirati. Vse ostale slike in zvočne datoteke smo shranili v mapo
»raw«. Vsakemu viru Android studio določi ID.
Slika 21: Viri
Elementom vmesnika smo nato dodelili vir, ki jim pripada z vrstico obarvane XML kode s
Slike 22. Ta atribut elementa ImageView pove elementu, kateri vir naj prikazuje. Ta atribut
bi lahko nastavili tudi z uporabo grafičnega vmesnika v Layout Editorju – Slika 23.
Slika 22: XML - Kazalec na vir
31
Slika 23: Layout editor – kazalec na vir
Vsak element grafičnega vmesnika dobi svoj enolični identifikator. Tako se lahko na vsak
element sklicujemo v programski kodi ter ga po potrebi spreminjamo tekom delovanja
aplikacije ter obravnavamo dogodke interakcije uporabnika s posameznim elementom.
ImageView-u, ki prikazuje besedo za asociacijo na črko, smo tako dodelili id »iwBeseda«
kar je vidno s Slike 22.
Definicija delovanja posameznih elementov je, kot smo že prej omenili, ločeno od njihovega
izgleda v datoteki, ki je povezana s tem pogledom. Te datoteke so napisane v programskem
jeziku Java.
Java
Java je objektno orientiran programski jezik. Ustvarjen je bil z namenom, da bi imel čim
manj odvisnosti od platforme, na kateri se izvaja. Prevedeno Java programsko kodo lahko
tako zaženemo na vseh platformah, ki podpirajo Javo ne glede na arhitekturo sistemov.
Java je tudi eden izmed najpopularnejših programskih jezikov.
Programiranje dogodkov
Vsakemu elementu vmesnika lahko določimo akcije, ki jih izvedejo med uporabniško
interakcijo z njimi. V našem primeru smo dodali ter uporabili metodo, ki se odzove na
uporabnikov klik na gumb.
Vsem gumbom smo določili isto metodo, ki najprej ugotovi, kateri gumb je bil pritisnjen. Če
je gumb s seznama črk, potem se zamenjajo kazalci na vire, ki pripadajo izbrani črki. To so
32
kazalci na slike za znak črke ter sliko, ki predstavlja besede ter zvočne datoteke. Prav tako
se izbrani gumb obarva z drugačno barvo kot ostali. Uporabnik to takoj opazi kot
spremembo vsebine elementov ImageView. Vkolikor je izbrani gumb za predvajanje
zvočnih datotek, se le-te predvajajo ponovno.
Za menjavo vira elementa najprej pridobimo njegov ID z uporabo metode, ki kot parameter
prejme ime vira ter njegovo lokacijo v projektni strukturi, nato priredimo željenemu
elementu, kot je vidno iz izseka kode na Sliki 24.
Slika 24: Menjava vira
4.4 Glavne funkcionalnosti
Kviz: Izberi pravilno črko
Slika 25: Uporabniški vmesnik funkcionalnosti kviz
33
Na Sliki 25 je prikazan uporabniški vmesnik funkcionalnosti kviz. Na vrhu zaslona se nahaja
orodna vrstica oz. toolbar, ki vsebuje ime aktivnosti, izvajane v danem trenutku, in gumb
za odpiranje predala z navigacijo. Pod njim se nahaja element, ki grafično prikazuje, na
katerem vprašanju pri kvizu se nahajamo. Na sredini zaslona je gumb za predvajanje
zvočnega posnetka, pod njim gumbi za podajanje odgovora.
Skrajno levo vidimo primer, ko je uporabnik odgovoril napačno, na sredini pa primer, ko je
podal pravilni odgovor. Uporabnik mora hitro identificirati pravilnost svojega odgovora,
zato smo uporabili barve ter različna zvoka ob pravilnem in nepravilnem odgovoru. Skrajno
levo (na Sliki 25) je prikazan dialog, ki se uporabniku prikaže ob končanem kvizu.
Za reševanje kviza mora imeti uporabnik izbrane najmanj 3 črke. Vkolikor temu pogoju ni
zadoščeno, se mu pokaže dialog, prikazan na Sliki 26, skrajno levo. Uporabnik mora za
nadaljevanje izbrati najmanj 3 črke ter potrditi izbiro.
Slika 26: Kviz – Izberi prvo črko besede
34
Kviz – Izberi prvo črko besede
Na Sliki 26 (desno) vidimo, da se uporabniški vmesnik za drugo različico kviza ne razlikuje
veliko od prve. Dodana je le slika, ki se nanaša na besedo. Tudi v tej različici se uporabniku
predvaja zvočna datoteka s pravilno izgovorjavo besede.
Igra Spomin
Kartice pri igri spomin so implementirane kot gumbi. Ko uporabnik klikne kartico, se le-ta
»obrne«. Pravzaprav se samo zamenja ozadje gumba. Logika igre je implementirana enako
kot pri klasični igri. Uporabnik obrača kartice in išče pare. Vkolikor 2 izbiri nista enaki, se
kartice ponovno obrnejo, v nasprotnem primeru se odstranijo z igralne površine in
uporabnik nadaljuje z igro. Igra se konča, ko najde vse pare. Za igro Spomin mora imeti
uporabnik izbranih najmanj 8 črk. Vmesnik igre lahko vidimo na Sliki 27.
Slika 27: Igra Spomin
Edina razlika med klasično igro in našo implementacijo je ta, da se uporabniku pri
odkrivanju kartice predvaja glas odkrite črke. Tako uporabnik nezavedno ustvarja povezavo
med znakom črke ter njej pripadajočim glasom. Igra je narejena brez časovne omejitve, da
ni pritiska na uporabnika. Nevarnost uporabe te funkcionalnosti je, da lahko uporabniki
pridejo do rešitve tudi z brezglavim klikanjem po zaslonu, zato bi bilo potrebno dodati še
35
eno preverjanje, na primer, da otrok potrdi ujemanje dveh črk. Tu se ponudi še ena
možnost, da otrok ponovno sliši ter vidi oba znaka za črki.
Razred SpominButton
Kot že rečeno, smo za implementacijo kartic igre Spomin razširili element oz. razred gumb.
Ta razširjeni razred vsebuje podatke o poziciji kartice na igralni površini v obliki koordinat,
kazalce na sliki v virih, ki predstavljata obe strani kartice ter kazalec na zvočno datoteko, ki
se predvaja, ko uporabnik med igro obrne določeno kartico. Prav tako smo v razredu dodali
metodo, ki »obrne sličico« oziroma spremeni sliko ozadja našega gumba/kartice.
Implementacija igre spomin
Fragment igre Spomin pripravi igralno površino za začetek igre. Najprej aplikacija iz
podatkovne baze pridobi uporabniške nastavitve črk. Nato izmed njih naključno izbere 8
črk. Na podlagi teh črk nato ustvari 16 igralnih ploščic, ki jih premeša in razporedi na igralno
površino (element GridView 4x4). Logika igre je implementirana v metodi, ki se proži, ko
uporabnik klikne na gumb oz. kartico. Najprej počaka, da sta obrnjeni dve kartici, nato
preverja, ali imata gumba za ozadje nastavljen isti vir – kar pomeni, da sta enaki. Na Sliki 28
je predstavljen izsek kode, ki predstavlja, kaj se zgodi, če sta sličici enaki. Predvaja se zvok,
ki uporabniku pove, da je našel par, nato obema gumboma onemogočimo možnost, da sta
ponovno aktivirana. Kartici »odstranimo« z igralne površine tako, da jima določimo oz.
nastavimo parameter vidljivosti na »INVISIBLE«.
Slika 28: Spomin – logika
36
Na koncu še povečamo število točk pri igri. Ko je doseženo maksimalno število točk, se igra
zaključi.
Predvajanje zvočnih vsebin
Predvajanje zvoka smo implementirali z uporabo MediaPlayer razreda, ki ga implementira
android.media.MediaPlayer. Ta razred se uporablja za upravljanje z avdio/video vsebinami.
Profil in nastavitve
Na Sliki 29 lahko vidimo uporabniški vmesnik za primere uporabe »poglej profil« ter
nastavitve. Uporabnik ima na profilu izpisane svoje osebne podatke, trenutne nastavitve za
igre ter prikaz skupnega števila točk, ki jih je ob dosedanji uporabi pridobil.
Slika 29: Profil, Nastavitve, dialog za datum
V nastavitvah smo za izbiro črk uporabili kar checkbox-e. Zdelo se nam je, da to predstavlja
najlažji način izbire. Da uporabniku ni treba označiti vseh polj posebej, je na voljo gumb, ki
označi oz. pobriše vse izbire naenkrat. Za urejanje datuma pri nastavitvah osebnih podatkov
smo uporabili DatePickerDialog iz razreda AlertDialog v Androidu. Primer dialoga v uporabi
lahko vidimo na Sliki 29.
37
4.5 Testiranje
Aplikacijo se testira ob podpori orodij, ki jih ponuja Android Studio. Testne zmogljivosti se
lahko razširi z integracijo testnih ogrodij kot so Mockito za testiranje API-jev v testih enot
in Espresso ali UI Automator za testiranje uporabniškega vmesnika. [24] Testna koda se
implementira ločeno od programske kode aplikacije.
Testiranje enot
Testiranje enot se uporablja za testiranje najmanjših individualnih enot programske kode,
kot so programski vmesniki, metode. Za vsako enoto ustvarimo testne primere, ki so med
seboj neodvisni in preverjajo, da del programske kode deluje kot predvideno. Testi enot so
po navadi izvedeni avtomatsko, kar nam prihrani veliko časa. Android Studio ponuja hitro
implementacijo JUnit testov, ki je različica xUnit arhitekture za testiranje enot. [25]
Instrumentirani testi
So testi, ki se izvajajo na fizični napravi ali emulatorjev ob uporabi Instrumentation API-ja.
Take teste se lahko uporablja za testiranje integriranosti ter uporabniškega vmesnika z
avtomatizacijo uporabniškega vnosa.
Testiranje uporabniškega vmesnika
Avtomatizirani testi uporabniškega vmesnika lahko vsebujejo testiranje znotraj aplikacije,
ki preverja, ali aplikacija nudi pravilni vmesnik pri uporabnikovi interakciji z njim ali
testiranje, ki obsega več aplikacij. Ta vrsta ponuja testiranje pravilne interakcije med
različnimi uporabniškimi ali sistemskimi aplikacijami in uporabnikom. Ogrodje Espresso
omogoča simuliranje testnih uporabniških interakcij znotraj aplikacije, za testiranje med
več aplikacijami se lahko uporablja UI Automator.
38
5 SKLEP
5.1 Možnosti za nadgradnjo in nadaljevanje projekta
Tako kot pri vsakem produktu, ne samo pri programski opremi, je vedno na voljo prostor
za izboljšave ali popravke. S tem bodisi povečamo vrednost produkta ali pa samo izboljšamo
uporabniško izkušnjo. Predstavili smo samo nekaj smeri, v katere bi se projekt lahko še
naprej razvijal.
Nadgradnja uporabniškega vmesnika
Uporabniški vmesnik aplikacije bi bil lahko bolj privlačen predvsem zato, ker je večina
uporabnikov otrok. Uporaba barvnih motivov, vzorcev ter animacij z možnostjo
personalizacije vmesnika bi zelo povečala zanimanje za vsebino aplikacije.
Dodatne funkcionalnosti
To področje je za nadgradnje najbolj obširno. Med pomembnejše spadajo vključitev učenja
malih tiskanih črk, pisanih črk in učenje številk.
Nov uporabnik/uporabniško vlogo – Pedagoški delavec, ki bi lahko uporabnike
povezoval v skupine in spremljal njihov napredek posamezno ali na nivoju skupine.
Razširjena statistika – Aplikacija bi lahko bolj podrobno beležila statistiko kvizov,
iger tako, da bi uporabniki lažje identificirali težave, ki se jim pojavljajo.
Nove različice kvizov – Aplikacija bi lahko z novimi različicami kvizov omogočila
prepoznavanje govora. Uporabnik bi lahko na primer v novi različici izgovarjal
glasove črk, ki mu jih ponudi aplikacija.
Več metod učenja – Aplikacija bi lahko ponujala sestavljanje sestavljank,
predvajanje pesmic/videoposnetkov za učenje, igranje drugih iger itd.
Forum za starše oz. učitelje – V obliki foruma bi lahko učitelji oz. starši delili mnenja
in koristne napotke ob učenju.
Vadnica za pisanje – Implementacija metode, ki bi otroke naučila pravilnih potez za
pisanje črk.
39
Večjezična podpora – Z nadgradnjo aplikacije za uporabo z več jeziki bi jo lahko
uporabili kot pripomoček za učenje tujega jezika ali samo povečali krog možnih
uporabnikov.
Povezava s spletom
Dandanes že vsak izmed nas dostopa do interneta preko več različnih naprav. Zanimivo bi
bilo prenesti podatkovno bazo aplikacije na oddaljeni strežnik, da bi lahko uporabniki do
svojega računa dostopali kjerkoli iz katerekoli naprave.
Uporaba spletnih storitev – na primer dodajanje možnosti prijave v aplikacijo z
Google ali Facebook računom.
Uvedba tekmovalnih lestvic.
Prenos dodatne vsebine – uporabniki bi lahko prenašali nove vsebine v obliki
drugačnih slik, zvokov.
40
5.2 Zaključek
Razvoj mobilnih aplikacij že sam po sebi predstavlja velik izziv, saj je potrebno znanje več
tehnologij, pri razvoju aplikacij za izobraževanje moramo upoštevati še njihove posebnosti.
Ob razvoju moramo upoštevati tudi veliko število možnih platform, različnih naprav ter
dobro poznati zahteve uporabnikov, za katere aplikacije razvijamo.
Tekom izdelave diplomskega dela smo ugotovili, da je področje razvoja aplikacij za mobilne
naprave področje nenehnih spremembe in iz ugotovitev lahko sklepamo, da se bo področje
še bolj širilo. Prav tako se bo v prihodnosti še bolj razširil razvoj programskih rešitev za
potrebe izobraževanja, saj predstavljajo odlične učne pripomočke. Kljub nevarnostim ob
uporabni tehnologije bi bilo nespametno spregledati številne prednosti, ki jih učenje ob
uporabi mobilnih rešitev ponuja. Težje bo ob količini tovrstnih rešitev identificirati
kakovostne, ki uporabnika izobražujejo in ne le kratkočasijo.
Pri delu smo se naučili veliko tehnik, ki nam bodo brez dvoma koristile na naši poklicni poti.
Diplomsko delo je v nas vzpodbudilo še dodatno zanimanje za to področje.
41
ZAHVALA
Rad bi se zahvalil družini ter punci Naji za podporo tekom študija, lektorici in mentorju za
pomoč pri izdelavi diplomskega dela.
42
BIBLIOGRAFIJA
[1] „Wikipedija,“ [Elektronski]. Available: https://sl.wikipedia.org/wiki/Pismenost.
[Poskus dostopa 11 3 2017].
[2] M. H, 3 2017. [Elektronski]. Available:
https://www.maligalago.com/index.php/note/display/152/.
[3] B. J. Katarina Kesič, 3 2017. [Elektronski]. Available: http://www.viva.si/Psihologija-
in-odnosi/422/Zgodnje-opismenjevanje-otrok.
[4] 3 2017. [Elektronski]. Available: http://otroski-kino.si/zabavno-ucenje-abecede-za-
otroke/.
[5] T. W. E. T. Carina Paine Schofield, „Going mobile in executive education,“ 2011.
[6] A. Renko, Interviewee, Mislimo, da morajo biti stvari za otroke kričečih barv in
pretirano ljubke. Pa ni nujno tako.. [Intervju]. 31 1 2015.
[7] „Safe.si,“ [Elektronski]. Available: https://safe.si/novice/ugotovite-ali-
izobrazevalne-aplikacije-vasemu-otroku-resnicno-koristijo-pri-ucenju. [Poskus
dostopa 5 9 2017].
[8] Y. Alghamdi, Negative effects of technology on children of today, 2017.
[9] „Duolingo,“ [Elektronski]. Available: https://www.duolingo.com/. [Poskus dostopa
17 9 2017].
[10] „Google Play - Ježkove dogodivščine za otroke,“ [Elektronski]. Available:
https://play.google.com/store/apps/details?id=com.hedgehogacademy.hedgehogs
adventureslite&hl=sl. [Poskus dostopa 22 9 2017].
43
[11] „Morigenos,“ [Elektronski]. Available: http://www.morigenos.org/brezplacna-
dvojezicna-mobilna-aplikacija-za-otroke-varuh-morij-spodbujamo-okoljsko-vzgojo-
zgodnje-ucenje-jezikov/. [Poskus dostopa 22 9 2017].
[12] „Google Play - Abecedko,“ [Elektronski]. Available:
https://play.google.com/store/apps/details?id=com.goranhorvat.abecedko.
[Poskus dostopa 4 9 2017].
[13] „Google Play - Alphabet,“ [Elektronski]. Available:
https://play.google.com/store/apps/details?id=com.oki.alphabetnew. [Poskus
dostopa 6 9 2017].
[14] „Google Play - Endless Alphabet,“ [Elektronski]. Available:
https://play.google.com/store/apps/details?id=com.originatorkids.EndlessAlphabe
t. [Poskus dostopa 6 9 2017].
[15] „GenMyModel,“ [Elektronski]. Available: https://www.genmymodel.com/. [Poskus
dostopa 2 9 2017].
[16] „Use Case Diagrams,“ [Elektronski]. Available: http://www.uml-diagrams.org/use-
case-diagrams.html. [Poskus dostopa 3 9 2017].
[17] „Podatkovni modeli,“ [Elektronski]. Available:
http://drenovec.tsckr.si/model/uvod.htm. [Poskus dostopa 3 9 2017].
[18] „Android(operating system),“ [Elektronski]. Available:
https://en.wikipedia.org/wiki/Android_(operating_system). [Poskus dostopa 31 8
2017].
[19] D. M. Pahor David, Leksikon računalništva in informatike, Ljubljana: Pasadena,
2002.
[20] „Google Play,“ [Elektronski]. Available: https://en.wikipedia.org/wiki/Google_Play.
[Poskus dostopa 31 8 2017].
44
[21] „Android,“ [Elektronski]. Available:
https://developer.android.com/studio/intro/index.html. [Poskus dostopa 2 9
2017].
[22] „SQLite,“ [Elektronski]. Available: https://www.sqlite.org/about.html. [Poskus
dostopa 2 9 2017].
[23] „Saving data in SQL Databases,“ [Elektronski]. Available:
https://developer.android.com/training/basics/data-
storage/databases.html#DefineContract. [Poskus dostopa 5 9 2017].
[24] „Test Your App,“ [Elektronski]. Available:
https://developer.android.com/studio/test/index.html. [Poskus dostopa 6 9 2017].
[25] „JUnit,“ [Elektronski]. Available: http://junit.org/junit4/. [Poskus dostopa 6 9 2017].
[26] „Introduction to activities,“ [Elektronski]. Available:
https://developer.android.com/guide/components/activities/intro-activities.html.
[Poskus dostopa 3 9 2017].
[27] „The Activity Lifecycle,“ [Elektronski]. Available:
https://developer.android.com/guide/components/activities/activity-
lifecycle.html#asem. [Poskus dostopa 3 9 2017].
Recommended