Du är här: keryx/Lars blogg/61. Hoppa till huvudinnehållet (h) Sidans menysektion:
Keryx logotype

Lars Gunthers bloggsida

Gy -11 webbkursernas inbördes relation

I arbetet med Gy -11 så har jag föreslagit och fått respons för en kursstruktur baserad på kurser i gränssnittsdesign, (Front End) webbutveckling och webbserverprogrammering. Till detta kommer två ämnen som berörs: Digitalt skapande och programmering. Jag skall försöka reda ut hur dessa förhåller sig inbördes och hur de förhåller sig till dagens kurser. Det förslag som snart kommer ut på remiss innebär att webben ses som den huvudsakliga plattformen för all slags media. Kurserna i webbteknik kommer därför fungera som spindeln i nätet.

Relativt idag

Dagens problem

Idag finns det en kurs som heter digitalt skapande, vars innehåll enligt kursplanen är till 80 % identisk med dagens ämne multimedia. Skillnaden är mer en fråga om tradition. Digitalt skapande ligger på estetiska lärares bord, medan multimedia hamnar på IT-sidan. De enda reella skillnaderna är att multimediakursen handlar om att sammanfoga text, ljud och bild, samt att förse resultatet med ett mått av interaktivitet. Om man vill skulle man kunna säga att digitalt skapande idag utgör en delmängd av multimediakursen — så som det beskrivs i kursplanerna.

Multimediakursen å sin sida är skriven för ett tänkande runt Director eller Encarta, med CD-skivan som tänkt plattform. Dagens enda relevanta plattform är webben, även om man inte nödvändigtvis gör en traditionell webbplats. Youtube-spelaren i iPhone är exempelvis ett paradexempel på webbteknik och inget annat.

Ämnet webbdesign har jag sågat i tidigare inlägg och skall som jag skriver där delas upp i två delar, ett som fokuserar design och ett som fokuserar kod och annan teknik. Detta reflekterar verkligheten både i dagens undervisningssituation, där lärare väljer inriktning efter intresse och kompetens, och i dagens arbetsliv, där en helt ny yrkeskategori har uppstått på 2000-talet: Front End Engineer, på svenska ofta kallad gränssnittsuvecklare. Jag undviker dock det ordet i kursplanerna för att tydliggöra skillnaderna mellan de nya ämnena.

Slutligen finns det en kurs i databashantering, som i alla läromedel blir en slags fördjupad officekunskap, där eleverna slösar bort sin tid med att designa formulär och rapporter i MS Access. Jag vill renodla detta till databasutveckling, som en del av webbserverprogrammering och samtidigt öppna upp för möjligheten att titta på alternativ till traditionella relationsdatabaser.

Vägen framåt

Kursstruktur jämfört med idag (förklaras i texten nedan)

I bilden ovan synliggörs hur ämnena i dagens gymnasium relaterar till förslagen i Gy-11. Det särskiljande för multimedia kontra digitalt skapande (sammanfogning och interaktivitet) gär till webbutvecklingskursen. Resten till digitalt skapande.

Lägg märke till att webbutveckling och webbserverprogrammering är kursnamn, inte ämnesnamn. De ryms båda under ämnet webbteknik.

Designaspekterna av multimedia och webbdesign går till gränssnittsdesign — som ju har sitt fokus på att göra attraktiva och användbara gränssnitt för just interaktion. Lägg märke till att ämnet gränssnittsdesign också är användbart för spelutveckling, gränssnitt på telefoner eller surfbrädor (slates) och annan mjukvaruutveckling.

Teknikaspekterna av multimedia och webbdesign går till i webbutveckling. Detta är spindeln i nätet-kurser, där allt skall vävas samman.

De användbara delarna av databashantering, alltså de som fokuserar databasteori, klient/server, normalisering, SQL, etc, går till webbserverprogrammering. Resten slipper framtidens gymnasieelever helt!

Ämnenas inbördes områden

Ett av våra uppdrag som ämnesexperter är att klargöra hur de olika ämnena avgränsas och skiljer sig från varandra. Nästa bild klargör detta förhoppningsvis:

Kursstruktur för Gy -11 (överlappande ellipser förklaras i texten nedan)

Som jag nu ritar ämnena så syns också den självklara överlappningen som måste finnas.

Digitalt skapande

Detta ämne handlar om att framställa digital bild, ljud och video. Det kan utgå från något inspelat/fotograferat eller skapas helt i datorn (digitalt måleri, animering, etc). Slutprodukten är enskilda bilder, animeringar, ljudklipp, etc. Kanske kan här också ingå ljud och ljuseffekter för konserter, TV-program eller som offentlig konst.

Gränssnittsdesign

Frågor om färgteori, komposition, typsnitt och liknande kommer överlappa till digitalt skapande. Dessutom kommer man att behöva anpassa bilder, ljud och video till sin produkt, så viss redigering finns också här. Men den övergripande frågan är nu hur användaren skall interagera mot det som visas. Det som visas skall kommunicera ett budskap eller en upplevelse. Här ställs frågan om hur text skrivs för att fungera på valt medium och hur den skall sammanfogas med bild, ljud och video. Vilka widgets skall användas, vilken feedback skall användaren få på klick, knapptryck eller pek på skärmen. Det som skapas är en upplevelse och därför ingår också användbarhetstestning i ämnet.

Slutprodukten är en prototyp som ger en realistisk grund för bedömning av designen som helhet och en guide till implementering, exempelvis i form av en stilguide till webbutvecklaren. Bygger man en webbplats så är det OK att använda Dreamweaver i grafiskt läge på den här kursen.

Webbutveckling

Fyra förkortningar summerar detta ämne: (X)HTML, CSS, DOM och ECMAScript. Här skall alltså ett gränssnitt utvecklas från prototyp till användbar produkt. Här skall eleverna koda! Validerande (X)HTML, semantisk (X)HTML, effektiv CSS, icke-inkräktande (unobtrusive) DOM-skript, progressive enhancement, etc. Allt för att åstadkomma applikationer som fungerar både på pyttesmå skärmar med touch-gränssnitt och gigantiska skärmar med konventionell muspekare plus tangentbord, tillgänglighet också för blinda, sökmotoroptimering, korta nedladdningstider och minimal latens.

Här skapas inga bilder, men vi ställer frågor om hur man kan optimera dem så att de skickas så effektivt som möjligt över nätet. När är JPEG bättre än PNG? Vilka tröskelvärden skall jag ha på mina JPEG-bilder? Vilka färger skall ingå i paletten på PNG-bilderna? Är SVG eller Canvas det bättre alternativet för en viss animering?

Sedan designern valt typsnitt skall webbutvecklaren få dem att funka. Skall de vara nedladdningsbara webbfonter? Skall man använda någon ersättningsteknik?

I denna kurs skall det sväras över bristande funktionalitet i vissa webbläsare — fast MSIE 6 kommer vara död till år 2014, tack och lov.

Eftersom tekniken återverkar på designen kommer det självklart finnas viss överlappning mot gränssnittsdesignen.

Slutprodukten i detta ämne kan vara en statisk webbplats, men jag ser gärna att den är en mall för Wordpress eller en annan CMS.

Webbserverprogrammering

Hade jag fått använda engelska skulle denna kurs heta Server Side Scripting. Jag förutspår att PHP och .NET med VB kommer bli de två mest förekommande undervisningsvarianterna. JSP, Ruby on Rails, Python, JavaScript på servern, etc, är naturligtvis alternativ. I första kursen bygger eleven en enkel CMS, eller anpassar en befintlig CMS till egna önskemål. Det sistnämnda innebär inte att skriva mallar och CSS till Wordpress — det är ju Front End utvecklarens uppgift! För de lägre betygen tillåts det att eleven bygger dynamiska påhäng som kontaktformulär och gästböcker på en i övrigt statisk webbplats.

I den andra kursen skapar eleven en mer multifunktionell CMS, som helst bör erbjuda en webbtjänst eller hämta sin egen information från en sådan.

Programmering

Det förslag som nu legat ute på remiss i ämnet programmering talar om att skapa mjukvara med användbara gränssnitt. Här finns alltså en viss nödvändig överlappning.

När dessa gränssnitt skapas, så kan det mycket väl vara så att man använder deklarativ eller funktionell programmering, helt eller delvis med rena webbtekniker. Också där finns det alltså en överlappning. Likaså sker ju de mer avancerade inslagen i webbutvecklingen med hjälp av programmering. Jag tänker främst på JavaScript, men också ActionScript för Flash eller JavaFX kan dyka upp här.

(Kursen webbutveckling 2 tillåter att man fokuserar på insticksprogram, med sina skriptspråk. Även om jag är en anhängare av standarder inser jag att dessa fortfarande kommer ha sina nischer.)

Att webbserverprogrammering överlappar med det allmänna programmeringsämnet är självklart. Många moment kommer vara identiska, just för att man programmerar i båda ämnena! Skillnaden är att ämnet programmering fokuserar mer på allmän programmeringsteori, algoritmer och att den inte får fokusera på webbläsaren eller webbservern som enda körmiljö.

Den kanske mer dolda överlappningen mellan dessa två ämnen är att man i programmering 2 kan implementera ett API mot en webbtjänst, på hög nivå eller på socket-nivå.

Om detta haft mer genomarbetad webbfunktionalitet…

Så skulle jag i kursen gränssnittsdesign tittat på bilden ovan och funderat på några frågor som:

I kursen webbutveckling skulle jag ställt mig frågan hur detta skall bli verklighet på ett sätt som är optimalt:

I kursen webbserverprogrammering kanske jag hade gjort så att texten låg i en databas och att den kunde enkelt redigeras genom en redigeringsfunktion som endast är åtkomlig för behöriga användare.

Om jag hade en utbildning med spelutvecklingsprofil

Så skulle jag låta eleverna designa monster och andra karaktärer, landskap och byggnader i kursen digitalt skapande.

I kursen gränssnittsutveckling hade jag funderat på frågor som hur skall figurerna röra sig? (Vad är spelidén?) Skall jag styra med accelerometern eller med knappar, eller både och? Vilken fakta skall synas på skärmen hela tiden och vilken skall finnas tillgänglig med kommando – och i så fall vilka kommandon?

Om spelet skall vara webbaserat så går jag vidare till kurserna inom ämnet webbteknik för att åstadkomma detta, annars så blir det en progression till det vanliga programmeringsämnet. I båda fallen kan spelen vara multiplayer och kommer då att skicka data via sockets (HTML5) eller api:er.

Publicerad: 2010-02-26 09:13
Uppdaterad: 2010-02-26 10:13


Permalink

Senaste bloggar

Ny lärobok: Webbserverprogrammering 1 med PHP
2013-09-05 15:26

Köp min lärobok
2012-08-03 21:21

Vad är diskreta domskript?
2011-10-11 21:02

Framtidens programmeringsundervisning = patterns and paradigms first (del 3)
2011-05-22 07:00

Framtidens programmeringsundervisning = web first (del 2)
2011-05-08 14:35

Framtidens programmeringsundervisning = user first (del 1)
2011-04-19 13:38

Mina tankar och resurser om gy11 kurserna
2011-03-17 20:46

Alternativ utformning av arbetsplatsförlagt lärande
2010-11-07 07:16

Kort politiskt mellanspel
2010-09-05 18:34

Tyck till om mina kursplaner och köp min bok!
2010-05-31 16:00

Bloggar i samma ämne

Ny lärobok: Webbserverprogrammering 1 med PHP
2013-09-05 15:26

Köp min lärobok
2012-08-03 21:21

Vad är diskreta domskript?
2011-10-11 21:02

Mina tankar och resurser om gy11 kurserna
2011-03-17 20:46

Tyck till om mina kursplaner och köp min bok!
2010-05-31 16:00

Hej då webbdesign!
2009-10-28 06:01

Högre kvalitet på webb-utbildningen på gymnasiet
2009-10-07 09:40

Framtidens gymnasiala webbutbildning - 1
2009-09-27 13:12

Experter finnes och jag är en av dem!
2009-09-17 17:17

Stort intresse för WaSP InterAct i Frankfurt
2009-04-07 17:14

Artiklar i samma ämne

Svårt att göra lätta siffror
2006-06-04 08:31
Församlingens hemsida
2005-09-27 05:01
Give me that homepage
2005-06-16 08:59
Olika slags (X)HTML
2005-05-11 05:38
God HTML
2005-05-10 17:33

Technorati


RSS-ikon
Uppdaterad: 2010-02-26 10:13    © Keryx