UNIVERZITA KARLOVA V PRAZE PEDAGOGICKÁ FAKULTA KATEDRA INFORMAČNÍCH TECHNOLOGIÍ A TECHNICKÉ VÝCHOVY
Webová aplikace pro procvičování anglické slovní zásoby Matouš Trča
Vedoucí práce:
PhDr. Josef Procházka, Ph.D.
Studijní program:
B7507 Specializace v pedagogice
Studijní obor:
Informační technologie se zaměřením na vzdělávání
Prohlašuji, že jsem bakalářskou práci na téma Webová aplikace pro procvičování anglické slovní zásoby vypracoval pod vedením vedoucího bakalářské práce samostatně za použití v práci uvedených pramenů a literatury. Dále prohlašuji, že tato bakalářská práce nebyla využita k získání jiného nebo stejného titulu. dne 10. 4. 2015 ............................................
Rád bych touto cestou vyjádřil poděkování PhDr. Josefu Procházkovi, Ph.D. za jeho cenné rady a trpělivost při vedení mé bakalářské práce.
............................................
NÁZEV: Webová aplikace pro procvičování anglické slovní zásoby AUTOR: Matouš Trča KATEDRA: Katedra informačních technologií a technické výchovy VEDOUCÍ PRÁCE: PhDr. Josef Procházka, Ph.D. ABSTRAKT: Cílem bakalářské práce je vytvoření funkčního prototypu webové aplikace, jež bude sloužit k procvičování slovní zásoby anglického jazyka. Algoritmus aplikace bude založen na technice Spaced Repetition, tedy na efektivním rozložení opakování jednotlivých karet tázajících se na správnou odpověď (tzv. flashcards) v čase. Aplikace umožní uživatelům registraci, vytvoření vlastní kolekce karet a bude je volitelně upozorňovat o denních dávkách e-mailem. Vytváření vlastní kolekce bude částečně automatizováno – uživatel zadá slova, která si chce zapamatovat a systém vygeneruje karty pomocí volně dostupných slovníkových API. V první, teoretické části se práce zaměřuje na obecné aspekty učení, paměti a zapomínání. Dále také srovnává stávající aplikace pro procvičování anglické slovní zásoby a jejich algoritmy. Praktická část se zabývá samotným vývojem aplikace od návrhu po její implementaci a výsledným uživatelským testováním. KLÍČOVÁ SLOVA: učení, webová aplikace, anglická slovní zásoba, spaced repetition, flashcards
TITLE: A web application for learning English vocabulary AUTHOR: Matouš Trča DEPARTMENT: IT & Technical Education Department SUPERVISOR: PhDr. Josef Procházka, Ph.D. ABSTRACT: The aim of this bachelor thesis is to create an operational prototype of a web application, which would help students to practice English vocabulary. The algorithm of the application will be based on Spaced Repetition technique, which incorporates increasing intervals of time between subsequent reviews of previously learned flashcards. The application will allow users to register, to create a new collection of flashcards, and it will optionally notify them by e-mail about their daily batch. The creation of flashcards will by semi-automated – users input the word, which they want to remember, and the system will generate flashcards using freely available dictionary APIs. The first, theoretical part focuses on general aspects of learning, memory and forgetting. It also compares the existing applications for learning vocabulary and their algorithms. The practical part of this bachelor thesis is concerned with the development of the application, from the design to the implementation and final user testing. KEYWORDS: learning, web application, English vocabulary, spaced repetition, flashcards
Obsah Úvod....................................................................................................................................... 9 1
Učení ............................................................................................................................ 10 1.1
2
Typy učení ............................................................................................................ 10
Paměť........................................................................................................................... 12 2.1
Princip fungování paměti..................................................................................... 12
2.2
Typy paměti ......................................................................................................... 13
2.2.1
Podle doby trvání........................................................................................... 13
2.2.2
Podle typu informace .................................................................................... 15
2.3
Faktory ovlivňující paměť .................................................................................... 16
2.3.1
Opakování ...................................................................................................... 17
2.3.2
Emoce ............................................................................................................ 17
2.3.3
Organizace materiálu..................................................................................... 17
2.3.4
Kontext .......................................................................................................... 18
2.3.5
Soustředění .................................................................................................... 18
2.4
Problematické faktory paměti ............................................................................. 19
2.4.1
Zapomínání .................................................................................................... 19
2.4.2
Zkreslení......................................................................................................... 21
2.4.3
Interference ................................................................................................... 22
3
Technika spaced repetition ......................................................................................... 23
4
Srovnání stávajících aplikací ........................................................................................ 27 4.1
Kritéria hodnocení ............................................................................................... 27
4.1.1
Zohlednění různých typů inteligence ............................................................ 27
4.1.2
Využití techniky Spaced Repetition ............................................................... 27
4.1.3
Dostatečné informace o slovech ................................................................... 28
4.1.4
Výběr vlastních slov ....................................................................................... 29
4.1.5
Možnosti použití ............................................................................................ 29
4.1.6
Použitelnost a design ..................................................................................... 30
4.2
Srovnávané aplikace ............................................................................................ 30
4.2.1
SuperMemo ................................................................................................... 30
4.2.2
Anki ................................................................................................................ 31
4.2.3
EnglishMe! ..................................................................................................... 32
4.2.4
Slovicka.org .................................................................................................... 33
4.3
Srovnání ............................................................................................................... 33
5
Charakteristika aplikace (Analýza) ............................................................................... 34
6
Návrh ........................................................................................................................... 36
7
6.1
Spaced Repetition algoritmus ............................................................................. 36
6.2
Databáze (Datová vrstva) .................................................................................... 38
6.3
Hlavní operace (Aplikační vrstva) ........................................................................ 38
6.4
Grafický návrh (Prezentační vrstva) .................................................................... 38
Implementace .............................................................................................................. 40 7.1
MVC architektura................................................................................................. 40
7.1.1 7.2
Nette framework ........................................................................................... 41
Datová vrstva (Model) ......................................................................................... 42
7.2.1
Změny databáze oproti návrhu ..................................................................... 42
7.2.2
Získávání slovníkových dat ............................................................................ 43
7.2.3
Cron ............................................................................................................... 44
7.3
Prezentační vrstva (View) .................................................................................... 44
7.3.1
Bootstrap ....................................................................................................... 45
7.3.2
JavaScript ....................................................................................................... 47
7.4
Aplikační vrstva (Controller) ................................................................................ 48
7.5
Shrnutí ................................................................................................................. 49
8
Testování a zhodnocení aplikace ................................................................................. 51
9
Závěr ............................................................................................................................ 54
Seznam použitých informačních zdrojů .............................................................................. 55 Seznam tabulek, obrázků a grafů ........................................................................................ 60 Přílohy .................................................................................................................................. 61
Úvod Osvojení jazyka je pro člověka možná nejdůležitější proces. Právě jazyk jednoznačně odděluje lidstvo od zvířat, jelikož jsou díky němu lidé schopni předávat si informace a komunikovat na daleko vyšší úrovni. Související vývoj písma lidem dovolil jejich myšlenky trvale zaznamenat a přenos zkušeností už pak nezávisel pouze na přenosu genetické informace, ale i na záznamech, které si následující generace mohli přečíst. V současnosti však zpravidla znalost jednoho jazyka nestačí (jazyková různorodost je jednou z priorit Evropské Unie), a tak se studiu cizího jazyka věnuje čím dál více lidí (41). Pro většinu zemí, včetně České republiky, je lingvou frankou anglický jazyk, jakožto hlavní dorozumívací prostředek vědy, techniky, mezinárodního obchodu, diplomacie a internetu (29). Jelikož se Česká republika v rámci EU pohybuje na posledních příčkách znalosti angličtiny a cizích jazyků obecně, existuje zde poměrně velký prostor pro zlepšení jazykových schopností (30). Studie prokazují, že právě slovní zásoba je pro studium cizího jazyka klíčová (28). Některé například tvrdí, že „nejtěžší úkol, který stojí před studenty cizího jazyka, je získání dostatečně velké slovní zásoby“ (28). Pod slovní zásobou se neskrývají jen slova samotná, ale především jejich význam, použití a výslovnost. Jak podotýká lingvista Paul Nation: „Slovní zásoba není cíl sám o sobě. Bohatá slovní zásoba ulehčuje poslech, mluvení, čtení a psaní“ (31). Z tohoto pohledu je slovní zásoba důležitější než gramatika, která je ovšem také pro plné ovládnutí jazyka nezbytná. Získání dostatečné anglické slovní zásoby však pro české studenty nemusí být ze dvou důvodů jednoduchý úkol. Ten první je, že angličtina má díky historickým vlivům možná nejširší slovní zásobu ze všech jazyků světa. Druhým důvodem je fakt, že jen málo českých slov má, na rozdíl od slovanských jazyků, podobný anglický ekvivalent. Ze všech zde uvedených důvodů jsem se rozhodl, že vytvořím prototyp webové aplikace, který by českým uživatelům s procvičováním anglické slovní zásoby pomohl.
9
1 Učení Učení je schopnost, která je pro všechny žijící organismy zásadní. Z hlediska paměťového procesu se jedná o prvotní fázi, kdy organismus ukládá novou informaci do paměti (4). Jeho ovládnutí představuje často pro živočišné druhy evoluční výhodu. Jako ukázkový příklad u lidí může sloužit v úvodu zmiňovaný jazyk, který by bez významného ovládnutí schopnosti učení a paměti nikdy nemohl vzniknout. Z tohoto důvodu je učení fenomén, který je studován po celou dobu historie lidstva.
1.1 Typy učení Existují různé typy učení. Například kognitivní psychologie rozděluje učení do osmi skupin, toto dělení však vychází ze silného vlivu podvědomí jedince (5). Rozšiřování slovní zásoby pomocí aplikace je ovšem bezesporu proces vědomý, a tudíž je kognitivní dělení z hlediska této práce irelevantní. Výchovná praxe rozděluje učení podle jeho obsahu následovně:
Učení intelektových činností
Učení poznatků
Sociální učení
Senzomotorické učení
Z tohoto pohledu je vědomé procvičování slovní zásoby jednoznačně učením poznatků, ve kterém jde především o získávání informací (5). Pokud vezmeme v potaz požadované vlastnosti navrhované aplikace, je nejzajímavější dělení podle psychologa Howarda Gardnera, jež rozděluje jedince podle převažujícího typu inteligence. Právě inteligence je však se schopností učit se přímo spojena a ovlivňuje jí. Gardner ve své knize Frames of Mind: The Theory of Multiple Intelligences pojmenoval sedm základních typů inteligence (6):
Jazykově-verbální Lidem s touto inteligencí při učení pomáhá vidět látku napsanou nebo si ji předříkávat nahlas.
Logicko-matematická Lidem s touto inteligencí při učení pomáhá logika, odůvodňování a systém. 10
Zvukově-hudební Lidem s touto inteligencí při učení pomáhají zvuky a hudba, například vytváření rýmů a písní z učené látky.
Tělesně-pohybová Lidem s touto inteligencí při učení pomáhá pohyb těla a rukou a hmat.
Vizuálně-prostorová Lidem s touto inteligencí při učení pomáhají obrázky, barvy, prostorové rozložení a ostatní vizuální média.
Vnitřní (intrapersonální) Lidem s touto inteligencí při učení pomáhá být sám a upřednostňují samostudium.
Společenská (interpersonální) Lidem s touto inteligencí při učení pomáhá spolupracovat s ostatními ve skupině. (7)
Z předchozího seznamu vyplývá, že v zásadě jakýkoliv typ informace vnímaný subjektem (i jejich kombinace) může být ukládán do paměti (4). Dále lze také odvodit, že učení bude záviset na individuálních potřebách člověka a povaze materiálu, který si chce zapamatovat.
11
2 Paměť Z hlediska učebního procesu souvisí paměť s jeho druhou a třetí fází (první je učení). V druhé fázi dochází k tvorbě trvalého záznamu ukládané informace a v poslední jde o vybavení uložené informace a její použití (4). V podstatě se dá říci, že paměť určuje to, jací jsme (všechny naše zvyky, přesvědčení, naděje a obavy jsou ovlivněny tím, co jsme si v minulosti zapamatovali). Bez schopnosti pamatovat si, bychom nebyli schopni plnohodnotně žít. Definice pak říká, že paměť jsou „jakékoli více či méně trvalé změny v chování a prožívání způsobené vlivem zkušenosti“ (3). Ačkoliv se dnes ozývají názory, že lidská paměť není v době elektronických zdrojů informací, až tak důležitá, opak je pravdou. Člověk je sice v dnešní době schopen pomocí internetu najít kýženou informaci v řádu několika sekund, jak ovšem podotýká Piotr Wozniak: „Dvě fakta uložená v lidské paměti se mohou v okamžiku přetavit v novou, originální, myšlenku. Stejná dvě fakta uložená v paměti počítače zůstanou neužitečné do doby, než se v lidské mysli spojí“ (2). Jinými slovy, i pro lidskou kreativitu je paměť nezbytná. Tato vlastnost lidské (asociativní) paměti představuje nejsilnější protiváhu oproti počítačové (lokací adresované) paměti (3).
2.1 Princip fungování paměti To, že dochází k trvalému záznamu informace (ke konsolidaci) je zapříčiněno změnou spojení neuronů v našem mozku, přesněji změnou a synaptické plasticity, přičemž nedávné nálezy naznačují, že paměť „není lokalizována v jediné konkrétní struktuře“ (8) (4). Metaforicky lze říci, že stejně jako horniny, které zaznamenávají geologické éry, tak i lidský mozek fyzicky zaznamenává historii, ale člověka (8). Vybavení informace se týká opětovného přístupu k takto uloženým informacím v mozku. Během rozpomínání mozek přehrává obdobu nervové aktivity, kterou generoval při určité události a odráží její vnímání jedincem. Ono přehrávání nervové aktivity je nicméně odlišné od té původní, jinak by nebylo možné poznat rozdíl mezi pravou zkušeností a vzpomínkou. Jedním důsledkem toho je, že vzpomínky se v čase mohou měnit a mohou do nich být začleňovány nové informace (11). Síla zmiňované nervové cesty pak
12
předurčuje to, jak rychle jsme schopni si informaci vybavit a je mimo jiné závislá na faktorech uvedených v kapitole Faktory ovlivňující paměť. S procesem vybavování souvisí i jev zvaný rekonsolidace. Vzpomínka (resp. její obraz) se při vybavení přenáší z dlouhodobé do krátkodobé paměti (viz Typy paměti), čímž se zpřístupní (11). Posléze je znovu uložena do dlouhodobé paměti, tedy je rekonsolidována. Při rekonsolidaci může být vzpomínka jednak modifikována (4) a jednak dochází jejímu upevnění a zvyšuje se tak šance, že budeme schopni si vzpomínku znovu vybavit (13).
2.2 Typy paměti V současnosti panuje v neurovědě názor, že „existuje více typů paměti, které se od sebe liší vzhledem k jejich psychologickým charakteristikám, zúčastněných částí nervové soustavy a nervových mechanismů jakou jsou kódování, uchovávání, konsolidace a vzpomínání“ (9). Paměť se dělí podle dvou základních kritérií, avšak některé zdroje uvádí i alternativní kritéria.
2.2.1 Podle doby trvání První kritérium rozděluje paměť podle toho, jak dlouho vzpomínka trvá. Ty nejkratší mají životnost v řádu milisekund a nejdelší mohou trvat celý život. Každý typ je svázán s určitou funkcí mozku.
Okamžitá (percepční) paměť Okamžitá paměť typicky trvá tak krátkou dobu (typicky v rozmezí 200 - 500 milisekund), že o ní ani nepřemýšlíme jako o paměti. V podstatě se dá říci, že percepční paměť slouží mozku jako dočasné úložiště pro podněty přijímané našimi smysly. Pokud se například v rychlosti rozhlédneme po krajině, tak se jednotlivé snímky ukládají do okamžité paměti a dohromady vytvoří plynulé panorama. (8) Podněty, které naše smysly detekují, mohou být buď záměrně ignorovány a tak téměř okamžitě mizí, nebo vnímány a v takovém případě přechází do percepční paměti. Tento proces je obvykle nevědomý. Mozek si sám vybírá, jaké informace jsou v dané situaci užitečné a jaké jsou naprosto bezvýznamné. (14)
13
Experimenty z 60. let minulého století vedené Georgem Sperlingem ukázaly, že horní limit pro percepční paměť je přibližně 12 prvků (10) a je také prokázáno, že na rozdíl od ostatních typů paměti v této kategorii je percepční paměť jediná, která nemůže být prodloužena cvičením (14).
Krátkodobá (pracovní) paměť Do krátkodobé paměti lze zahrnout informace nově přijaté, získané vzpomínáním z dlouhodobé paměti nebo také podvědomí o okolním prostředí – vědomí (10). Doba pracovní paměti je zhruba tak dlouhá, jak je udržování určité informace užitečné. Například doba, po kterou si budeme pamatovat číslo stránky v časopise, by neměla být delší, než jakou by nám trvalo na příslušnou stranu otočit (8). V jednotkách času trvá krátkodobá paměť v řádu sekund až minut (4). Stejně jako percepční paměť, je i paměť pracovní omezená kapacitou. Experimentálním výzkumem bylo zjištěno tzv. Millerovo magické číslo, které udává, že v průměru je možno do krátkodobé paměti uložit maximálně sedm položek, plus minus dvě (15). Jednotlivé položky, se do paměti neukládají jako kompletní pojmy, ale spíše odkazy na dříve získané znalosti (16). Například následující seznamy A a B by jedincovi měly při snaze si je zapamatovat činit obdobné potíže (pokud nepoužije mnemotechnické pomůcky anebo si jednotlivé položky nebude snažit zapamatovat ve skupinkách): A: B:
B PES
9 BRÝLE
Q KAFKA
T DISK
3 MÝDLO
X DOMOV
A BĚH
Tabulka 1 – Ukázka dvou řad, které je stejně obtížné si zapamatovat
Dlouhodobá (referenční) paměť Dlouhodobá paměť je pro většinu lidí právě ten typ paměti, se kterým jsou nejvíce obeznámeni. Slouží k dlouhodobému uchovávání faktů, postřehů a příběhů. Člověk si obecně není vědom úplné kapacity své dlouhodobé paměti, dokud se nesnaží na jednotlivé informace vzpomenout (10). Oproti krátkodobé paměti může trvat jak minuty, tak i celý život a svou kapacitou je zdánlivě neomezená (4). Dalším podstatným rozdílem mezi krátkodobou a dlouhodobou pamětí je způsob uchovávání informace. Uchovávání v krátkodobé paměti z větší části závisí na akustickém 14
vjemu a z menší části na vjemu vizuálním. Nicméně dlouhodobá paměť využívá pro uchovávání převážně sémantické kódování a asociace (17). Z toho plyne fakt, že po přečtení věty nejsme zpravidla po několika minutách schopni větu slovo od slova převyprávět. Smysl věty nicméně v paměti přetrvá. V případech, kdy jen těžko mezi jednotlivými položkami nalézáme smysl, lze využít k uchování do dlouhodobé paměti využít mnemotechnické pomůcky. Jedna z nejstarších se jmenuje Paměťový palác a používá se od starého Řecka dodnes (18). Již dříve zmíněnou konsolidaci můžeme díky novým faktům znovu definovat jako přechod informace z krátkodobé paměti do dlouhodobé. Jak fyziologicky k tomuto přechodu dochází, je dodnes zahaleno tajemstvím (16), jisté je však, že při upevňování paměťové stopy hraje významnou roli spánek (4).
stimul
vnímání
percepční paměť
pozornost
krátkodobá paměť
konsolidace
dlouhodobá paměť
Obrázek 1 – Schéma vztahu mezi jednotlivými typy paměti podle doby trvání
2.2.2 Podle typu informace Dělení podle typu informace se týká čistě dlouhodobé paměti, a tak je deklarativní a nedeklarativní paměť v některých materiálech členěna pod ní. Pro přehlednost je však v této práci uvádím odděleně. Jedním z hlavních důvodu, proč se vědci domnívají, že existují dvě rozdílné paměti z hlediska typu informace, je ten, že některé úrazy hlavy poškodí pouze explicitní paměť, zatímco implicitní zůstane nedotčená (10).
Nedeklarativní (implicitní) paměť Implicitní paměť nám odpovídá na otázku „jak?“ Nedeklarativní vzpomínky nám umožňují vykonávat různé aktivity (například jezdit na kole), aniž bychom věděli, jak jsme se danou schopnost naučili (8). Obecně si této paměti ani nejsme vědomi, nicméně je velmi důležitá, protože bychom bez ní nebyli schopni mluvit ani chodit (10). 15
Jelikož je nedeklarativní paměť vyloženě spjata podvědomím jedince a tudíž i s kognitivním dělením učení (viz kapitola Typy učení), je tento typ paměti z hlediska této práce téměř nepodstatný.
Deklarativní (explicitní) paměť Na druhou stranu, deklarativní paměť je pro tuto práci zásadní. V následující kapitole Faktory ovlivňující paměť, bude pod pamětí vždy myšlena paměť deklarativní, stejně jako v běžném životě. Obsahy deklarativní paměti jsou většinou vědomě přístupné (člověk ví, že ví) a dokáže je i ústně popsat (8) (10). Explicitní paměť nám odpovídá na otázku „co?“ Obsahuje fakta a události, které je snadné vyjádřit ve formátu odlišném od toho, ve kterém byly získány (3). To, jestli obsahuje fakt nebo událost, ji dále dělí na sémantickou a epizodickou paměť. Sémantická paměť Sémantická paměť obsahuje veškeré vědomosti, které člověk má, od slovní zásoby, po matematické poučky. Díky sémantické paměti jsme například schopni odpovědět na otázku: „Jak se anglicky řekne vzpomínka?“ K tomu, abychom informaci uložili do sémantické paměti, je zpravidla potřeba více opakování, ale může stačit i jedna expozice. (10) Epizodická paměť Epizodická paměť obsahuje naše vlastní zkušenosti. Díky epizodické paměti jsme například schopni odpovědět na otázku: „Co jsem měl dnes k snídani?“. Pokud máme například převyprávět celý náš den, jsme schopni, i bez většího úsilí, zajít do větších podrobností i po jediné expozici, což je hlavní rozdíl oproti sémantické paměti. Na druhou stranu vyprávění z minulého týdne bude už velmi obtížné. Epizodická paměť totiž, za předpokladu že se nejedná o zarážející, neobvyklou, emotivní, nebo důležitou událost, rychle mizí. (10)
2.3 Faktory ovlivňující paměť Existuje celá řada faktorů, které dokáží urychlit konsolidaci (přechod z krátkodobé do dlouhodobé paměti), posílit paměťovou stopu stávajících vzpomínek (zpomalit
16
zapomínání) a pomoci při snaze si vzpomenout. Tato kapitola obsahuje seznam těch nejdůležitějších z nich. Pokud budeme schopni efektivně využít učební strategie, které využívají silné stránky našeho mozku, můžeme se naučit více informací v daleko kratším čase.
2.3.1 Opakování Opakování je nejzákladnější a všeobecně známá strategie učení (známé je přísloví „Opakování je matka moudrosti“). To, že si pamatujeme význam slova dog, je dáno tím, že jsme ho mnohokrát slyšeli. Její princip je jednoduchý. Čím častěji budeme vystaveni nějakému faktu, tím větší bude šance, že si na tento fakt v budoucnu vzpomeneme. Z toho vyplývá, že to, co jsme se v minulosti naučili, bude mít vliv na naše budoucí učení (8). Naopak, pokud informaci nebudeme upevňovat, budou šance na rozpomenutí postupem času nižší (viz Graf 1 – Původní Ebbinghausova křivka sestavená z experimentálních hodnot (22)). Velký vliv má také způsob rozložení opakování v čase, o tom nicméně podrobně pojednává kapitola Technika spaced repetition.
2.3.2 Emoce Druhým důležitým faktorem, který ovlivňuje učení a paměť, jsou emoce. Daleko snáze si budeme pamatovat fakta a události, které v nás vyvolávají silnou emocionální odezvu (3). Většina lidí si bude například pamatovat den, kdy jim zemřel někdo blízký. Naopak všední okamžiky se z paměti rychle vytratí.
2.3.3 Organizace materiálu Další metodou, jak zlepšit uchování informace v paměti, je organizování. Čím více je kódovaný materiál organizovaný, tím lepší jsou předpoklady pro uchování. Například hierarchicky uspořádané informace jsou daleko lépe a ve větším množství uchovávány než informace nahodile rozvržené nebo chaotické (12). V praxi si tedy člověk lépe zapamatujete studijní materiál, když si v rychlosti projde jednotlivé kapitoly a získá tak přehled o jeho hlavních bodech ještě předtím, než ji začne
17
detailně číst. Obecně totiž platí, že člověk si mnohem lépe pamatuje ty informace, které si hierarchicky zorganizoval (3).
2.3.4 Kontext Pro paměťový proces hraje poměrně velkou roli i kontext. Obecně platí, že člověk si mnohem lépe pamatuje ty informace, které jsou kódovány a vyvolávány ve stejném kontextu (3). Pokud se snažíme na něco vzpomenout, může naopak změna kontextu škodit. Toto potvrzuje experiment psychologa Allana Baddeleyho, jenž testoval potápěče, kteří si měli na souši a pod vodou zapamatovat seznam slov. Následně si měli v obou prostředích na seznam vzpomenout. Důležitým výsledkem bylo, že účastníci byli daleko úspěšnější, když obě prostředí při učení a testování byla stejná, než když byla rozdílná (10). V běžném životě se můžeme například setkat se situací, kdy pro něco jdeme do vedlejší místnosti a náhle si nemůžeme vzpomenout pro co. Teprve návratem, do místa, kde potřeba přinést onu věc vznikla, tedy do stejné situace, se informace vybaví (tzv. návrat na „místo činu“ – na něm je založena i metoda policejních rekonstrukcí) (12). Nejsnáze si proto zapamatujeme informace, které můžeme interpretovat v kontextu, který známe a rozumíme mu (8). Je daleko jednodušší si zapamatovat větnou konstrukci a použití předminulého času, pokud již o anglické gramatice máme dostatečné znalosti.
2.3.5 Soustředění Poslední a pravděpodobně i nejdůležitější faktor ovlivňující paměť je soustředění. Aby se informace vůbec zaznamenala, musíme ji nejprve vnímat, což soustředění staví nad všechny ostatní vlivy. Jedná se o první přirozenou selekci, která zabraňuje přetížení mozku. O druhou se stará zapomínání. Z tohoto důvodu je mnoho problémů označovaných jako problémy s pamětí vlastně jenom problémem s pozorností (12). Nedávná studie zkoumala závislost soustředění a paměti tím, že si účastníci experimentu museli v různých prostředích zapamatovat skupinu znaků. Skupina, která se při učení procházela po klidném parku, dosáhla daleko více bodů než skupina, která řídila auto po rušných ulicích (16).
18
2.4 Problematické faktory paměti Ačkoliv je často spolehlivá, lidská paměť také chybuje. Vzpomínka nemusí pouze staticky „sedět“ v mozku, ale může být transformována, zobecňována a zeslabována (4). Ve své knize The Seven Sins of Memory: How the Mind Forgets and Remembers profesor Daniel Schacter předkládá sedm problematických faktorů paměti, jenž mohou být pro jednoduchost rozděleny do dvou hlavních skupin (19). První zahrnuje různé formy zapomínání a druhá různé typy zkreslení. Poslední faktor, stojící mimo uvedené kategorie, se týká obtěžujících vzpomínek, kterých se naopak nemůžeme zbavit, ačkoliv bychom chtěli.
2.4.1 Zapomínání Zapomínání je pravděpodobně nejproblematičtější faktor lidské paměti (19). Nicméně, schopnost zapomínat (především nepotřebné informace jako, co jsme měli před týdnem k snídani) je přirozená a důležitá vlastnost lidské paměti, jelikož pomáhá učení informací nových (8). Zapomínání je tedy psychohygienické (je obranou našeho mozku proti přetížení) (12). V závislosti na síle, má každá vzpomínka svou předpokládanou životnost (2). Zapomínání můžeme podle Schactera rozdělit na tři základní typy. První je pomíjivost, neboli postupná, klesající dostupnost informací v průběhu času. Druhá, roztržitost bývá zapříčiněna nízkou pozorností při vštěpování i při vybavování informace (stav, kdy si nemůžeme vzpomenout, kde jsme nechali mobilní telefon) (20). Třetí je tzv. paměťový blok, který odkazuje na dočasnou nedostupnost informace uložené v paměti (stav, kdy něco „máme na jazyku“) (19). Existují dva základní pohledy na to, co se děje s informacemi během zapomínání. Ten běžnější je, že zapomínání z dlouhodobé paměti je výsledkem ztráty přístupu k informaci, která může být vyvolána poskytnutím vhodných vodítek. Z toho vyplývá, že špatná paměť často odráží selhání procesu vybavování spíše než selhání procesu uchování (12). Druhý pohled připouští možnost, že informace se mozku postupem času vytratí úplně (tj. nelze k nim přistoupit ani hypnózou) (19). To, jestli je pravdivý první nebo druhý pohled (anebo dokonce oba najednou), je stále předmětem debaty (17). 19
Zapomínání můžeme také rozdělit podle toho, zda probíhá v krátkodobé nebo v dlouhodobé paměti. V případě krátkodobé paměti je zapomínání velmi rychlé (v řádu sekund) a jejím důvodem je nejčastěji překročení Millerova magického čísla (19) (12). Fyziologickou příčinou je to, že nervový impuls přestane být v určité neuronové síti vysílán (16). Zapomínání dlouhodobé paměti probíhá v řádu hodin, dní nebo let a na rozdíl od krátkodobé je jejím důvodem oslabení dříve zesílených synaptických spojení mezi neurony v neuronové síti (17). Ebbinghausova křivka zapomínání Psychologové a neurologové se začali zabývat studiem zapomínání od té doby, co Hermann Ebbinghaus v roce 1885 uplatnil experimentální metody při výzkumu paměti a poskytl následujícím generacím kvantitativní odhady zapomínání (19). Ve svých výzkumech využil svou paměť a snažil si zapamatovat nesmyslné slabiky (21). Po různě dlouhých intervalech zaznamenával, kolik procent slabik si z původního počtu pamatuje. Již relativně brzo zpozoroval rychlý pokles schopnosti vzpomenout si, který se s uplynulou dobou ještě prohluboval (19). 100
Šance na vybavení [%]
90 80 70 60 50 40 30
20 10 0 0
0,33
1
8,8
24
48
144
744
Uplynulý čas [hodiny]
Graf 1 – Původní Ebbinghausova křivka sestavená z experimentálních hodnot (22)
Kognitivní psychologové ovšem pokračovali ve výzkumu křivky zapomínání. Současné výzkumy říkají, že křivku lze nejlépe popsat exponenciální funkcí, která má předpis (23): 𝑡
𝑅 = 𝑒 −𝑆 20
kde 𝑅 je šance na vyvolání informace z paměti, e je Eulerovo číslo, t je čas a S je relativní síla paměti (někdy označovaná jako stabilita), která určuje, jak dlouho zůstane paměťová stopa v paměti a závisí na faktorech uvedených v kapitole Faktory ovlivňující paměť (24). Z obou křivek lze vyčíst, že již po jednom dni je šance na vybavení přibližně jedna polovina. 100
Šance na vybavení [%]
90 80 70 60
50 40 30 20 10 0 0
1
2
3
4
5
6
7
8
9
10
11
12
13
Uplynulý čas [dny]
Graf 2 – Exponenciální křivka zapomínání pro S=2
2.4.2 Zkreslení Paměť je také charakteristická svou náchylností ke zkreslení, které vede k nepřesnosti. Jedná se o situace, ve kterých je nějaká forma paměti sice přítomná, nicméně je přisuzována špatné osobě, místu nebo době (19). Podle Schactera existují tři úzce související formy zkreslení. K záměně dochází, když nejsme schopni přiřadit vzpomínce skutečný zdroj (především starší lidé mají problém po několika dnech určit, zda informaci viděli v televizi nebo ji četli v novinách). Sugestibilita se týká vštípení neexistujících vzpomínek pomocí sugestivních otázek a komentářů během procesu vybavování (to může být problém především při vyslýchání očitých svědků). Zkreslování má za následek, že i osobní stereotypy, hodnoty, znalosti a city naše vzpomínky ovlivňují (lidé se často podle své aktuální situace ohlížejí na minulost buď s nostalgií, nebo negativně) (19).
21
2.4.3 Interference Další faktor, který může výrazně rušit vštípení a vybavení informace je interference (12). Může se stát, že nám po dlouhou dobu nedělá problém si správně vybavit informaci, dokud si nezapamatujeme novou, která činí vybavení té druhé daleko těžší, až téměř nemožné (25). Rozhodující roli hraje podobnost informací (10). Například si můžeme plést význam anglických slov economic a economical. Interference se dělí na dva základní typy. Proaktivní interference je proces, prostřednictvím kterého stará informace může narušit nové učení. Retroaktivní interference je proces, prostřednictvím kterého nová informace může narušit učení staré (3).
22
3 Technika spaced repetition Reakce na výzkum Hermanna Ebbinghause na sebe nechala čekat poměrně dlouhou dobu. Teprve v sedmdesátých letech minulého století se objevil Leitnerův systém, který částečně převedl Ebbinghausovy poznatky do praxe (1). Přibližně o deset let později začaly vznikat první softwarové řešení, které na tento systém navázaly a začaly využívat techniku spaced repetition (opakování s optimálními prodlevami), proto se zkráceně nazývají SRS (z angl. Spaced Repetition System). Základem všech SRS jsou kartičky, které na jedné straně nesou otázku a na druhé odpověď (v angličtině je pro ně zažitý termín flashcards). V případě výuky cizího jazyka obsahuje jedna strana slovo, které se chceme naučit a druhá překlad, definici nebo synonyma. Pro jedno slovo se zpravidla vytvoří dvě kartičky, první se ptá na překlad (význam) slova a druhá naopak, čímž se zaručí, že student cizí slovo pozná a zároveň ho dokáže produkovat.
První kartička
Přední strana
Zadní strana
Jak se anglicky řekne
Memory
paměť? Druhá kartička
Co znamená memory?
Paměť
Tabulka 2 – Jednoduchá ukázka kartiček pro výuku cizího slova
Využití kartiček s sebou nese výhodu v podobě aktivního opakování (z angl. active recall testing), což v praxi znamená, že člověk je tázán a snaží vymyslet odpověď. Tento princip kontrastuje s pasivním přístupem, kdy pouze vstřebáváme informace čtením nebo poslechem, bez větší interakce mozku (13). Studie prokazují, že z dlouhodobého hlediska je výhodnější využívat aktivní opakování (27). Prvním důvodem je samotný akt vzpomínání, který posiluje paměťovou stopu (dochází k rekonsolidaci). Druhý důvod je zpětná vazba (zjistíme, které kartičky jsme zapomněli a měli bychom si je zopakovat). Principem Leitnerova systému bylo rozdělení karet do krabiček, které byly číslované. Pokud člověk na otázku odpověděl dobře, pak ji přesunul do krabičky s vyšším číslem. V případě, že odpověděl špatně nebo odpověď vůbec neznal, tak kartičku přesunul do krabičky první. Čím nižší bylo číslo krabičky, tím vyšší měla být frekvence opakování 23
kartiček v ní obsažených. Výsledkem bylo, že člověk měl hrubý přehled o tom, které kartičky mu nedělají problém a které je potřeba opakovat častěji (1).
Obrázek 2 – Schéma fungování Leitnerova Systému (1)
Ačkoliv Leitnerův systém přinesl velkou výhodu oproti systému, kdy jsou všechny kartičky ve stejném balíčku, nedával informaci o tom, kdy je nejlepší čas si kartičku zopakovat (13). Tento problém začaly řešit až softwarové adaptace, které díky zpětné vazbě uživatele dokáží přesně vypočítat optimální datum pro zopakování. Vůbec první software, který tento princip implementoval, byl SuperMemo polského vědce a programátora Piotra Woźniaka (38). Jelikož základní myšlenkou a hlavní výhodou SRS je naučit co nejvíce materiálu s co nejmenším možným úsilím, našel si software postupem času spoustu příznivců nejen z řad studentů cizího jazyka, ale i z jiných odvětví. Procvičování probíhá tak, že program uživateli zobrazí přední stranu kartičky (otázku) a uživatel se snaží vybavit si odpověď. Poté si nechá zobrazit zadní stranu kartičky (odpověď) a oznámkuje svou schopnost informaci si vybavit – zda ji úplně zapomněl, udělal malou chybu, pamatoval si ji dobře atd. Jelikož se paměť s každým úspěšným vybavením upevňuje, prodlužuje se i doba mezi jednotlivými opakováními (viz Graf 3 – Znázornění výpočtu optimálního intervalu pro opakování). Kartička se tedy po úspěšném vybavení nejdříve zobrazí za 24 hodin, poté za tři dny, následují týdny, měsíce, roky a tak dále. Nové a neúspěšně zodpovězené kartičky se v daný den zobrazují do té doby, než je uživatel ohodnotí jako zapamatované. Cílem každého sezení je dosáhnout toho, že se informace přesune do dlouhodobé paměti. Výpočet optimálního intervalu pro zopakování kartičky je postaven na dvou kritériích:
24
1. Interval by měl být co nejdelší, aby se zajistila co nejmenší frekvence opakování a aby se využil tzv. spacing effect, který říká, že čím delší je prodleva mezi opakováními (až do jistého limitu), tím silnější bude paměťová stopa (26). Časté opakování je nejen ztrátou času, ale může také bránit upevňování nových informací v paměti (2). 2. Interval by měl být dostatečně krátký, aby se zajistilo, že uživatel si bude informaci stále pamatovat (26). Díky matematickému modelu křivky zapomínání, dokáží SRS vypočítat optimální datum pro zopakování kartičky vyhovující zmíněným kritériím. Většinou jsou SRS nastaveny tak, aby kartičku zobrazily, když je šance na vybavení mezi 80 a 90 procenty (26), nikdy však dříve než za jeden den, jelikož konsolidace je silně ovlivněna spánkem.
Graf 3 – Znázornění výpočtu optimálního intervalu pro opakování
V závislosti na velikosti kolekce, která v případě slovní zásoby cizího jazyka může být v desítkách tisíc, připadne na každý den určitý počet kartiček k zopakování. V ideálním 25
případě by uživatel měl aplikaci spouštět každý den, čímž se zajistí, že kartičku uvidí opravdu v den, který je pro zopakování optimální. Zároveň se denní dávka udržuje na přijatelné úrovni. Spaced Repetition systémy představují revoluci v tradičních studijních metodách. Díky algoritmům založených na vědeckém výzkumu paměti je možné buď výrazně snížit čas vynaložený na studium, nebo zvýšit množství studijního materiálu (13). Kromě toho dokáží SRS studenty i motivovat tím, že umožňují nastavit si měřitelný cíl (33).
26
4 Srovnání stávajících aplikací V dnešní době, kdy se počítač stal věcí každodenního života, je patrný rozkvět e-learningových nástrojů pro výuku cizích jazyků. Cílem této kapitoly je poskytnout srovnání těch nejznámějších z nich s ohledem na procvičování anglické slovní zásoby, které pomůže definovat klíčové vlastnosti navrhované aplikace.
4.1 Kritéria hodnocení Cílem této kapitoly je definice požadovaných vlastností, které budou sloužit k hodnocení a které by měly přímo vyplývat z poznatků uvedených v teoretické části.
4.1.1 Zohlednění různých typů inteligence První hledisko, které lze pro definování vlastností uplatnit jsou různé druhy inteligence uživatelů, které přímo ovlivňují schopnost učit se. Aplikace by měla prakticky vyhovět třem skupinám s následujícími druhy inteligencí (viz kapitola Typy učení):
Uživatelé s logicko-matematickou inteligencí Pro tyto uživatele by měla aplikace předkládat slovíčka systematicky. Uživatelé by také měli mít možnost určit, kolik nových slovíček za den se chtějí naučit.
Uživatelé se zvukově-hudební inteligencí Aplikace by měla ke každému slovíčku připojit zvukovou nahrávku s výslovností. Uživatelé by také měli mít možnost vytvořit ukázkovou větu s rýmem.
Uživatelé s vizuálně-prostorovou inteligencí Uživatelé by měli mít možnost si ke slovíčkům přidat odpovídající obrázek, eventuálně upravit barevnost písma na kartičce.
Zbylým čtyřem druhům inteligence buď nelze v rámci aplikace implementovat (tělesněpohybová a interpersonální inteligence), anebo jsou přímo s e-learningovými nástroji spjaté (intrapersonální a jazykově-verbální inteligence).
4.1.2 Využití techniky Spaced Repetition Aby se student dokázal plynule dorozumět, je potřeba dlouhodobě znát a relativně rychle si umět vybavit mezi 10 000 a 20 000 slovy (32). I z tohoto důvodu je při rozšiřování cizojazyčné slovní zásoby důležité mít systém, který je zpravidla založen na opakování. 27
Klasický způsob, jenž je velmi rozšířený, spočívá v zapisování neznámých slov do sešitu, který slouží i k opakování. Časová náročnost tohoto řešení začne být zřetelná při dosažení přibližně tisíce položek. Pokud opakováním jednoho slovíčka člověk stráví čtyři sekundy, stráví každý den jen nad opakováním více než hodinu. Proto je žádoucí, aby aplikace využívala techniku Spaced Repetition, která dokáže časovou náročnost a zapomínání při správném použití řešit.
4.1.3 Dostatečné informace o slovech Aplikace by měla respektovat specifika spojená s rozšiřováním slovní zásoby. Ve většině případů nestačí pro plnohodnotné porozumění cizího slova používat jen překlad do rodného jazyka, tak, jako je naznačeno v Tabulka 2 – Jednoduchá ukázka kartiček pro výuku cizího slova. McCarthy uvádí, že student by se u každého slova měl ideálně naučit (34):
Výslovnost Výslovnost je první věc, kterou si ostatní lidé při komunikaci všimnou, a může vést k neporozumění. Informace o výslovnosti by měla být uživateli zprostředkována buď zvukovou nahrávkou, nebo fonetickým přepisem.
Význam Nejlepším způsobem, jak poskytnout uživateli informaci o významu, by měla být definice z jednojazyčného slovníku eventuálně doplněná o překlad. Samotný překlad bez definice je nedostatečný, jelikož mnohdy nereflektuje konotace daného slova.
Použití K zapamatování správného použití (syntaktického vzoru) a častých spojení daného slova nejlépe slouží příkladové věty, díky kterým si také uživatel zvyká na větnou skladbu anglických vět obecně a které ujišťují uživatele o správném pochopení významu (35). Z tohoto pohledu je příkladová věta stejně důležitá (ne-li důležitější), jako slovníková definice. Pokud navíc uživatel větu upraví a zakomponuje do ní i emotivní složku, bude si slovo pamatovat daleko snáze (25).
Synonyma Informace o synonymech může být v SRS zvláště důležitá pro hodnocení kartiček, 28
jejichž přední strana obsahuje definici nebo překlad a ptá se na anglické slovo. Pokud si uživatel místo požadovaného slova vybaví jeho synonymum, měl by mít možnost se oznámkovat dobrou známkou. Například: Přední strana kartičky:
Zadní strana kartičky:
Give a word with meaning:
Invaluable ale také:
„Extremely useful“ (nenahraditelný)
indispensable, crucial, critical, key, vital
Tabulka 3 – Příklad kartičky obsahující synonyma
4.1.4 Výběr vlastních slov Studenti cizího jazyka by měli mít možnost vytvořit si v aplikaci kolekci vlastních slov. Tuto možnost sice ocení spíše pokročilí studenti, nicméně i pro začátečníky může být využívání předpřipravených kolekcí nedostatečné. Problém tkví hlavně v kvalitní selekci slov, která by měla vyhovovat několika kritériím: úrovni a potřebám studenta, frekvenci použití, kulturním faktorům a prospěšnosti (36). Navíc to, že si uživatel bude moci slovíčka vkládat sám, zajistí, že bude mít vždy přehled o kontextu, což vede k lepšímu porozumění. Na druhou stranu nespornou výhodou hotových kolekcí jsou téměř nulové nároky na čas. I přes to je ale lepším řešením využívat kolekcí vlastních. Tuto skutečnost by měli aplikace zohledňovat a poskytnout uživatelům nástroje, které by přidávání vlastních slov co nejvíce ulehčily. Nabízí se například automatické dohledávání výslovnosti, definice, překladů, ukázkových vět a synonym.
4.1.5 Možnosti použití Další sledované kritérium se týká možnosti použití aplikace na různých zařízeních (počítač, telefon nebo tablet) a různých operačních systémech. Uživatel by měl možnost studovat kdykoliv a kdekoliv. Webové aplikace v tomto ohledu přináší nespornou výhodu, jelikož prohlížeč internetu je dostupný na všech moderních zařízeních a je nedílnou součástí téměř všech operačních systémů. Nevýhodou sice zůstává nutnost neustálého internetového připojení, dnešní doba ovšem přináší dostatečně velké pokrytí mobilním internetem za přijatelnou cenu. V ideálním případě by aplikace měla mít jak webovou verzi, tak i klientské verze, které by spolu byli navzájem synchronizované.
29
4.1.6 Použitelnost a design Kromě zmiňovaných funkcionalit poskytne hodnocení i komentář na použitelnost jednotlivých
aplikací,
která
souvisí
s jednoduchostí,
elegantností
a efektivitou
uživatelského rozhraní (37). Stejně jako další nefunkční požadavky nemůže být použitelnost měřena přímo a nikdy nebude zcela objektivní (37). Aplikace se pokusím hodnotit z pozice uživatelů s alespoň mírně pokročilou úrovní anglického jazyka a se zkušeností s e-learningovým softwarem.
4.2 Srovnávané aplikace Při výběru aplikací byla uplatněna dvě hlediska. První bylo celosvětové rozšíření a renomé, a druhým bylo hledisko lokální, jelikož bude aplikace zaměřena převážně na české uživatele.
4.2.1 SuperMemo Jak již bylo zmíněno, SuperMemo byla první aplikace, která využívala techniku Spaced Repetition. Vývoj začal v polovině osmdesátých let minulého století a poslední verze z roku 2013 má číslo 16 (38). V každé verzi se mimo jiného dočkal aktualizace i algoritmus pro výpočet optimálního intervalu. SuperMemo je systém univerzální a není omezen pouze pro výuku slovní zásoby, proto umožňuje uživatelům si na strany kartičky vložit jakýkoliv obsah (kromě textu i obrázky, zvuk a dokonce i video). Umožňuje také importovat hotové kolekce. Uživatelům, kteří si chtějí slovíčka přidávat ručně, nenabízí žádný nástroj pro rychlé vytvoření kartiček s dodatečnými informacemi o slově. SuperMemo existuje v desktopové verzi pro Windows, v mobilní verzi pro iOS a Android a také ve webové verzi. Synchronizace je však možná pouze mezi verzí mobilní a webovou, které jsou sice zdarma, ale těží z prodeje hotových kolekcí karet. Nejnovější desktopová verze stojí 60 dolarů a obsahuje velké množství funkcí, což může být na úkor použitelnosti (viz Obrázek 3 – Snímek obrazovky aplikace SuperMemo).
30
Obrázek 3 – Snímek obrazovky aplikace SuperMemo
Závěr: Software je vhodný pro pokročilé uživatele, kteří jej kromě studia angličtiny uplatní i v jiných oborech. Hlavní výhodou je využití nejpokročilejších algoritmů. Mezi nevýhody patří nedostatečná synchronizace, chybějící lokalizace, horší použitelnost a cena.
4.2.2 Anki Anki funguje na podobném principu jako SuperMemo a je jeho hlavním konkurentem. Na rozdíl od SuperMemo ovšem používá starší algoritmus SM-2 a umožňuje využití řady rozšíření. Stejně jako SuperMemo samotná aplikace nepodporuje funkci automatického dohledání informací o anglických slovech. Kromě vlastního přidávání si uživatelé mohou stáhnout i hotové kolekce kartiček. Anki existuje v desktopové, mobilní a webové verzi, která slouží pouze k procvičování. Desktopová verze je spustitelná na operačních systémech Windows, Linux a MacOS. Mobilní verze je připravená jak pro iOS, tak i pro Android. Důležitým rozdílem od SuperMemo je, že mezi všemi platformami probíhá plná synchronizace kolekcí, takže uživatel může studovat zároveň na telefonu i na stolním počítači. Anki podporuje šablony a tak mají uživatelé možnost přizpůsobit si vzhled kartiček podle svých potřeb.
31
Obrázek 4 – Snímek obrazovky aplikace Anki
Závěr: Anki lze doporučit i méně zkušeným uživatelům, přesto je pro plné pochopení žádoucí přečíst si manuál aplikace. Hlavní výhody jsou, že je software (kromě iOS verze) zdarma, plně se synchronizuje a je poměrně použitelný. Jedinou nevýhodou Anki je nepřipravenost pro ruční vytváření kolekce kartiček.
4.2.3 EnglishMe! EnglishMe je první čistě webovou a českou aplikací pro procvičování anglické slovní zásoby. Na webových stránkách sice není uvedeno, zda a jaký Spaced Repetition algoritmus aplikace využívá, lze ovšem odhadnout, že se jedná pouze o jednoduchou adaptaci Leitnerova systému. EnglishMe dává k dispozici uživatelům už hotové kolekce kartiček, které obsahují poměrně dostatečné informace o slovech, ale u spousty z nich chybí příkladové věty a synonyma, které uživatel nemá možnost přidat. Vytváření vlastních kolekcí je poměrně problematické, jelikož si do nich uživatel může přidat slovíčka, která už jsou v databázi aplikace. Pokud v databázi slovíčko není, může si jej sice přidat ručně, ale uloží se pouze informace o definici a překladu. Závěr: Výhodou aplikace je schopnost přizpůsobit se šířce displeje různých zařízení a kromě slovíček nabízí i procvičování gramatiky. Systém je ovšem placený a není
32
připravený na vytváření vlastních kolekcí. Přesto jako hlavní nevýhodu spatřuji v nevyužití Spaced Repetition algoritmů.
4.2.4 Slovicka.org Slovicka.org je druhým představitelem českých webových aplikací, která je ale na rozdíl od EnglishMe zdarma. Využitý algoritmus nevyužívá žádné zpětné vazby od uživatele a pouze ukazuje druhou stranu kartičky. Informace o slovech jsou nedostatečné, uživatel má k dispozici pouze slovo a překlad. Je možné vytvářet vlastní lekce s vlastními slovy, ale automatizace není k dispozici. Aplikace není responzivní, a tak ji lze pohodlně využívat pouze na zařízení s velkým displejem. Použitelnost aplikace také nijak neoslní. Závěr: Aplikace je sice zdarma, ale pro studenty anglického jazyka je naprosto nevyhovující.
4.3 Srovnání SuperMemo
Anki
EnglishMe!
Slovicka.org
Ano
Ano
Částečně
Ne
Ano
Ano
Ne
Ne
Záleží na uživateli
Záleží na uživateli
Většinou vyhovující
Jen překlad
Ne
Ne
Jen některá slova
Ne
Win, iOS, Android, Web
Win, Linux, MacOS, iOS, Android, Web
Web (responzivní)
Web (neresponzivní)
Použitelnost a design
4
2
3
4
Dostupnost
Placený
Zdarma
Placený
Zdarma
Zohlednění různých typů inteligence Spaced repetition Informace o slovech Automatické generování kartiček Možnosti použití
Tabulka 4 – Srovnání aplikací pro procvičování anglické slovní zásoby
33
5 Charakteristika aplikace (Analýza) Jak již bylo zmíněno v úvodu, aplikace bude zaměřena především na české studenty anglického jazyka. Hlavním důvodem je, že v současné době na českém internetu chybí aplikace, která by využívala techniku Spaced Repetition a dokázala by dohledávat informace o anglických slovech. Jaké další vlastnosti by měla aplikace mít, bylo naznačeno v kapitole Kritéria hodnocení. Tato kapitola popisuje, jaké dopady budou mít kritéria na návrh aplikace. Ze skutečnosti, že by aplikace měla respektovat různé typy inteligence uživatelů, vyplývá, že ke každému významu slova (kartičce) bude uživatel moci přidat odpovídající obrázek a zvukovou nahrávku, které budou ideálně získávány pomocí dostupných API. Navíc bude možné určit, kolik nových slovíček se uživatel chce denně naučit. Nejdůležitější vlastností aplikace bude využití techniky Spaced Repetition. Konkrétně bude využívat léty prověřený a veřejně dostupný algoritmus SM-2. V současnosti sice existuje už ve verzi SM-15, ovšem od verze SM-3 začal algoritmus využívat zpětné vazby jedné kartičky nejen pro výpočet její doby dalšího opakování, ale i pro karty podobné, což může vést k nekonsistenci algoritmu (13). Pro všechny SRS je důležité každodenní opakování, proto budou uživatelé volitelně upozorňováni o dávkách e-mailem. Další, neméně důležitou vlastností bude možnost vytvářet si vlastní kolekce karet, přičemž aplikace bude pomocí slovníkových API automaticky dohledávat výslovnost, definici, překlady, ukázkové věty a synonyma, aby se zajistilo plnohodnotné porozumění anglického slova. Všechna zmíněná data bude mít uživatel možnost upravit tak, aby se mu lépe pamatovala (to se týká především ukázkových vět, překladů a definic). Z tohoto požadavku také plyne nutnost implementace registrace uživatelů, kteří po přihlášení budou mít ke zmíněným kolekcím přístup. Z dat získaných ze slovníku bude aplikace automaticky generovat samotné kartičky tak, aby vyhovovaly tzv. Minimum Information Principle, který spočívá ve vytváření co nejjednodušších karet. Existují pro to dva důvody. První je, že jednoduché informace se snáze pamatují. Druhým důvodem je skutečnost, že kartičky, které se ptají jen na jednu
34
informaci, se v rámci Spaced Repetition techniky snáze hodnotí. Důležitost tohoto principu je patrná především z dlouhodobého hlediska (25). Příklad špatně formulované kartičky: Co víte o slově accession? Když je sloveso, má tento význam: 1. Record the addition of (a new item) to a library, museum, or other collection: zaevidovat. Each book must be accessioned and the data entered into the computer. Když je podst. jméno, má tyto významy: 1. A new item added to an existing collection of books, paintings, or artefacts: přírůstek. The day-today work of cataloguing new accessions. 2. The attainment or acquisition of a position of rank or power: ujmutí se vlády. The Queen’s accession to the throne. Výslovnost je: /əkˈsɛʃ(ə)n/
Příklad dobře formulovaných kartiček: Each book must be accessioned and the data entered into the computer. Record the addition of (a new item) to a library, museum, or other collection: zaevidovat The day-to-day work of cataloguing new accessions. A new item added to an existing collection of books, paintings, or artefacts: přírůstek The Queen’s accession to the throne. The attainment or acquisition of a position of rank or power: ujmutí se vlády. Výslovnost accession /əkˈsɛʃ(ə)n/
Tabulka 5 – Příklady vyhovujících a nevyhovujících kartiček. Zdroj dat: (39)
Aplikace bude uživatelům poskytovaná z webového serveru a bude využívat technologie HTML, CSS, JavaScript, PHP, MySQL a některé jejich frameworky. Jaké výhody a nevýhody toto řešení přináší, bylo naznačeno v kapitole Možnosti použití. Aby bylo možné webovou aplikaci používat i na zařízeních s menším displejem, bude aplikace responzivní. Dále by aplikace měla být přístupná a použitelná a její design co nejméně rušivý (alespoň co se týče samotného procvičování).
35
6 Návrh Tato kapitola je výsledkem analýzy požadavků a obsahuje logický datový model, popis hlavních operací nad daty, grafický návrh a nakonec detailní popis algoritmu SM-2.
6.1 Spaced Repetition algoritmus Jak již bylo zmíněno, výpočet optimálního intervalu mezi opakováními bude založen na algoritmu SM-2 od průkopníka Spaced Repetition systémů Piotra Wozniaka, který byl vyvinutý již v roce 1989, ale různé SRS (například Anki) jej využívají dodnes. Algoritmus je založený na výpočtu tzv. faktoru snadnosti pro jednotlivé kartičky. Před samotným postupem je nutné popsat jednotlivé pojmy, které se v něm vyskytují (40): EF
Faktor snadnosti, který odráží snadnost zapamatování a uchovávání dané kartičky v paměti
EF'
Nová hodnota EF
I(n)
Počet dní mezi jednotlivými opakováními po n-tém opakování.
q
Zpětná vazba od uživatele Tabulka 6 – Vysvětlení pojmů vyskytujících se v algoritmu SM-2
Kroky algoritmu jsou následující (40): 1. Vytvořit kartičky tak, aby vyhovovaly Minimum Information Principle 2. Každé kartičce přiřaď EF = 2,5 3. Pro první opakování nastav I(1) = 1 Pro druhé opakování nastav I(2) = 6 Pro každé další opakování nastav I(n) = I(n - 1) * EF Pokud počet dní vyjde jako zlomek, pak zaokrouhli na nejbližší celé číslo 4. Po každém opakování zjisti zpětnou vazbu q od uživatele, jejíž škála je 1-5: 5 – perfektní odpověď 4 – správná odpověď po chvíli váhání 3 – správná odpověď s vážnými potížemi na rozpomenutí
36
2 – špatná odpověď, kdy ta správná se po zobrazení zdá být přítomna v paměti 1 – úplné zapomenutí 5. Po zajištění zpětné vazby od uživatele uprav EF podle následujícího vzorce: EF' = EF + (0,1 - (5 - q) * (0,08 + (5 - q) * 0,02)) Pokud EF' vychází menší než 1,3 tak ji dále nezmenšuj 6. Pokud je hodnota zpětné vazby menší než 3, tak nastav počet opakování n = 1 a hodnotu EF neměň (tzn. I(1) = 1 a I(2) = 6 jako kdyby kartička byla nová) 7. V každém sezení opakuj ty kartičky, které byly oznámkovány číslem nižším než 4 do té doby, než budou ohodnoceny alespoň známkou 4 a vyšší. Po dosazení jednotlivých známek ze škály do vzorce pro zjištění nové hodnoty EF' (krok 5) získáme konkrétní změnu oproti původní hodnotě EF:
Známka: EF':
5
4
3
2
1
EF +0,1
EF + 0
EF - 0,14
EF - 0,32
EF - 0,54
Tabulka 7 – Hodnoty EF pro jednotlivé známky
Pro zjednodušení procesu procvičování bude aplikace využívat pouze škálu 1-3. Toto opatření je zavedeno hlavně pro uživatele, kteří dosud se SRS neměli zkušenost a tak detailní sebehodnocení jako využívá SM-2 pro ně může být složité. I pokročilejší uživatelé SRS obvykle využívají pouze dvě odpovědi – umím nebo neumím (13). Proto bude škála následující: 1. Zapomněl jsem – v původním hodnocení bude odpovídat známce 2 2. Umím – v původním hodnocení bude odpovídat známce 4 3. Snadné – v původním hodnocení bude odpovídat známce 5 Další změna se bude týkat nastavení intervalu mezi prvním a druhým opakováním, která je defaultně nastavená na šest dní. Navrhovaná aplikace bude mít interval nastavený na tři dny (stejně jako Anki). Nabízí se však, aby si tento parametr mohl uživatel sám navolit.
37
6.2 Databáze (Datová vrstva) Nyní je k dispozici dostatečné množství informací pro to, aby bylo možné určit jednotlivé funkční celky aplikace (entity) a vztahy mezi nimi. Entitně-relační model je vytvořen pomocí softwaru MySQL Workbench a je vložen do příloh. Entitami databáze budou:
Uživatelé (Users)
Balíčky (Decks)
Slovníková data (Notes)
Kartičky (Cards)
Dávky (Batches)
6.3 Hlavní operace (Aplikační vrstva) Díky analýze a entitně-relačnímu modelu lze nyní definovat také hlavní operace, které se budou v rámci aplikace provádět:
Registrace a přihlášení uživatele
Přidání slovíčka
Editace slovníkových dat
Vytvoření denní dávky
Ohodnocení kartičky
6.4 Grafický návrh (Prezentační vrstva) V tuto chvíli je nutné promyslet i vzhled aplikace a věci, které obecně s ním souvisí. Pro aplikaci byl zvolen název Sršeň. Jedná se o slovní hříčku, kde první tři písmena SRS odkazují na Spaced Repetition Systems a následující EN odkazuje na anglický jazyk. S názvem pak souvisí grafika aplikace – barevnost, logo a tvary. Hlavní barvy budou tvořit odstíny žluté, což nejen odkazuje na barvu sršně, ale také mohou pomáhat při procvičování slovíček. Je prokázáno, že teplé barvy jako je červená, žlutá a oranžová zvyšují naší pozornost. Čím více se soustředíme, tím větší je šance, že se stimul uloží do dlouhodobé paměti (11).
38
Použité tvary vychází ze šestiúhelníku, který je typický pro úly hmyzu z čeledi sršňovitých. Logo tvoří do šestiúhelníku stylizovaná hlava sršně. Při návrhu jsem se snažil o co největší jednoduchost, aby byl tvar znatelný i zmenšený.
Obrázek 5 – Černobílá varianta loga aplikace
Jako hlavní písmo aplikace bylo zvoleno Source Sans Pro, které bylo vytvořené společností Adobe a je primárně určeno jako písmo pro uživatelská rozhraní. Poskytuje dostatečnou čitelnost jak pro nadpisy, tak i pro text, podporuje velké množství jazyků a je dostupné ve dvanácti řezech (58). Grafický návrh byl společně s logem vytvořen softwarem Adobe Illustrator a Adobe Photoshop a je vložen do příloh bakalářské práce. Na domovské stránce je kladen důraz na vysvětlení principu aplikace a snaží se uživatele nalákat k registraci. Po přihlášení je design o poznání jednodušší, aby uživatele nerušil a on se mohl na procvičování plně soustředit.
39
7 Implementace Tato kapitola pojednává o samotné realizaci projektu. Poskytne komentář na vlastní programování, hledisko architektury a technologie. Jako podklady poslouží poznatky uvedené v předchozí části práce. Aplikace je napsaná ve skriptovacím jazyce PHP, který od páté verze podporuje objektově orientované programování. Důvodem pro toto rozhodnutí je jeho rozšířenost, dostupnost a kvalitní dokumentace. Ovšem jako jakýkoliv jiný jazyk, PHP má i své nevýhody, jmenujme například proslulé nekonzistentní pojmenování funkcí.
7.1 MVC architektura Softwarová architektura, na které je aplikace postavená, se nazývá Model-View-Controller (MVC) a vznikla z potřeby oddělit u aplikací s grafickým rozhraním kód obsluhy (controller) od kódu aplikační logiky (model) a od kódu zobrazujícího data (view). Tím jednak aplikaci zpřehledňuje, usnadňuje budoucí vývoj a umožňuje testování jednotlivých části zvlášť (43). Ačkoliv byla architektura původně vyvinuta pro desktopové aplikace, v současné době se koncept MVC užívá především jako architektura aplikací webových (44). Existuje několik desítek webových frameworků, které z této architektury vzešly. Kromě populárního PHP jsou tyto frameworky napsané i v Ruby, Pythonu nebo Javě.
Obrázek 6 – Schéma fungování architektury MVC
40
7.1.1 Nette framework Dále aplikace využívá framework, konkrétně jsem zvolil české Nette. Mezi jeho přednosti patří: kvalitní ladící nástroje, které samotné PHP postrádá, aktivní česká komunita, ochrana proti XSS 1 , open-source licence, široká nabídka doplňků a rozšíření, využití moderních technologií jako je například AJAX, a nakonec právě architekturu MVP (ModelView-Presenter), která vychází ze zmiňovaného MVC. Dle nezávislého testu, který uskutečnil server Root.cz, se jedná o jeden z nejrychlejších PHP frameworků vůbec (45). Následující graf srovnává rychlost jednotlivých frameworků s vypnutým a zapnutým nástrojem eAccelerator, což je rozšíření, které vylepšuje výkon aplikací napsaných v jazyce PHP (53).
Obrázek 7 – Porovnání rychlostí jednotlivých PHP frameworků (45)
Ačkoliv ve využití frameworku Nette převažují pozitiva, narazil jsem při vývoji na nevýhodu, kterou je ne vždy dostačující a často i neaktuální dokumentace. Využití frameworku může být problematické i z hlediska bezpečnosti, jelikož se jedná o veřejně dostupný kód, což může usnadnit jeho napadení. Z toho pro vývojáře vyplývá povinnost neustále provádět aktualizace.
1
XSS (Cross-Site Scripting) je metoda narušení webových stránek zneužívající neošetřených výstupů.
41
7.2 Datová vrstva (Model) Jako databázový systém aplikace využívá MySQL. Důvody pro tuto volbu jsou podobné jako pro PHP, tedy rozšíření a snadná implementace. Právě MySQL spolu s PHP, Apache a Linuxem tvoří oblíbenou a často nasazovanou kombinaci pro webový server LAMP. Aplikace obsahuje několik modelových tříd, které obsluhují MySQL databázi a tvoří funkční základ celé aplikace. Jakákoliv akce uživatele představuje akci modelu, přičemž model o existenci view nebo kontroleru neví (43). Zjednodušeně lze říci, že každá třída obsluhuje víceméně jednu entitu databáze. Konkrétně se jedná o následujících pět tříd:
UserManager: Třída, která se stará o registraci a autentizaci uživatelů.
SettingsManager: Třída, která se stará o nastavení uživatelů.
NoteManager: Třída, která se stará o zpracování a uložení slovníkových dat.
CardManager: Třída, která se stará o vytváření, mazání a hodnocení kartiček.
BatchManager: Třída, která se stará o vytváření denních dávek a procvičování.
V Nette frameworku existují dva základní způsoby, jak obsluhovat databázi. První je stejný jako v rozhraní PDO (PHP Data Objects), tedy předání SQL dotazu metodě query(). Druhý způsob spočívá v řetězení dílčích operací nad metodou table() pomocí tzv. fluent interface. Následující příkazy slouží k získání aktuální kartičky k procvičování z dávky a jsou ekvivalentní: $this->database->query('SELECT * FROM batch WHERE Card_Heteronym_User_idUser=? ORDER BY position ASC LIMIT 1', $uid)->fetchAll(); $this->database->table('batch') ->where('Card_Heteronym_User_idUser', $uid) ->order('position')->limit(1)->fetchAll();
7.2.1 Změny databáze oproti návrhu Během implementace bylo nutné několikrát upravit databázové schéma z návrhu. Jednalo se o změny atributů (nejčastěji kvůli nedostatečné délce) a přidání atributů nových. Také bylo potřeba rozdělit entitu notes obsahující slovníková data každého významu daného slova na entity homonyms a heteronyms. Hlavním důvodem byla redundance dat (většina 42
významů sdílí výslovnost, hláskování a slovní druh) a druhým byl fakt, že pro různé typy kartiček je potřeba jen část těchto slovníkových dat. Další změna, která se týkala entit, bylo přidání tabulky translations (slovník), která má vztah M:N s tabulkou homonyms (jednotlivé významy mohou mít několik překladů a překlad může vyhovovat několika významům). Jako zdroj dat posloužil GNU/FDL Anglicko-Český slovník, bylo ovšem nutné upravit zdrojový textový soubor na SQL dotaz a pomocí regulérních výrazů data vyčistit. Uživatelé si navíc mohou pro každý význam přidávat i vlastní překlad, takže se slovník může neustále rozšiřovat. Takto upravený entitně-relační diagram modelu je v přílohách.
7.2.2 Získávání slovníkových dat Jak již bylo zmíněno v charakteristice aplikace, při vytváření vlastní kolekce karet budou uživateli poskytnuta dostatečná data o slovíčku, které nezná a chce se jej naučit. Takovou službu nejlépe poskytují monolingvní slovníky, respektive jejich API. Existuje poměrně velké množství kvalitních online slovníků (například Oxford Dictionaries, Cambridge English Dictionary nebo Longman English Dictionary), ovšem jen několik poskytuje svá webová API volně. Jedním z mála je americký slovník Merriam-Webster, který je do tisíce dotazů za den zcela zdarma, při překročení je vývojář požádán o zaplacení. Aplikace právě toto API využívá. Další výhodou slovníku Merriam-Webster je fakt, že nabízí hned osm různých slovníkových API pro uživatele s různou jazykovou vybaveností. Vzhledem k cílové skupině jsem zvolil Merriam-Webster's Learner's Dictionary with Audio, jelikož je aplikace určena pro české, alespoň mírně pokročilé studenty. Slovník sám sebe popisuje jako přelomový, jelikož svým uživatelům poskytuje důkladný a aktualizovaný vhled do anglické slovní zásoby, gramatiky a jazykových zvyklostí. Obsahuje téměř 100 000 anglických slov a frází, dále více než 160 000 ukázkových vět a nakonec 22 000 idiomů, slovních spojení a běžně užívaných frází (52). Zmiňované API poskytuje následující data: definice, ukázkové věty, fonetickou transkripci, zvukovou nahrávku výslovnosti, ilustrace a napovídání slov s podobným hláskováním.
43
Po registraci je možné začít používat zaslaný API klíč. Potřebná data lze získat zadáním URL adresy poskytnuté slovníkem obsahující zmiňovaný klíč a samotné slovo. Server následně vrátí XML soubor (jeho ukázka je na přiloženém CD). Ačkoliv PHP má zabudované knihovny pro operace s XML soubory, při manipulaci s daty mi velmi ulehčil práci nástroj PHP Simple HTML DOM Parser2, který podobně jako jQuery, dokáže velmi snadno hledat data v HTML nebo XML souborech. Zde je jednoduchá ukázka, která demonstruje, jak z XML souboru vybrat všechna homonyma: require_once('libs/simple_html_dom.php'); // načteme knihovnu $xml = file_get_html($urlPath); // vytvoříme DOM z URL $homonyms = $xml->find('entry'); // vybereme požadované prvky
7.2.3 Cron Vzhledem k tomu, že aplikace musí vykonávat periodicky několik operací nezávislých na akci uživatele, bylo zapotřebí databázi automatizovat. K tomu nejlépe slouží plánovač úloh Cron. Každý den je potřeba, aby se uživatelům vytvořily denní dávky, rozeslaly emaily a vynuloval počet nově naučených kartiček. Webhostingy často nepodporují volání skriptů uložených skrytě na serveru, ale umožňují alespoň volat URL adresy. Aby tedy nedocházelo ke spouštění skriptu neoprávněně, kontroluje aplikace, zda je v parametru adresy uvedený patřičný tajný klíč.
7.3 Prezentační vrstva (View) View, tedy pohled, je vrstva aplikace, která má na starost zobrazení výsledku požadavku (43). Obvykle používá nějaký šablonovací systém, přičemž jeden z nejznámějších je Smarty. Nette framework využívá svůj systém Latte. Taková šablona obsahuje nejen tagy HTML, ale i tagy specifické pro tento šablonovací systém, které například umožňují do šablony vkládat proměnné, případně provádět cykly a podmínky (46). Zde je ukázka zdrojového kódu:
Celkem máte ve své kolekci <strong>{$total} kartiček, z nichž <strong>{$old + $new} byste si měli dnes procvičit
2
http://simplehtmldom.sourceforge.net/
44
V ukázce výše jsou klasické HTML tagy ve špičatých závorkách a tagy „šablonovací“ v závorkách složených. Za zmínku stojí také generování odkazů v Nette, kdy se používá tzv. n:makro n:href, jehož hodnotou není URL, jak by tomu bylo v případě atributu href, ale přímo akce presenteru (43). Aplikace využívá nejnovější verzi značkovacího jazyka HTML5 a těží především z přímé podpory přehrávání multimédií v prohlížeči. Uživatel si tak bez použití dalších pluginů může přehrát audio nahrávku výslovnosti. Dále jsou využity některé vlastnosti nejnovější verze kaskádových stylů CSS3. Do třetice je použitý i skriptovací jazyk JavaScript. V dnešní době se bez této trojice technologií málokterá webová aplikace obejde. V aplikaci jsou rovněž využity dva webové fonty. První, v návrhu zmíněný Source Sans Pro, je do stránek vložen pomocí služby Google Fonts. Druhý je Font Awesome, což je ikonový font, který místo klasických znaků obsahuje přes 500 grafických symbolů. Důvodem jeho využití je snaha usnadnit uživatelům průchod webovou aplikací a vylepšit tzv. user experience. Využití ikonových fontů s sebou nese spoustu výhod. Jelikož využívají vektory, můžou být velmi snadno a rychle přizpůsobeny pomocí CSS – velikostí, barvou nebo vraženým stínem.
7.3.1 Bootstrap Při implementaci uživatelské části byl zvolen framework Bootstrap, zastřešující zmiňované technologie HTML, CSS a JavaScript. Bootstrap slouží k vytváření responsivních webových aplikací, což znamená, že webová stránka se automaticky přizpůsobí a vypadá dobře na jakémkoliv zařízení od chytrých telefonů po širokoúhlé monitory. Bootstrap je také kompatibilní se všemi moderními prohlížeči, čímž urychluje a ulehčuje vývoj. Responsivnost je v Bootstrapu řešena pomocí tzv. plovoucí mřížky, která má 12 sloupců a libovolný počet řádků. Pro každý prvek se pak určí, jak velkou část daného řádku má zabírat. Tato šířka se udává v počtu sloupců a může být pro různá zařízení odlišná. V Bootstrapu se rozlišují celkem čtyři různé druhy zařízení (48):
Extra small (<768px) pro telefony má zkratku xs
Small (≥768px) pro tablety má zkratku sm
Medium (≥992px) pro notebooky má zkratku md 45
Large (≥1200px) pro velké monitory má zkratku lg
Pokud například chceme, aby prvek zabíral čtvrtinu šířky řádku pro velké displeje a polovinu pro malé, můžeme napsat následující kód:
Dále je důležité nezapomenout na vložení „responzivního“ meta-tagu do hlavičky stránky, který zajišťuje správné vykreslování na různých zařízeních: <meta
name="viewport"
content="width=device-width,
initial-
scale=1, user-scalable=no">
Tato informace webovému prohlížeči říká, aby jako šířku stránky použil skutečnou šířku displeje konkrétního zařízení a ne předdefinovanou hodnotu v CSS. Dále je také možné nastavit, aby nebylo možné stránku na mobilních zařízeních dále přibližovat pomocí zápisu user-scalable = no. Bootstrap také obsahuje předem nastylované HTML prvky od nadpisů, přes tlačítka až po drobečkovou navigaci 3 . Vzhled lze ovšem velice rychle a snadno změnit pomocí dynamického jazyka pro tvorby kaskádových stylů LESS, který rozšiřuje CSS o prvky jako jsou proměnné, mixiny4, výpočty a funkce. LESS může běžet jak na klientské straně, tak na straně serveru (47). V praxi to znamená, že framework Bootstrap obsahuje soubor variables.less, který v sobě má všechny proměnné (například barvy, velikost písma atp.) Stačí tedy modifikovat pouze tento soubor a následně si nechat vygenerovat nový soubor CSS, který se následně vloží do webových stránek. Zde je ukázka: @niceblue: #1e8ee4; // proměnná s barvou @font-size-base: 18px; // proměnná s velikostí písma h1 {color: @niceblue; font-size: @font-size-base} // aplikace
3
Navigace znázorňující pozici aktuální stránky v hierarchii webu. Např.: Úvod > Slovíčka > Breadcrumb
4
Mixiny umožňují vložit všechny CSS vlastnosti třídy do jiné třídy, a to jednoduše specifikací jejího názvu uvnitř jiné třídy (57).
46
Následné použití Bootstrap frameworku by se dalo shrnout tak, že se do webových stránek vloží CSS a JavaScript soubor a poté se jen jednotlivým HTML prvkům přiřazují správné třídy podle dokumentace, která je dostupná na webových stránkách frameworku.
7.3.2 JavaScript Aplikace na několika místech využívá JavaScript a některé jeho knihovny. Jeden z příkladů je validace na straně klienta, kdy JavaScript v aplikaci předchází dotazům, které by server zbytečně zatěžovaly. V aplikaci jsou využity validační skripty pro formuláře, které jsou poskytovány přímo frameworkem Nette. V presenteru lze velmi snadno nastavit, jaká validační pravidla chceme pro daný formulářový prvek nastavit. Například: $form->addPassword('password') ->setRequired() ->addRule(Form::MIN_LENGTH,'Heslo musí mít min. %d znaků',6);
Kód výše přidá do formuláře pole pro heslo, nastaví ho jako povinné a požaduje po uživateli, aby heslo bylo alespoň šest znaků dlouhé. Validační pravidla se na stranu JavaScriptu přenášejí v HTML atributech data-nette-rules, které obsahují JSON popisující jednotlivá pravidla nebo podmínky. Samotnou validaci pak provádí skript, který odchytí událost odeslání formuláře, projde jednotlivé prvky a vykoná příslušnou validaci (49). V aplikaci je také použita populární knihovna jQuery, která práci s JavaScriptem velmi usnadňuje. Její konkrétní využití se týkalo různých efektů, animací, AJAX a výběru DOM elementů. Následující kód ukazuje, co se stane po stisknutí tlačítka „Zobrazit odpověď“ při procvičování: $('#showAnswer').click(function () { $(this).fadeOut(); // skryje tlačítko $("#answer, #feedback").fadeIn(); // zobrazí odpověď $("#ok").focus(); // nastaví známku 2 jako aktivní });
Následující tři JavaScriptové knihovny mají, na rozdíl od jQuery, celkem specifické použití. Po přihlášení se uživatelům zobrazuje stránka se statistikami o kartičkách a jejich studiu. 47
Právě v této části byla použita knihovna Chart.js5, která po předání patřičných dat vykreslí do HTML tagu canvas responsivní koláčový graf. Kromě tohoto typu grafu, lze pomocí knihovny vytvářet i pět jiných typů. Další knihovnou je jQuery Hotkeys 6 , která usnadňuje vytváření klávesových zkratek v prostředí webových aplikací. Toho je využito v procvičování, kde uživatel může velmi snadno a rychle zobrazit druhou stranu kartičky pomocí mezerníku nebo enteru a oznámkovat se klávesami 1, 2 nebo 3 podle toho jak správná či špatná jeho odpověď byla. Tato funkcionalita sice může být realizována i v nativním HTML pomocí vlastnosti accesskey, problém ovšem je, že různé prohlížeče a různé operační systémy často vyžadují odlišné inicializační klávesy (50). Poslední knihovnou, která byla v aplikaci využita je Summernote.js7, která je svými tvůrci označována jako „velmi jednoduchý WYSIWYG editor pro Bootstrap“ (51). Tento editor je dostupný uživatelům jak při přidávání nových významů, tak při jejich editaci. Především těm, kteří mají vizuálně-prostorovou inteligenci, umožňuje formátovat různé části ukázkových vět tak, aby si je mohli lépe zapamatovat.
7.4 Aplikační vrstva (Controller) Controller, neboli presenter v řeči Nette, je řadič, který zpracovává požadavky uživatele a na jejich základě pak volá patřičnou aplikační logiku (například požádá model o data) a poté požádá view o vykreslení dat (šabloně získaná data předá). Odpovědí na požadavek (nejčastěji HTTP požadavek) nemusí být jen HTML stránka, může se jednat o XML dokument, přesměrování, jednoduše cokoliv, co vývojář potřebuje (43). Například pokud uživatel do prohlížeče zadá adresu http://srs-en.cz/aplikace/studuj, Nette z adresy pochopí, že má zavolat presenter Aplikace a akci Studuj. Pokud chceme na tento požadavek vykreslit data, nadefinujeme metodu renderStuduj(). Právě metody začínající na render předají do šablony odpovídající data. V tomto případě se bude jednat o zobrazení aktuální karty v balíčku, kterou si má uživatel procvičit. Metodám lze skrze
5
http://www.chartjs.org/ https://github.com/jeresig/jquery.hotkeys 7 http://summernote.org/ 6
48
URL adresu předat i parametry, které se v metodách zpracovávají jako parametry dané vykreslovací metody: renderKarticka($id). Aplikace je postavená na celkem pěti presenterech:
AplikacePresenter: Jádro samotné webové aplikace, obsahuje pohledy, které uživatel má k dispozici po přihlášení. o Default: Pohled, který šabloně předá data o statistice. o Studuj: Pohled, který šabloně předá data aktuální kartičky k procvičení. o Prohlizec: Vytvoří komponentu, která slouží k prohlížení kartiček v kolekci. o Karticka: Získá data o kartičce a vytvoří formulář pro její editaci. o Pridat: Pohled, který slouží k přidávání nových kartiček do kolekce. o Nastaveni: Pohled, který vytváří formuláře pro uživatelská nastavení.
BasePresenter: Jak již název napovídá, jedná se o presenter, od kterého mohou a nemusí dědit další presentery.
ErrorPresenter: Presenter, který slouží k vypisování chyb.
HomepagePresenter: Presenter související s domovskou stránkou aplikace. Vytváří formulář pro registraci uživatelů a volá úlohy nad databází zmíněné v kapitole Cron.
KontaktPresenter: Slouží k vytváření kontaktního formuláře a odesílání e-mailů.
PrihlaseniPresenter: Slouží k vytváření a zpracování přihlašovacího formuláře.
Všechny presentery v aplikaci by měly tvořit hierarchii. Přinejmenším by měli mít společného předka (v aplikaci tuto funkci zastává BasePresenter). Díky tomu se vyhýbáme opakování stejného kódu na více místech aplikace. Společný předek může například v metodě startup() zajistit připojení k modelu nebo zkontrolovat uživatelská oprávnění (54).
7.5 Shrnutí Použití představených technologií se ve výsledku ukázalo jako velmi efektivní oproti vývoji základními technologiemi v tom smyslu, že vedly k rychlejšímu a kvalitnějšímu vývoji. Čas šetří tím, že vývojáři umožňují používat předpřipravené moduly (nemusí takzvaně znovu vynalézat kolo) a může se soustředit na důležitější části vývoje. Výsledná aplikace by měla 49
být i kvalitnější, jelikož frameworky vedou k čistšímu kódu a kladou důraz na budoucí rozšiřitelnost a udržitelnost.
50
8 Testování a zhodnocení aplikace Po dokončení implementace by každá webová aplikace měla projít procesem testování a ani Sršeň není výjimkou. Obecně se doporučuje testovat následující: korektní vykreslování v různých prohlížečích, zařízeních a operačních systémech, použitelnost, přístupnost, funkčnost, validitu kódu, rychlost a samotný obsah (56). V průběhu celého vývoje byla aplikace testována v nejpoužívanějších webových prohlížečích, tedy v Google Chrome, Firefoxu, a Internet Exploreru. V nejnovějších verzích zmiňovaných prohlížečů funguje aplikace téměř bezchybně (Google Chrome verze 42, Firefox verze 37 a Internet Explorer verze 11), lze ovšem očekávat, že by měla aplikace fungovat i o pár verzí zpět. Možné problémy by mohla způsobovat nedostatečná kompatibilita s moderními technologiemi, které jsou v aplikaci využity. Konkrétně se může jednat o některé vlastnosti CSS3 (transition, media queries, box shadow), některé prvky HTML 5 (audio) a jQuery. Podle informací, které jsou dostupné na serveru caniuse.com a jquery.com nebude aplikace správně fungovat v Internet Exploreru verze 9 a nižší, a v mobilním prohlížeči Opera Mini. Podle nejnovějších statistik se však Internet Explorer ve verzi 7 a nižší téměř nepoužívá a následující dvě verze v České republice používá necelých pět procent uživatelů. U Opery Mini se počet tuzemských uživatelů pohybuje pod jedním procentem (55). V součtu tedy aplikace nebude korektně fungovat přibližně u pěti procent uživatelů, lze však předpokládat, že se bude počet uživatelů, kteří mají prohlížeč podporující moderní technologie, postupem času zvyšovat. Kromě různých webových prohlížečů byla aplikace také testována na různých zařízeních, aby se zjistilo, zda webové stránky správně reagují na různou šířku displeje, tj. zda jsou responsivní. Toto testování bylo prováděno na pěti různých zařízeních: na monitoru s HD rozlišením 1920×1080, na monitoru notebooku s rozlišením 1280×768, na tabletu iPad Air 2 s retina displejem, chytrých telefonech iPhone 4S a Nexus 4. Na všech zmiňovaných zařízeních se aplikace vykresluje, až na některá místa (např. prohlížeč kartiček) správně. Co se týče operačních systémů, testování pro desktopová zařízení proběhlo pro operační systémy Windows 7 a Windows 8.1 a pro mobilní zařízení pro operační systémy 51
iOS 8 a Android Lollipop. Existují tři základní problémy, které se mohou v souvislosti s operačními systémy objevit: různé vykreslování fontů a kerningu, různé vykreslení formulářových prvků a problémy s pluginy (57). Na žádný z problémů jsem ovšem nenarazil, jelikož aplikace využívá webový font třetí strany a Bootstrap, který různé vykreslování formulářových prvků eliminuje. Také není závislá na zásuvných modulech prohlížeče. Aplikace bohužel není schopna vyhovět všem pravidlům přístupnosti, jelikož zcela přístupný web by měl být použitelný i bez stylů a JavaScriptu (58). Na druhou stranu se zobrazuje správně v naprosté většině prohlížečů a na různých zařízeních. Navíc je použitelný i bez obrázků a písmo lze libovolně zvětšovat. S přístupností souvisí i validita kódu. V případě HTML je v souladu s požadavky W3C. CSS kód bohužel validní není, například kvůli prefixům –moz a -webkit. Důvodem je různé vykreslování prohlížečů, které nevalidní CSS vlastnosti řeší. Z praktického hlediska je ovšem validní HTML důležitější než CSS, jelikož nese samotný obsah. Například různé pomůcky pro nevidomé jsou vyloženě závislé na standardizovaném a dobře strukturovaném kódu. Rychlost aplikace byla měřena nástrojem PageSpeed od společnosti Google, který dokáže analyzovat webovou stránku a navrhnout řešení pro její zrychlení. V testech dosahovala aplikace hodnocení kolem 90 bodů ze 100. K dosažení plného skóre nástroj radil minifikovat CSS a JavaScript kód, aktivovat kompresi na straně serveru aj. Zrychlení by zasloužil i proces procvičování. Jednou z cest by mohlo být přednačítání dalších kartiček v denní dávce pomocí technologie AJAX ještě před tím, než uživatel ohodnotí aktuální kartičku. Pro zjištění použitelnosti, dostatečné funkčnosti a srozumitelného obsahu jsem poprosil pět spolužáků s převážně anglickým jazykem v oborové kombinaci o otestování aplikace. Bez jakýchkoliv instrukcí se dokázali sami registrovat, přidat si do kolekce nová slovíčka a začít si je procvičovat. Z hlediska použitelnosti a obsahu by tedy aplikace měla být dostačující, ačkoliv by pro takové tvrzení mělo proběhnout řádné uživatelské testování. Co se týče funkčnosti, získal jsem od spolužáků několik cenných připomínek, které by bylo možné do aplikace implementovat, a povýšily by ji o řád výše:
52
Napojení na službu Google Translate (nebo jakoukoliv jinou službu, která umožňuje uživatelům rychle ukládat neznámá slovíčka napříč zařízeními)
Implementovat API i britského slovníku, jelikož Merriam Webster poskytuje zpravidla americkou výslovnost a nedává informaci o synonymech
Nastavení hodiny nebo aspoň denní doby (ráno, poledne, večer) pro notifikační e-maily
Zobrazovat pole pro vyhledávání slovíček i u výběru jednotlivých významů (uživateli se nemusí žádný z významů líbit)
Obrátit postup u výběru významů, tj. zaškrtávat významy, které chce uživatel umět a ne odškrtávat ty, které se mu nehodí (pokročilí studenti často hledají jeden konkrétní význam)
Podle zpětné vazby při procvičování zobrazovat, kolik kartiček uživatel zapomněl a kolik si jich pamatoval
Já sám bych chtěl aplikaci do budoucna obohatit o následující funkcionality: vytvořit administraci pro nově vznikající překlady, umožnit uživatelům export dat (například ve formátu pro Anki), resetovat si zapomenuté heslo, přihlásit se přes Google nebo Facebook a možnost zrušit si účet. Celkově byla aplikace mezi spolužáky přijata dobře. Líbil se především design, intuitivní prostředí, napovídání slov při překlepu, automatické vyplňování definice, statistiky na úvodní stránce, možnost studovat na cestách v telefonu díky responsivnímu designu a klávesové zkratky.
53
9 Závěr Cílem této bakalářské práce bylo vytvoření funkčního prototypu aplikace, která bude pomáhat českým studentům s rozšiřováním anglické slovní zásoby a bude založená na přelomové e-learningové technice Spaced Repetition. Webová aplikace je v současnosti dostupná na adrese www.srs-en.cz a uživatelům je poskytována zcela zdarma. Teoretická část měla za úkol představit teoretický základ z oblasti učení a paměti. Samostatnou kapitolu v této části měla i zmiňovaná technika Spaced Repetition, jakožto hlavní charakteristika, která aplikaci odlišuje od ostatních českých webových aplikací sloužících k procvičování anglické slovní zásoby. Při vytváření aplikace jsem zvolil doporučovaný postup analýza–návrh–implementace– testování. Jako podklady pro počáteční analýzu mi posloužily informace z teoretické části. Dalším důležitým zdrojem pro analýzu bylo srovnání současných e-learningových aplikací včetně specifik slovní zásoby. Na základě provedené analýzy vzešel návrh, který dal dostatečné základy pro samotnou implementaci aplikace. Výsledné uživatelské testování přineslo několik podnětných požadavků na možné budoucí rozšíření. V teoretické části této bakalářské práce jsem si rozšířil obzory v oblasti lidské paměti a učení. V praktické části jsem uplatnil své znalosti webových technologií a jejich frameworků. Doufám, že navržená aplikace bude pro uživatele použitelná a bude jim v budoucnu efektivně pomáhat s anglickým jazykem. Přinejmenším může sloužit jako odrazový můstek do vod Spaced Repetition systémů. V rozvoji aplikace mám určitě v plánu dál pokračovat. Z toho důvodu je v patičce webových stránek umístěn odkaz na kontaktní formulář pro sdělení případných připomínek k aplikaci.
54
Seznam použitých informačních zdrojů 1.
Leitner system. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2014 [cit. 2015-02-13]. Dostupné z: http://en.wikipedia.org/wiki/Leitner_system
2.
WOZNIAK, Piotr. Memory and Learning: Myths and Facts. SuperMemo [online]. 2003 [cit. 2015-02-13]. Dostupné z: http://www.supermemo.com/articles/myths.htm
3.
Paměť a učení. Katedra psychologie Filozofické fakulty Univerzity Karlovy v Praze [online]. 2009 [cit. 2015-02-13]. Dostupné z: http://psychologie.ff.cuni.cz/studium/prf/pamet.pdf
4.
STUCHLÍK, Aleš. Experimentální studium učení a paměti. Fyziologický ústav AV ČR: oddělení Neurofyziologie paměti [online]. 2010 [cit. 2015-02-13]. Dostupné z: http://industry.biomed.cas.cz/332/www332_CZ/dokumenty/PGS.pdf
5.
Učební typy. Metodický portál RVP [online]. 2011 [cit. 2015-02-13]. Dostupné z: wiki.rvp.cz/Knihovna/1.Pedagogicky_lexikon/U/U%C4%8Debn%C3%AD_typ
6.
GARDNER, Howard. Frames of mind: the theory of multiple intelligences. 10th anniversary ed. New York, NY: BasicBooks, c1993, xxxii, 440 p. ISBN 04-650-2510-2.
7.
Overview of Learning Styles. Learning Styles [online]. 2014 [cit. 2015-02-13]. Dostupné z: http://learning-styles-online.com/overview/
8.
RANPURA, Ashish. How We Remember, and Why We Forget. Brain Connection [online]. 2013 [cit. 2015-02-13]. Dostupné z: http://brainconnection.brainhq.com/2013/03/12/how-we-remember-and-whywe-forget/
9.
MORRIS, R. G. M. Episodic-like memory in animals: psychological criteria, neural mechanisms and the value of episodic-like tasks to investigate animal models of neurodegenerative disease. Philosophical Transactions of the Royal Society B: Biological Sciences[online]. 200109-29, vol. 356, issue 1413, s. 1453-1465 [cit. 2015-02-16]. DOI: 10.1098/rstb.2001.0945. Dostupné z: http://rstb.royalsocietypublishing.org/cgi/doi/10.1098/rstb.2001.0945
10. THOMPSON, Richard F a Stephen A MADIGAN. Memory: the key to consciousness. Washington, D.C.: Joseph Henry Press, 2005, vii, 280 p. ISBN 03-095-4949-3. 11. MASTIN, Luke. Memory Recall. The Human Memory [online]. 2010 [cit. 2015-02-16]. Dostupné z: http://www.human-memory.net/processes_recall.html 12. HANUŠOVÁ, Marie, Drahomíra OUDOVÁ a Jiří VOTAVA. Paměť a učení. In: Česká zemědělská univerzita v Praze: Institut vzdělávání a poradenství [online]. 2007 [cit. 2015-02-16]. Dostupné z: http://etext.czu.cz/img/skripta/64/pamet-1.pdf
55
13. ELMES, Damien. Anki 2.0 User Manual. Anki [online]. 2013 [cit. 2015-02-17]. Dostupné z: http://ankisrs.net/docs/manual.html 14. MASTIN, Luke. Sensory Memory. The Human Memory [online]. 2010 [cit. 2015-02-17]. Dostupné z: http://www.human-memory.net/types_sensory.html 15. Millerovo magické číslo. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-17]. Dostupné z: http://cs.wikipedia.org/wiki/Millerovo_magick%C3%A9_%C4%8D%C3%ADslo 16. MASTIN, Luke. Short-Term Memory. The Human Memory [online]. 2010 [cit. 2015-02-17]. Dostupné z: http://www.human-memory.net/types_short.html 17. MASTIN, Luke. Long-Term Memory. The Human Memory [online]. 2010 [cit. 2015-02-17]. Dostupné z: http://www.human-memory.net/types_long.html 18. Paměťový palác. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-17]. Dostupné z: http://cs.wikipedia.org/wiki/Pam%C4%9B%C5%A5ov%C3%BD_pal%C3%A1c 19. SCHACTER, Daniel. The seven sins of memory: Insights from psychology and cognitive neuroscience. American Psychologist. 1999, č. 54. Dostupné z: http://scholar.harvard.edu/files/schacterlab/files/schacter_american_psychologi st_1999.pdf 20. Sedm hříchů paměti. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-19]. Dostupné z: http://cs.wikipedia.org/wiki/Sedm_h%C5%99%C3%ADch%C5%AF_pam%C4%9Bti 21. Hermann Ebbinghaus. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-19]. Dostupné z: http://en.wikipedia.org/wiki/Hermann_Ebbinghaus 22. ROBERTSON, Grant. A Brief History of the Mathematical Definition of Forgetting Curves. Ideationizing [online]. 2009 [cit. 2015-02-19]. Dostupné z: http://www.ideationizing.com/2009/06/brief-history-of-mathematical.html 23. Forgetting curve. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-19]. Dostupné z: http://en.wikipedia.org/wiki/Forgetting_curve 24. WOZNIAK, Piotr. Building memory stability through rehearsal. SuperMemo [online]. 2005 [cit. 2015-02-19]. Dostupné z: http://www.supermemo.com/articles/stability.htm
56
25. WOZNIAK, Piotr. Effective learning: Twenty rules of formulating knowledge. SuperMemo [online]. 1999 [cit. 2015-02-21]. Dostupné z: http://www.supermemo.com/articles/20rules.htm 26. WOZNIAK, Piotr. General principles of SuperMemo. SuperMemo [online]. 2003 [cit. 2015-0222]. Dostupné z: http://www.supermemo.com/english/princip.htm 27. Active recall. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-24]. Dostupné z: http://en.wikipedia.org/wiki/Active_recall 28. SÁNCHEZ, Aquilino a Rosa MANCHÓN. Research on Second Language Vocabulary Acquisition and Learning: An Introduction. International Journal Of English Studies [online]. 2007, 7(2) [cit. 2015-02-28]. Dostupné z: http://digitum.um.es/xmlui/bitstream/10201/2582/1/2595023.pdf 29. Lingua franca. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-02-28]. Dostupné z: http://cs.wikipedia.org/wiki/Lingua_franca 30. Knowledge of English. Language knowledge in EU27 [online]. 2012 [cit. 2015-02-28]. Dostupné z: http://languageknowledge.eu/languages/english 31. NATION, Paul. New Ways in Teaching Vocabulary. Alexandria: TESOL, 1994. ISBN ISBN-0939791-51-X. 32. ZECHMEISTER, Eugene, Andrea CHRONIS, William CULL, Catherine D'ANNA a Noreen HEALY. Growth of a Functionally Important Lexicon. Journal of Reading Behavior [online]. 1995, č. 27 [cit. 2015-02-28]. Dostupné z: http://jlr.sagepub.com/content/27/2/201.full.pdf 33. SZYNALSKI, Tomasz. Introduction to spaced-repetition software (SRS). Antimoon [online]. 2001 [cit. 2015-02-28]. Dostupné z: http://www.antimoon.com/how/supermemo.htm 34. MCCARTHY, Michael a Felicity O'DELL. English vocabulary in use: advanced. 1st pub. Cambridge: Cambridge University Press, 2002, 315 s. ISBN 978-0-521-67746-2-. 35. SZYNALSKI, Tomasz. Example sentences in dictionaries: More important than definitions. Antimoon [online]. 2001 [cit. 2015-02-28]. Dostupné z: http://www.antimoon.com/how/examplesent.htm 36. MATUCHOVÁ, Klára. Working with Words [prezentace]. Praha : Katedra anglického jazyka a literatury, UK, [cit. 2015-03-01].
57
37. Použitelnost. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-03-01]. Dostupné z: http://cs.wikipedia.org/wiki/Pou%C5%BEitelnost 38. WOZNIAK, Piotr. History of SuperMemo. SuperMemo [online]. 2013 [cit. 2015-02-22]. Dostupné z: http://www.supermemo.com/english/history.htm 39. Definition of accession in English from the Oxford dictionary. Oxford Dictionaries [online]. 2015 [cit. 2015-03-07]. Dostupné z: http://www.oxforddictionaries.com/definition/english/accession 40. WOZNIAK, Piotr. Application of a computer to improve the results obtained in working with the SuperMemo method. SuperMemo [online]. 1990 [cit. 2015-02-22]. Dostupné z: http://www.supermemo.com/english/ol/sm2.htm 41. Linguistic Diversity. European Commission [online]. 2015 [cit. 2015-04-13]. Dostupné z: http://ec.europa.eu/languages/policy/linguistic-diversity/index_en.htm 42. Source Sans Pro. ADOBE. Adobe Fonts [online]. 2012 [cit. 2015-04-13]. Dostupné z: https://store1.adobe.com/cfusion/store/html/index.cfm?event=displayFontPack age&code=1959 43. MVC aplikace & presentery. Nette Framework [online]. 2012 [cit. 2015-04-13]. Dostupné z: http://doc.nette.org/cs/2.3/presenters 44. Model–view–controller. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-04-13]. Dostupné z: http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller 45. Velký test PHP frameworků: Zend, Nette, PHP a RoR. DANĚK, Petr. Root.cz [online]. 2008 [cit. 2015-04-13]. Dostupné z: http://www.root.cz/clanky/velky-test-php-frameworku-zend-nette-php-a-ror/ 46. ČÁPKA, David. MVC architektura. ITnetwork.cz [online]. 2013 [cit. 2015-04-13]. Dostupné z: http://www.itnetwork.cz/mvc-architektura-navrhovy-vzor 47. SELLIER, Alexis. Features of the Less language. Less.js [online]. 2014 [cit. 2015-04-13]. Dostupné z: http://lesscss.org/ 48. CSS. Bootstrap [online]. 2015 [cit. 2015-04-16]. Dostupné z: http://getbootstrap.com/css/ 49. Formuláře. Nette Framework [online]. 2015 [cit. 2015-04-16]. Dostupné z: http://doc.nette.org/cs/2.3/forms 50. HTML accesskey Attribute. W3Schools [online]. 2015 [cit. 2015-04-16]. Dostupné z: http://www.w3schools.com/tags/att_global_accesskey.asp
58
51. Summernote. Summernote [online]. 2015 [cit. 2015-04-16]. Dostupné z: http://summernote.org/ 52. Merriam-Webster's Learner's Dictionary with Audio. Merriam-Webster Developer Center [online]. 2015 [cit. 2015-04-17]. Dostupné z: http://www.dictionaryapi.com/products/api-learners-dictionary.htm 53. PHP accelerator. In: Wikipedia: the free encyclopedia [online]. San Francisco (CA): Wikimedia Foundation, 2001- [cit. 2015-04-18]. Dostupné z: http://en.wikipedia.org/wiki/PHP_accelerator 54. GRUDL, David. Návrh struktury presenters/views. PhpFashion [online]. 2008 [cit. 2015-04-18]. Dostupné z: http://phpfashion.com/navrh-struktury-presenters-views 55. Web browsers groups – details. GemiusRanking [online]. 2015 [cit. 2015-04-19]. Dostupné z: http://www.rankings.cz/en/rankings/web-browsers-groups.html 56. Web Design Process - Testing. The University of Texas at Austin [online]. 2006 [cit. 2015-0419]. Dostupné z: https://www.utexas.edu/learn/designprocess/test.html 57. ELLIS, David. How much of an effect can different operating systems have on displaying web pages?. Stack Overflow [online]. 2012 [cit. 2015-04-19]. Dostupné z: http://stackoverflow.com/posts/9855806/revisions 58. Přístupnost a použitelnost. Pěstujeme Web [online]. 2010 [cit. 2015-04-19]. Dostupné z: http://www.pestujemeweb.cz/obsah/ruzne/pristupnost-a-pouzitelnost.php
59
Seznam tabulek, obrázků a grafů Obrázky Obrázek 1 – Schéma vztahu mezi jednotlivými typy paměti podle doby trvání ................. 15 Obrázek 2 – Schéma fungování Leitnerova Systému (1) ..................................................... 24 Obrázek 3 – Snímek obrazovky aplikace SuperMemo ........................................................ 31 Obrázek 4 – Snímek obrazovky aplikace Anki ..................................................................... 32 Obrázek 5 – Černobílá varianta loga aplikace ..................................................................... 39 Obrázek 6 – Schéma fungování architektury MVC .............................................................. 40 Obrázek 7 – Porovnání rychlostí jednotlivých PHP frameworků (45) ................................. 41 Obrázek 8 – Entitně-relační diagram modelu (návrh) ......................................................... 61 Obrázek 9 – Entitně-relační diagram modelu (implementace) ........................................... 61 Obrázek 10 – Grafický návrh úvodní stránky....................................................................... 62 Obrázek 11 – Grafický návrh samotné studijní aplikace se zobrazenou navigací ............... 63
Tabulky Tabulka 1 – Ukázka dvou řad, které je stejně obtížné si zapamatovat ............................... 14 Tabulka 2 – Jednoduchá ukázka kartiček pro výuku cizího slova ........................................ 23 Tabulka 3 – Příklad kartičky obsahující synonyma .............................................................. 29 Tabulka 4 – Srovnání aplikací pro procvičování anglické slovní zásoby .............................. 33 Tabulka 5 – Příklady vyhovujících a nevyhovujících kartiček. Zdroj dat: (39) ..................... 35 Tabulka 6 – Vysvětlení pojmů vyskytujících se v algoritmu SM-2 ....................................... 36 Tabulka 7 – Hodnoty EF pro jednotlivé známky .................................................................. 37
Grafy Graf 1 – Původní Ebbinghausova křivka sestavená z experimentálních hodnot (22) ......... 20 Graf 2 – Exponenciální křivka zapomínání pro S=2 ............................................................. 21 Graf 3 – Znázornění výpočtu optimálního intervalu pro opakování ................................... 25
60
Přílohy
Obrázek 8 – Entitně-relační diagram modelu (návrh)
Obrázek 9 – Entitně-relační diagram modelu (implementace)
61
Obrázek 10 – Grafický návrh úvodní stránky
62
Obrázek 11 – Grafický návrh samotné studijní aplikace se zobrazenou navigací
63
