View
4
Download
0
Category
Preview:
Citation preview
kursuste kujundamine Moodle’is Triin Marandi ja Ly Sõõrd
2017 oktoober
Üldised põhimõtted
2
❖ Lihtsus üle kõige❖ Igal asjal peab olema mõte❖ Harmoonia kaose asemel❖ Kontrastid haaravad tähelepanu❖ Värvidel on tähendus❖ Illustratsioonid mõjuvad ka emotsionaalselt❖ Hierarhia on oluline (vasakult paremale, ülevalt alla, pealkirjad)❖ Kasutatavus erinevates e-vahendites
visual design best practices e-learning
Banner
3
Millist teha?
4
Kui suurt teha?
5
.jpg või .png-formaadis
laius u 700 pikselit
kõrgus 100 - 120 pikselit
Kust leida?
6
1. Flickr Creative Commons http://www.flickr.com/creativecommons
2. Wikimedia Commons http://commons.wikimedia.org/wiki/Main_Page
3. Xpert http://www.nottingham.ac.uk/xpert/attribution
4. Openphoto http://openphoto.net
5. Stockvault http://www.stockvault.net
6. Freemediagoo http://www.freemediagoo.com
7. Getfreeimage http://www.getfreeimage.com
8. Morguefile http://www.morguefile.com
9. Pixabay https://pixabay.com
10. ClipartKid http://clipartkid.com
pildista ise telefoniga!
http://www.flickr.com/creativecommonshttp://commons.wikimedia.org/wiki/Main_Pagehttp://www.nottingham.ac.uk/xpert/attribution/http://openphoto.net/http://www.stockvault.net/http://www.freemediagoo.com/http://www.getfreeimage.com/http://www.morguefile.com/https://pixabay.com/http://clipartkid.com
Millega muuta?
7
1. Pixlr http://pixlr.com/editor2. Fotoflexer http://fotoflexer.com3. iPiccy http://ipiccy.com4. Raamid ja filtrid https://www.tuxpi.com 5. Sõnapilved http://www.wordle.net või https://tagul.com6. Graafikud https://www.onlinecharttool.com 7. Kollaaž https://www.befunky.com 8. PowerPointis või Wordis teha ja Snipping Tooliga või
Print Scrn ja Paintiga salvestada.
http://pixlr.com/editor/http://fotoflexer.com/http://ipiccy.com/https://www.tuxpi.comhttp://www.wordle.net/https://tagul.com/https://www.onlinecharttool.com/https://www.befunky.com
Kuidas lisada?
8
1. Minge muutmisrežiimi2. Klõpsake avalehel kõige ülemisel hammasrattal paremas nurgas
3. Pildi lisamise nupp
4. Valige arvutist pilt, lisage
5. Muutke pildi suurus kohalduvaks
Kuidas muuta pilti kohalduvaks?
9
1. Lülituge html-vaatesse
2. Lisage kood ja asendage seal pildi aadress jm parameetrid:
3. Kustutage üleliigne pilt
Kursuse formaat
10
Kollabeerunud teemad
11
Värvilise taustaga tabel
12
❖ Kursuse avalehel plokk Seadistused ❖ Link Muuda sätteid❖ Kursuse seadete lehel Kursuse formaat ❖ Rippmenüüst vali Kollabeerunud teemad
Sektsioonid
13
Värvilise taustaga ala
14
Värvilise taustaga ala
15
Värvilise taustaga tabel
16
1. Minge muutmisrežiimi2. Klõpsake hammasrattal sektsiooni paremas ülanurgas
3. Klõpsake tabeli nupul
4. Määrake tabeli parameetrid
5. Lisage tabelisse sisu
Värvilise taustaga tabel
17
DIV
18
Stupid and silly people ( Cambridge Dictionary)
1. Minge muutmisrežiimi2. Klõpsake hammasrattal sektsiooni paremas ülanurgas
3. Klõpsake HTML-nupul
4. Lisage sobivate parameetritega
5. Lülituge tavavaatesse (nupp ) ja lisage sisu
DIV
19
Siia läheb teie tekst ja lõigu lõppu
Kõiki parameetreid saate ise koodina muuta:❖ taustavärv - background-color: #eeeeee ❖ piirjoone laius - border: 1px (proovige numbritega 1-10)❖ piirjoone muster - solid (proovige dotted, double, dashed)❖ piirjoone värv - #cccccc❖ piirjoone nurkade ümarus - border-radius: 5px (proovige numbritega 0-10)
Testimiseks: https://www.w3schools.com Värvid: color picker
Stupid and silly people ( Cambridge Dictionary)
https://www.w3schools.com
Eelvormindatud tekst
20
HTML - plokk
21
HTML-ploki sisu
22
HTML-ploki lisamine
23
❖ Pealkirja ei pea lisama❖ Pilt peaks olema kohanduva suurusega
(slaid 9)❖ Sobiv asukoht (paremas või vasakus
servas, sobivas positsioonis)
Õppematerjalid
24
Raamat ja leht
25
Pildi paiknemine
26
Pildi seaded
27
❖ Joondus teksti kõrval❖ Lisatav pilt õige suurusega❖ Vertikaal- ja horisontaalvahe -
teksti kaugus pildist❖ Ääris - pildi piirjoon
Pildi allikale viitamine
28
Viide pildi juures või teksti sees või lehe lõpus.
Allika otsimine: https://tineye.com/
https://tineye.com/
Õppematerjalid SISU@UT-s (https://sisu.ut.ee)
29
https://sisu.ut.ee
Ja ongi kõik ...
30
Recommended