Coursepressgruppen Anton Wårdell Christian Ulf Per Möllmark Tommy Karlsson Zlatan Majdanac Innehållsförteckning 1. Förord... 3 2. Sammanfattning... 4 3. Inledning och bakgrund... 4 3.1 Syfte... 4 3.2 Mål... 5 4. Genomförande... 6 1
4.1 Teknik... 6 5. Resultat... 7 5.1 Nyhetflöde... 8 5.2 Huvudmeny... 9 5.3 Sökfunktion... 9 5.4 Responsiv design... 10 5.5 Sidomeny... 10 5.6 Grafisk profil... 10 6. Positiva erfarenheter... 11 7. Negativa erfarenheter... 11 8. Övertagande organisation... 12 9. Slutsats... 13 10. Förslag på vidareutveckling... 13 1.Förord En kurswebbplats största funktion är att ge strukturerad och aktuell information om vad som sker inom en students kurser. Viktig information får inte gå förlorad för att sidan är svårnavigerad och rörig. För att förbättra nyhetsflödet på Linnéuniversitetets kurswebb fick vi i uppdrag att skapa en startsida, där alla viktiga nyheter som berör en student ska samlas. Dessutom var sidan svår att navigera, därför är en meny som följer med på samtliga sidor och som alltid kan ta en till den sida man letar efter var önskvärt. Som de studenter vi själva är tänkte vi länge och noga på hur vi ansåg att en lämplig kurshemsida bör se ut. Samtidigt som vi ville ge sidan en grafisk profil som följer övriga delar inom Linnéuniversitetet. 2
3
2.Sammanfattning Denna rapport omfattar arbetet med att uppdatera Linnéuniversitetets kommunikationsplattform Coursepress. Arbetet utfördes under kursen Webbprojekt 1 på Linnéuniveritetet i Kalmar. Coursepress är en samlingsplats på nätet där lärare och elever samlas för information och diskussion om kurser. Syftet med projektet har varit att förnya Coursepress med en tydligare struktur och bättre användavänlighet för att få studenterna att börja använda plattformen mer regelbundet. Här behandlar vi vårt tillvägagångssätt, positiva och negativa aspekter samt hur resultatet blev. 3.Bakgrund/Inledning Institutionen DFM(institutionen för datavetenskap, fysik och matematik) på LNU har under vintern genomfört ett projekt för att förbättra sin kurswebbplats. Genom detta projekt kom man fram till att det är för svårt att få ny information om vad som händer inom de olika kurserna som man är registrerad på och att webbplatsen kändes för rörig. Vi har fått i uppdrag att knyta samman de olika kursernas nyhetsflöde till en samlad startsida samt att omforma sidans meny för att underlätta navigeringen på sidan. Vi fick ett dokument sammanställt av elever vid universitets program för interaktionsdesign, detta har fungerat som en grund för projektet. 3.1 Syfte Syftet med det här projektet har varit att skapa en plattform som engagerar och skapar kommunikation mellan elever och lärare. Då den dåvarande plattformen var otydlig och ostrukturerad gjorde det att den inte har använts i den utsträckning som lärare har önskat. Med hjälp av materialet vi fick från eleverna på interaktionsdesignerprogrammet och med design och struktur från sociala medier i åtanke skulle vi skapa en plattform som elever känner att de vill använda. 3.2 Mål 4
Grundmålet var från början var att vi skulle skapa ett facebook-liknande nyhetsflöde där man knyter samman information från elever, lärare och kurser. Tanken var att skapa ett lättsamt forum där studenter kan ta del av och dela personliga tankar om vad som händer i skolan samtidigt som det ska vara en knutpunkt för seriösa diskussioner och problem man stöter på i kurser. Allt eftersom arbetet med nyhetsflödet fortskred fick vi också det nya målet att vi skulle göra en funktionell och presentabel meny där man som elev och lärare ska kunna komma åt verktyg och information som skolan erbjuder på ett lättare sätt än innan. Målet var att använda det material som eleverna på interaktionsdesignerprogrammet tagit fram som grund att stå på för att skapa en inbjudande miljö för Institutionen DFM på Linnéuniversitetet. 5
4 Genomförande 4.1 Teknik Då Coursepress bygger på Wordpress och Buddypress har PHP varit det språk vi har använt oss av. Vi har använt github för versionhantering. Initialt valde vi att arbeta lokalt för att komma igång med projektet och få igång en utvecklingsmiljö, men relativt tidigt lade vi upp vårt projekt på ett webbhotell ägt av en av gruppmedlemmarna för att få en mer realistisk utvecklingsmiljö. I projektets slutskede fick vi även tillgång till skolans skarpa testserver, som är väldigt lik deras produktionsserver. 6
5. Resultat Vår kund, Johan Leitet, gav oss snabbt en klar bild av vad som skulle göras. Till vår hjälp hade vi materialet som eleverna på interaktionsdesignerprogrammet hade tagit fram så våra riktlinjer var väldigt tydliga. Plattformen Buddypress var ny för oss alla, Coursepress likaså. Inom Wordpress var erfarenheten ganska minimal. Trots detta startade vi med att sätta oss in i språket och alla dess aspekter. En projektledare utsågs och vi började väldigt tidigt med att staka upp vad som borde göras i vilket skede ur en logisk synpunkt. Rent planeringsmässigt nöjde vi oss med en sprint backlog där vi delade upp var medlems arbetstimmar in i olika element i projektet. Vi har haft en iterationsplan för varje vecka där vi listat de saker vi måste fokusera på för att komma framåt. Möte med kund skedde sporadiskt till en början, men ändå i den omfattning att vår kund fick se ny funktionalitet i omgångar, och inte allt på en gång. Allt eftersom projektet fortskred hade vi kundmöten oftare. Vi tycker att samarbetet med kunden har fungerat väldigt bra. På ett sätt var det väldigt skönt att få just Johan Leitet som kund, då det var tydligt att han visste vad han ville, och vad vi skulle vara kapabla till. Vi kan alla tänka oss att andra grupper haft det något svårare med att få realistiska förutsättningar via sina kunder. Då vi alla var ganska oerfarna med Wordpress och Buddypress hade vi några veckor som egentligen nästan bara gick ut på att lära oss hur den befintliga plattformen fungerar och skissa på lösningar för att uppfylla kundens önskemål. Detta ledde till att testningen hamnade lite efter och det dröjde ganska länge innan vi egentligen hade något vi kunde testa. När vi väl kom igång och började få saker vi kunde testa tycker vi att testningen har fungerat bra och vi har lagt lagom mycket tid på att testa. 7
5.1Nyhetsflödet Det huvudsakliga baskravet från vår kund var att implementera ett nyhetsflöde med relevant information för respektive student. Meningen med det nya CoursePress är att man på ett enkelt och snabbt sätt ska kunna få information om vad som händer i de kurser man medverkar i. Man ska enkelt kunna ta del av vad lärare och elever skriver i diskussionsgrupperna för varje kurs. Som bas använde vi Buddypress befintliga flöde, som vi fick modifiera ganska kraftigt för att kunna få en bra filtrering. Det fanns funktioner som behövde läggas till, samt tas bort. Exempelvis tillämpades en sorts trädstruktur i kommentarsfunktionen. Det kändes inte som att detta tillförde något utan bara gjorde flödet svåröverskådligt. Enligt kundens önskemål fick vi också in en variant av like-funktionen som finns på facebook, där medlemmar kan välja att gilla poster. Detta ska ge användare ett enkelt sätt att visa om tex ett svar på en fråga är bra. För att få ett renare flöde valde vi i samråd med kund att ta bort funktioner för att redigera och ta bort inlägg ifrån huvudflödet. Om någon post behöver tas bort finns det naturligtvis ett adminkonto med fulla rättigheter att göra just detta, så att man slipper gå in manuellt i databasen. Information som är mindre relevant är också borttaget från huvudflödet, såsom vem som gillat vad, vem som gått med i vilken grupp, profilbildsbyte, vänskapsförfrågninar och dylikt. Denna information finns tillgänglig på ens personliga sida, där ett separat flöde visas med all sådan information, inklusive den som finns att tillgå i huvudflödet. Detta nyhetsflöde har som avsikt att välkomna och föra samman studenter. Som mall för detta nyhetsflöde kan man ta Facebook som det starkast lysande exemplet. Vi var alla överens med kunden om att detta var helt rätt riktning att gå. 8
5.2 Huvudmenyn Om arbetet med nyhetsflödet gick bra fanns det redan från start ett önskemål om att få in en huvudmeny där studenten kan komma åt all viktig funktionalitet bara ett knapptryck bort. Vi kände förhållandevis tidigt att vi faktiskt skulle få möjlighet att hinna detta. Här krävdes det en viss inlärningsprocess då menyn är skriven som ett plugin och måste samverka på rätt sätt med den övriga sidan. Denna meny, som finns högst upp på sidan, innehåller notfikationer om något nytt har hänt som är specifikt för studenten, länkar till kurser och grupper, en avancerad sökfunktion(se sammanfattning av denna nedan), och en meny med studentspecifika funktioner. För att kunna få ut varje enskild students kurser i menyn var vi här tvungna att sätta oss in i den befintliga koden och integrera den med vår kod för vårt menyplugin. Det var lärorikt att få erfarenhet av att tillföra ny funktionalitet med ett befintligt system. Notifikationerna funkar som så att det från början är ett statiskt menyelement, men när en notifikation fås kommer en symbol som visar antalet notifikationer, och om man trycker på rubriken får man en dropdown-meny med de notifikationer som studenten fått. Dessa inkluderar meddelanden, omnämningar och vänförfrågningar. De andra länkarna i huvudmenyn leder till de länkar som finns på den gamla webbplatsen, men de har nu blivit samlade för att ge en tydligare navigering 5.3 Sökfunktionen Den befintliga sökfunktionen användes nästan inte alls, mycket pga att den var för klumpig att använda. Kunden ville att man snarare än att kunna välja sökområde innan själva sökningen, skulle få ett resultat som innehöll allt, men avgränsat i de olika sökområden som finns. Denna sökfunktion kände vi skulle passa bra i huvudmenyn, så att studenten på ett lätt sätt alltid skulle få tillgång till att söka. 9
5.4 Responsiv design Nästa större önskemål ifrån kunden och även oss själva, var att få sidan att fungera på mobila enheter. Här var vårt största dilemma hur huvudbaren, som är ganska innehållsrik, skulle få plats i den begränsade storlek på skärmar som många handhållna enheter har. Därför bestämde vi oss för att ha en sorts pop-up -knapp som utvidgar menyn till en större samling länkar, men som i befintlig storlek bara täcker en liten del av skärmen. Vi har även fått med en bild av användarens avatar, som vid knapptryck, leder studenten till dennes profilsida. För att menyn inte skulle bli alltför klumpig har vi försökt undvika att använda dropdown-menyer. 5.5 Sidomenyn För att använda oss av en stor tom yta vi fick till vänster på sidan valde vi att lägga in en sidomeny. Skillnaden på dessa länkar och de som återfinns i huvudmenyn är att sidomenyn skall ha som mål att vara direkt relaterad till inloggad användare, alltså studentens egna profil. Här hittar man länkar till avatarbyte, vänner, vänskaps- och gruppaktivitet, profil och meddelanden. Denna meny visas naturligtvis inte om man inte är inloggad som en användare på skolan. 5.6 Den grafiska profilen På första mötet fick vi resultatet av interaktionsdesign-studenters arbete. Vi fick då ett häfte med den grafiska profil vi skulle jobba efter. Det skall dock tilläggas att vi fick vissa konstnärliga friheter i samspråk med kunden. Det känns inom gruppen som att denna design var förvånansvärt enkel att jobba efter, och det föll sig på något sätt naturligt under arbetets gång att jobba efter denna. Med fokus på universitets designmanual designade vi sidan enligt de riktlinjer vi fått, med vår egna lilla touch. Det enda problemet vi stötte på var att av någon anledning finns en limegrön nyans i universitets grafiska profil. Vi kände att vi borde införliva detta på något sätt på sidan, och kämpade ganska mycket med att få in denna på ett naturligt sätt. Ingen av oss kan väl säga att vi lyckats speciellt väl med detta. 10
6 Positiva erfarenheter Vi känner samtliga att vi lärt oss väldigt mycket. Samtliga gruppmedlemmar hade, av naturliga skäl, olika erfarenheter av de språken som användes för projektet. Med tanke på att vi hade ett helt ramverk att lära oss, en mängd med befintlig kod att förstå och en relativt stor grupp, är det ganska extremt att allt gick så smidigt som det gick. Det var visserligen ingen övermänsklig uppgift, men som studenter och med ganska stor brist på erfarenhet är det ändå svårt att ta miste på hur nöjda vi är med det vi uppnått. Vidare skulle vi hävda att det faktum att vi alla kände varandra innan hjälpte mycket i samarbetsprocessen. Därför gick det oväntat smidigt med såväl planeringsprocessen som utvecklingen. Vissa är ansvariga för mer än andra, men gruppen anser ändå att alla medlemmar har dragit den börda som behövts för att kunna genomföra projektet. Fortsättningsvis så kan vi alla intyga om att vi med spänning ser fram emot att se framtida studenter använda systemet vi står bakom! 7 Negativa erfarenheter Självklart önskar man sig som projektdeltagare ett perfekt resultat på den slutprodukt som levereras. Nu kanske inte verkligheten ser ut på precis det sättet, men vi kan med gott självförtroende säga att vi inte hade kunnat önska oss ett mycket bättre resultat då projektet tog sin början. Den kritik som skulle kunna, och antagligen bör ges, ligger på vårt planeringsarbete och dokumentation som vi kanske skulle kunna ha gjort mer omfattande och konsekvent. Samtidigt kan man väl anse att den mån av planering som sker, ändå skall vara knuten till resultatet man levererar? I detta aspekt skulle vi hävda att vi gjort ett bra arbete, även om dokumentation och planeringsverktyg som användes kanske enligt erfarna programmerare och projektledare skulle anses som undermålig. Med facit i hand kan vi tycka att det finns rum för förbättring i Wordpress. Det är svårt att hitta bland funktioner och filer och vi hade en ganska lång startsträcka innan vi kom igång. Sammantaget är vi inte jättepositiva till Wordpress. 8 Övertagande organisation Johan Leitet 11
Linnéuniversitetet Institutionen för datavetenskap, fysik och matematik (DFM) 391 82 Kalmar johan.leitet@lnu.se 12
9. Slutsats Den nya plattformen för studenter som tillhör IT-utbildningar vid Linnéuniversitetet kommer att vara en produkt av vårt hårda slit. Detta faktum ser vi på med stolthet och är alla förväntansfulla på att se hur det hela mottas av det som faktiskt betyder något; användare av systemet! Målet var att göra en lättanavigerad plattform för studenter och lärare där man snabbt kan ta del av relevant information som rör de kurser man läser. I och med startsidans timeline och den navigationsmeny vi har skapat tycker vi att vi lyckats bra. Ny funktionalitet i samspråk med den gamla fungerar enligt oss väl ur såväl ett estetiskt, såväl som ur ett användarvänligt perspektiv. Att arbeta med ett projekt av denna magnitud, med vetskapen om att vår slutprodukt kommer att användas av hundratals studenter, har varit väldigt spännande och lärorikt. Vår förhoppning är att det vi producerat skall stå som grund för det som används i många år framöver, och att det blir en plattform för studenter att mötas och hjälpa varandra på, samtidigt som den enskilde studenten känner att allt är mer lättåtkomligt än nånsin! 10. Förslag på vidareutveckling En del man betänkligen skulle kunna jobba med är sättet notifikationer fungerar på för närvarande. Som det är i nuläget får användaren en notifikation när denne får ett meddelande, en vänförfrågning eller om någon nämner ens namn i en post. Det hade kunnat vara användbart om man även fick en notifikation då en lärare skriver i en kursgrupp. En annan sak som hade varit ett välkommet tillskott är en presentation av ens schema på något vis. Kanske att man även där skulle kunna få en notifikation då en schemaändring görs. Funktionalitet för en livechat likt den som finns på Facebook är också en tanke som slagit oss. Bättre integrering av studentmailen skulle man också kunna jobba på, exempelvis att man skulle kunna få notifikationer då mail mottas. Coursepressgruppen, Anton, Christian, Per, Tommy, Zlatan 13