DIME 2011 syksy: kurssisivu

to 29.11.2012 Marraskuun erilliskoe (1 kpl) arvosteltu, pääsi sinnikkyydellä läpi, erilliskokeita ei enää ole, hyvää joulua!
ti 22.5.2012 Elokuun erilliskokeen mahdollisesti puuttuvien portfolioiden palautus viimeistään samana päivänä, kiitos.
pe 27.4.2012 Erilliskokeen 20.4. tulokset.
ti 17.4.2012 Perjantain erilliskoe laadittu, tervetuloa :)
la 11.2.2012 Erilliskokeen tulokset. Mukana myös puuttuneita portfolioita palauttaneet.
ti 31.12.2012 Lisätty viime tipassa infoa erilliskokeesta. Portfoliot vaaditaan, uusijoiden tehtäväpisteet huomioidaan.
to 12.1.2012 Kurssin lopulliset tulokset. Alustavista unohtui tarkistaa onko portfoliot (pakolliset) palautettu. Asianomaisia pyydetään palauttamaan puuttuvat portfoliot seuraavaan erilliskokeeseen eli 3.2. mennessä.
ti 27.12.2011 Julkaistu kurssin alustavat tulokset (kirjaudu laitoksen tunnuksilla). Raportoi jos virheitä, hyvää joulua!
ke 21.12.2011 Julkaistu tentin tarkistuslista (kirjaudu laitoksen tunnuksilla) ja arvosteluperusteet. Tehtäväpisteet ja lopullinen arvostelu ei vielä ehtinyt.
ma 12.12.2011 Oppimispäiväkirjoja voi palauttaa kaikilta viikoilta (eli deadlinet poistettu niiden osalta)
pe 9.12.2011 Hyvien aikojen muistoksi flexbox-standardin yhden kehittäjän mainio artikkeli, joka selvittää miten standardi on muuttunut vuosien varrella. Lainaus: "Multiple authors (including the CSSWG's own chairman!) have been confused by the way box-flex works over the years."
to 8.12.2011

Galleria-v3:n (portfolio 5) näppäimistöselaus siirrettiin 6-viikolle lisätehtäväksi (erillinen tehtävä RAGEtoolissa). Toivomme ettei kukaan droppaa kurssia koska jää jumiin pakolliseen portfolioon.
Siirretty käli-tehtävien deadline perjantaiksi (+1 päivä).

ke 7.12.2011

Kertausluennon mainioon kysymykseen "mitä tehdään palvelimella ja mitä selaimessa" (liian?) syvällinen lisävastaus http://lucumr.pocoo.org/2011/11/15/modern-web-applications-are-here/

ti 6.12.2011

Julkaistu: BOOM-bookmarklet
siirretty 5. viikon av-tehtävät (ja lomake) 6. viikolle
Tentin mukana tulevat liitteet on julkaistu: http://www.cs.helsinki.fi/u/paksula/dime/s11/liitteet.pdf
Julkaistu viikon 6 tehtävät ja on RAGEtoolissa

ma 5.12.2011

Kaikkien portfolioiden deadline on sunnuntaina 18.12. 23:59, niin saadaan kurssi pakettiin!

Koskee siis myös viimeisen viikon portfoliota (tehtävät sen seassa)

Joku halusi keskustella JS-pistarin arvostelusta, mutta hässäkässä meni ohi, pahoitteluni! Tule keskustelemaan uudestaan tai laita sähköpostia (Matti)
Videotehtävästä laitettu mp4-formaatti optionaaliseksi, laitoksen koneilla liikaa ongelmia.

pe 2.12.2011 Julkaisematta unohtui CSS Web Fonts -tehtävä, nyt on ja myös kaikki tehtävät RAGEtoolissa.
to 1.12.2011 Viikon 5 tehtävät valmiit & julkaistu!
ma 28.11.2011 Ärsyttävää [js/jquery/poistajakirjasto.js] tehtävää helpotettu: annettu jQuery:n script-elementin addEventListener("load", jqueryLadattu);

ma 28.11.2011 Kalvot PDF-exportteina (koska Google ei jaksa korjata toista bugiaan, jossa sanotaan " In the meanwhile, the best workaround for presentations is to download these to a different file format and share as an attachment.")
su 27.11.2011 CSS-tehtävien kuvat korjattu näkyviin, löytyi taas Google Docsin bugi
pe 25.11.2011 Noniin CSS-tehtävät julkaistu ja galtsu v2 (portfolio) valmis
ti 22.11.2011 Portfolio on pakollinen; MUTTA sen voi palauttaa koska tahansa (portfolio-myöhässä-vkoN ragetoolissa)
pe 18.11.2011 Lisätty mielekkäitä SVG-tehtäviä 2 kpl!
ti 14.11.2011 Huominen luento PERUTTU johtuen luennoijan flunssasta. Pajaa on kuten ennenkin!
ke 9.11.2011 Huomenna torstaina pajaa 10:30–14 (välissä ruokatauko). CSS-tehtäviä tuli lisää (loput). Viikon portfoliotehtävä (kuvagalleria) tulee vielä tänään.
su 6.11.2011 Massapostitettu kaikkia: deadline ensimmäisen viikon osalta siirretään torstaille. Lisäksi deadline siirretään joka torstaiksi (23:59), siten että ensimmäisen viikon deadline on 10.11.2011 ja toisen viikon deadline 17.11.2011 ja tästä eteenpäin se on aina torstai. Lisäksi toiselle viikolle tehtäviä tulee vielä pari lisää.
3.11.2011 Keskiviikon luentokalvot ja tarkennus: tehtävät palautetaan RAGEtooliin viikoittain.
2.11.2011 Keskiviikon luennolla peruttiin (jo tämän viikon) paja-ajat: ke 18-20 sekä to 14-16
1.11.2011 Kurssilla on IRC-kanava #dime
27.10.2011 Kaikki ensimmäisen viikon tehtävät julkaistu! Niitä voi jo alkaa palauttaa RAGEtooliin.
26.10.2011 Ohjeet ilmoittautumisesta, tehtävien palauttamisesta ja doodlesta, jolla kysellään sopivia aikoja
19.10.2011 Kurssisivu avattu

Kurssikuvaus

Kurssilla käsitellään web-sivustojen toteuttamisen perustekniikoita, erityisesti dynaamisuuden ja interaktiivisuuden hallintaa sekä ulkoasun määrittelemistä tyylipohjien avulla. Esitiedot: Ohjelmoinnin harjoitustyö tai Tietokantasovellus. Kurssilla toteutetaan harjoitustyönä näytekansio web-tekniikoilla. Tutkintoon ei voi sisällyttää sekä kurssia Digitaalisen median tekniikat että (vanhaa) kurssia Uusmediasovellusten tekniikat.

Kurssi suoritetaan tekemällä tehtävät ja läpäisemällä kurssikoe.

Kurssin sisältö

Pääteema	Asiat	Lähestyy	Saavuttaa	Syventää
Työkalut	SSH, Tekstieditori, tiedostojärjestelmä	Osaa tehdä tekstieditorilla yksinkertaisen validin html-sivun ja laittaa laitoksen palvelimelle	Osaa luontevasti tehdä html- css- ja js tiedostoja ympäristö- ja koneriippumattomasti Ymmärtää tiedosto-oikeudet	Kokeilee uusia työkaluja ja ympäristöjä käsittää tiedosto-oikeuksien luonteen
Standardit	W3C, whatwg, selainvalmistajat	ymmärtää, että web perustuu standardoituihin tekniikoihin eikä selainvalmistajien ideoihin	Osaa katsoa W3:n standardeista ratkaisun ongelmaan	Ymmärtää standardien merkittävyyden ja tulevaisuuden kehityssuunnat
Selain- ja mobiiliweb	Hypermedia, Hypertext, Selain, WWW, HTTP, tiedon jakaminen, URL, solmut		Ymmärtää webin rakenteen (verkon) ja hallitsee dokumenttien julkaisemisen
Rakenne	XHTML, XML, SVG, JSON, JavaScript, DOM, RSS, Atom		Osaa erottaa esityksen rakenteesta kaikissa tilanteissa	Ymmärtää, että rakenne voisi aina olla parempi, ja jokainen kuvauskieli on kompromissi. Näkee kauneutta XML:n geneerisyydessä.
Esitys ja ladonta	CSS, JavaScript, XSLT, fontit		Osaa muotoilla sisällön pyydetyllä tavalla	Osaa edellisen vaihtoehtoisilla tavoilla
Tila	Cookie, Web SQL Database, IndexedDB, Web Storage, Application cache		Osaa hyödyntää selaimen tilaa
Toiminnallisuus ja interaktiivisuus, "peligrafiikka"	JavaScript, Canvas, SVG, AJAX, Cookie, Web Workers, WebSocket, Notifications, Geolocation, Form validation		Osaa valita oikean tavan toteuttaa interaktiivisuuden
Mediaformaatit: video, audio, kuva	h264, jpg, png, svg, mkv		Osaa valita sisällölle sopivimman formaatin ja tehdä formaattimuunnoksia (komentorivi)työkaluilla
Käytettävyys	Nielsen, CHI'99 muki, Drag'n'drop
Esteettömyys ja saavutettavuus	WCAG, links, Flash, Silverlight		Osaa toteuttaa minkä tahansa sivuston esteettömästi ja saavutettavasti
Yhteensopivuus	Internet Explorer	Tekniikat ei aina välttämättä toimi (varsinkaan yhteen)	Ymmärtää ja osaa lisätä hyväksyttävän "purkan" jotta tekniikat toimii yhteen	Julkaisee oman JavaScript-kirjaston
Palvelinkommunikaatio	HTTP, Cookie, parametrit, AJAX, tilan jakaminen	Ymmärtää mikä suoritetaan palvelimella ja mikä selaimessa	Osaa kommunikoida palvelimen kanssa	Koodaa oman palvelinkomponentin

Luennot

Ma 12-14	B123	31.10.2011-07.12.2011
Ke 10-12	B123	31.10.2011-07.12.2011

Luentokalvot

Luentokalvot eivät tällä hetkellä toimi ellet ole kirjautunut Googleen. Tämä on Google Docsin bugi.

Viikko 1 maanantina

Viikko 1 keskvisiko

Viikko 2 maanantai

Viikko 2 keskiviikko

Viikko 3 maanantai

Viikko 4 maanantai

Viikko 4 keskiviikko

Mediaformaatit
SVG jatkuu

Viikko 5 ma

Pistarin palautus, web storage, web fonts ym.

Ks. Pistokoe CSS

Viikko 5 ke

Pistarin JS palautus

Ks. Pistokoe JS

Viikko 6 ma

CSS kaikki loput, printattu web
Pistokoe HTML

Viikko 6 ke

Tenttivinkit, mm:

http://www.cs.helsinki.fi/u/paksula/dime/s11/liitteet.pdf

Kokeet

Kurssikoe

Kurssikoke oli tiistaina 13.12.2011 klo 9.00, oletettavasti salissa A111. Kokeessa mukana oli liitteet.

Kurssikoe, arvosteluperusteet ja kurssin tulokset (kirjaudu laitoksen tunnuksilla).

Erilliskokeet

Nykyisen kurssin viimeinen erilliskoe oli ti 13.11.2012. Osallistujia 1 kpl, pääsi sinnikkyydellä läpi. Arvosteluperusteet edellisten mukaan, joskin tehtävissä oli villejä variaatioita.

Syksyllä 2012 (periodi II) järjestetään uusi kurssi Web-selainohjelmointi, joka korvaa Digitaalisen median tekniikat -kurssin.

Erilliskokeella suorittaessa pitää tehdä ja palauttaa kurssin portfoliot (6 kpl), jos ei ole jo palauttanut niitä. Palauta linkit portfolioihin sähköpostitse Samulille viimeistään erilliskoepäivänä. Kun teet portfoliot ennen tenttiä, pääset varmaan tentinkin läpi.

Erilliskokeessa ti 14.8.2012 ei osallistujia.

Erilliskokeen pe 20.4.2012 tulokset ja arvosteluperusteet.

Erilliskokeen pe 3.2.2012 tulokset ja arvosteluperusteet. Syksyn 2011 kurssin tehtäväpisteet otettiin huomioon tässä uusintakokeessa. Pisteet laskettiin kaavalla max{ (tehtävät+koe)/2, koe }.

Materiaali

Tärkein kurssimateriaali on Internet.

Internetissä

http://eloquentjavascript.net/ -- JavaScriptin lisäksi "opi myös ohjelmoimaan kauniisti"
HTML Dog
Dive Into HTML5
Dive Into Accessibility
HTML5 Doctor, ks. Element Index ja Article Archive
Haut avainsanoilla Stackoverflowista, esim: http://stackoverflow.com/search?q=div+float

Kirjat

Keith, Jeremy: HTML5 for Web Designers
http://www.abookapart.com/products/html5-for-web-designers
Cederholm, Dan: CSS3 for Web Designers
http://www.abookapart.com/products/css3-for-web-designers
Keith, Jeremy: DOM scripting: web design with JavaScript and the Document Object Model, Friends of Ed, 2005
http://domscripting.com/book/ (Gurulassa n kpl, tiedekurjastossa n kpl)
Krug, Steve: Don't Make Me Think
http://www.amazon.com/Think-Common-Sense-Approach-Usability/dp/0789723107

Paja

Kurssin tehtävät tehdään itsenäisesti. Opiskelija voi ilmoittautua pajaan 2h/viikko, jolloin opiskeljalle taataan ohjausta. Muinakin aikoina pajaan saa tulla, jos tilaa on. Viikon tehtävät tulee palauttaa RAGEtooliin joka viikko sunnuntaina 23:59 mennessä joka viikko torstaina 23:59 mennessä, ensimmäisen kerran kurssin toisella viikolla, eli torstaina 11.10.2011.

Kurssi jakautuu kahteen osaan: ensimmäiset kolme viikkoa on pienempiä tehtäviä, joissa Japanilaisen kata-opin mukaisesti harjoitellaan kurssin kaikkia asioita. Viimeiset kolme viikkoa näistä opituista asioista rakennetaan tehtävissä suurempia kokonaisuuksia.

RAGEtool

RAGEtool löytyy osoitteesta: http://ragetool.herokuapp.com/

Luo itsellesi käyttäjätunnus (signup)
Älä käytä samaa salasanaa, kuin laitoksella

Ilmoittautuminen

Valitse "exercise sessions"
Valitse sopiva aika (huom. ilmoittautuminen tehdään jokaiselle viikolle erikseen, voit siis vaihtaa aikoja)
BK107 mahtuu 40 ihmistä ja B221 25
Ilmoittautuminen on sitova, peru/vaihda hyvissä ajoin!

Palautus

Valitse "exercises"
Valitse tehtävä
Anna tekstikenttään riittävä selvitys (esim. koodia, copy-paste terminaalista ym.) jotta uskomme sinun tehneen tehtävän. Tähän vaiheeseen ei kuitenkaan tule käyttää yli 48 sekuntia!
Kun deadline on ylitetty, ei tehtävää voi enää muokata (eikä palauttaa)
Kertaus: deadline on joka viikko sunnuntaina klo 23:59. torstaisin 23:59, alkaen 10.11.2011.

Pajan aikataulut

Aikatauluja päivitetään ensimmäisen viikon jälkeen kysynnän mukaan.

Kysyntää doodle-kyselyllä, jonka käyttäminen vaatii vähän ponnisteluja.

Avaa http://doodle.com/sniyuyv4bdb75qsp#calendar jotta saat kalenterinäkymän
Klikkaa sinulle sopivat ajat "Yes" ja ehkä sopivat ajat "(Yes)"

Tämä ei siis sido mihinkään, haluamme vain kartoittaa mahdollisimman sopivia aikoja.
Vaikka doodlessa näkyy päivämäärät, haemme aikoja koko loppukurssille.
Jos saat järjestelmän jumiin tms, niin sivun päivittäminen auttaa.

Jostain syystä calendar-näkymän save ei ole aktiivinen, joten
Vaihda "Table view" -tilaan, anna nimeksi mitä tahansa ja skrollaa oikealle, jossa save-nappi lymyilee. Save-nappi ei ole aktiivinen jos näkymä ei ole leveä (!)

ma	14:15–15:45 B221
ti	-
ke	12–14 BK107
to	10:30–14 BK107
pe	-

Tehtävien palautus torstaisin klo 23:59 mennessä.

Pajassa on myös muita kursseja ja sinne saa tulla aina kun mahtuu. Koko pajan aikataulut pajawikissä.

Tehtävät

Viikolle 1

Viikolle 2

Viikolle 3

Canvas
SVG
Portfolio/whack-a-mole (deadline siirretty 4 viikolle, koska unohtui laittaa julkiseksi)

Viikolle 4

Viikolle 5

JavaScript
Käyttöliittymät
CSS Web Fonts
Portfolio/galleria-v3: näppäimistö- ja videotuki
HTML5 lomakkeet, audio ja video siirretty viikolle 6

Viikolle 6

HTML5 formit, audio ja video (viikolta 5)
SVG ja Canvas (JavaScript-kertaus)
Portfolio/struktuuri-v5 lisätehtävineen
Galleria-v3:n näppäimistöselaus

Tehtävien lukuohjeet

[tehtävän/nimi/on/suositeltu.tiedostonimi] joka sisältää myös hakemistopolun. Kaikki kurssin tehtävät suositellaan laittamaan laitoksen kotihakemistoon ja siellä hakemistoon ~/public_html/dime.

Tehtävässä on eksplisiittisesti a) vastattava b) kaikkiin c) numeroituihin d) kohtiin.

Oppimispäiväkirja

Vapaaehtoinen. 3 pistettä (0,5 pistettä / viikko). Ei kasvata viikon maksimipistemäärää, mutta saat enemmän pisteitä jos et tehnyt tarpeeksi tehtäviä.

Ylläpidä tekstitiedostoa (tai Google Docsia), johon kirjoitat jatkuvasti tehtäviä tehdessä mitä ongelmia kohtasit ja miten ongelma ratkesi (linkit, ym. talteen). Tee sellainen oppimispäiväkirja, josta on sinulle hyötyä. Esim. muutama avainsana ja url on täysin riittävä, kunhan pituus on n. 1 sivu / viikko.

Kirjaa päiväkirjaan myös kysymyksiä pajaan, joita haluat käydä läpi ohjaajan kanssa.

Pisteytys

Kurssin maksimipistemäärä on 60 pistettä. Kokeesta 30, tehtävistä 30. Kokeen läpipääsyraja on 15 pistettä. Arvosana määräytyy seuraavasti:

Pisteitä	Arvosana
0-29	hylätty
30-35	1
36-41	2
42-47	3
48-53	4
54-60	5

Tekemällä viikon tehtävistä 90% saa täydet tehtäväpisteet kyseiseltä viikolta. Tehtäväpisteet skaalataan lineaarisesti. Skaalauksen jälkeen pisteisiin lisätään oppimispäiväkirjan 0,5 p, tämän jälkeen pyöristetään (alaspäin). Tehtävistä saa pisteitä seuraavasti:

Viikko	Tehtäviä	90%	Pisteitä (jos 90% tehtävistä)
1	29	26	2 p
2	22	20	4 p
3	13	12	4 p
4	12	11	6 p
5	14	13	7 p
6	12	11	7 p
yht	102		30 p