Content Driven Web Design - Et tværfagligt forløb med fokus på UX, UI og Development 22.08.2016-11.11-2016 Fra webmaster til UX, UI og Development Webdesign- og udvikling er en tværfaglig disciplin, og et arbejdsområde i hastig udvikling. Det er på samme tid også et fagområde, der er blevet langt mere professionelt, siden CERN lancerede det første website nogensinde i 1990. Fra at være en webmaster, der de nerede indhold og design samt udviklede løsningen, har webbranchen nu fået utallige jobtitler- og typer, der alle skal samarbejde om at lave en god oplevelse for brugeren. I løbet af dette tema, skal vi fokusere på tre af de helt store fagområder og jobtitler for tiden: User Experience Design (UX), User Interface Design (UI) og Development. Formålet er
at få et solidt fundament inden for de tre fagområder, og dermed opbygge kompetencer, der er efterspørgsel for i erhvervslivet. Ud over fagligheden, stiller branchen en række andre store krav til medarbejderne. Som multimediedesigner skal man: - Være godt fagligt forankret i digital design- og udvikling - Følge med i den digitale udvikling - Spotte interessante trends og teknologier - Håndtere varierende opgaver - Overskue komplekse opgaver - Løse problemer selvstændigt og i teams - Omsætte viden til forretning
I løbet af de kommende 12 uger, skal i arbejde med alle ovenstående kompetencer i henhold til temaets tre fokusområder: User Experience Design, User Interface Design og webudvikling. Med andre ord: I skal skabe et koncept for en kompleks, digital kommunikationsløsning: designe den, udvikle indhold til den, implementere den og teste den. I bestemmer selv hvordan i vil vinkle jeres løsning: I kan nde en case hos en virksomhed, I kan agere digitale iværksættere, og stable jeres eget koncept på benene, I kan nde en samarbejdspartner til udvikling af et nyt koncept, eller I kan vælge en af de cases, i bliver præsenteret for i undervisningen. Det vigtige er at I får skabt en kompleks kommunikationsløsning ved hjælp af de metoder og værktøjer, der introduceres i undervisningen. Det fører os frem til nedenstående opgaveformulering. Opgaveformulering Hvordan kan et koncept for en indholdsdreven webproduktion udvikles, designes og implementeres, så den dækker afsenderens og brugernes behov? Det rejser en række delspørgsmål: - Hvordan kan vi arbejde med User Experience Design, så oplevelsen med brugen af løsningen bliver helhedsorienteret? - Hvordan kan vi designe et User Interface, så det giver et sammenhængende udtryk på tværs af medier og platforme? - Hvordan kan en webløsning, der engagerer og involverer brugerne, udvikles og implementeres? Delopgaver for udviklingen af løsningen Forløbet består af 11 moduler à en uges varighed. Hvert modul byder på undervisning, og øvelser inden for et speci kt emne. Dertil byder hvert modul ind med delopgaver til projektet. Alt i alt giver det en løbende udviklingsprocess bestående af 11 små sprint, hvor projektet modul for modul bliver mere omfattende. Modulerne i kommer gennem er: - Modul 1 - Content Driven Web Design start-up: Intro til forløbet og casen, gruppedannelse og valg af projekt/samarbejdspartner. Første udkast til konceptet
a everes i form af en konceptbeskrivelse. Det primære fokus er i første omgang på at lave et website. - Modul 2 - Design Research: Brugerne involveres i designprocessen, mediestrategi, indholdsstrategi, informationsarkitektur og design gennemtænkes. Design deliverables a everes. - Modul 3/4 - Motion Graphics/Content First: I dette modul arbejdes med Motion Graphics med Adobe After E ects, idéudvikling, datavisualiseing og animationsprincipper. I forbindelse med projektet arbejdes med en animatic. - Modul 4/3 - WordPress themes 101: Her dykker vi ned under kølerhjelmen på et CMS, WordPress, og lærer at customize det, så det kan håndtere lige det indhold, vi har brug for til vores projekter. Vi kommer til at arbejde med PHP og tage et kig på databaser. En første udgave af websitet produceres. - Modul 5 - Avanceret Web Design: Dette modul introducerer avanceret Design-in-browser metode, hvor HTML, CSS, JavaScript/jQ og WordPress kombineres. Dertil arbejdes der med storytelling i web design, avanceret typogra sk kontrol, mikroanimationer og Adobe Animate, for at lave en veldesignet udgave af websitet. - Modul 6 - Projektiteration: I dette modul er i selv med til at de nere jeres opgaver på projektet. I vælger ét af to valgfrie moduler: Infographics eller SEO og landing pages. Dertil arbejder i videre med indholdsproduktion samt udvikling og design af webløsning, for at præsentere projektet i slutningen af ugen til en midtvejsevaluering. Dette markerer også slutningen på den første udgave af løsningen, hvor der primært tænkes på at lave et website. - Modul 7 - Socialt Web Design Research: I dette modul tages der hul på næste udgave af webløsningen, hvor fokus er at udvide løsningen til de sociale medier, så der ikke kun er tale om et website, men snarere en webpro l. Der skal laves yderligere research vedrørende brugerne, de skal involveres gennem Event Marketing, og der skal planlægges et bruger-rolle system, så brugerne kan bidrage til vores website samt de sociale medier. Dokumentation for webpro len a everes. - Modul 8 - User Contributions: Her ser vi på teknikken bag sociale websites. Med formularer og håndtering af formulardata skabes grundlaget for at brugere kan
bidrage med indhold på vores website. Brugerpro ler med forskellige rettigheder implementeres og owet for publicering af brugergenereret indhold overvejes. Webløsningen testes og a everes. - Modul 9 - SoMe Bootcamp: Strategi for brugen af sociale medier udvikles, og indhold til de sociale medier produceres og publiceres. De sociale medier overvåges og e ektmåles. - Modul 10 - APIer og avanceret WP: Integration mellem de sociale medier og vores egen webløsning gennem APIer og plugins. Introduktion til AJAX. Sikkerhed i webproduktioner. Websitet testes og klargøres til overlevering. - Modul 11 - Projektafslutning og præsentation: I dette modul er i selv med til at de nere jeres opgaver på projektet. Projektet skal gøres klar til overlevering, og alle resultaterne af jeres anstrengelser skal dokumenteres. Her har i mulighed for at nå alle de sidste detaljer inden projektpræsentationen, som afslutter forløbet. For yderligere detaljer vedr. de enkelte a everinger i modulerne, henvises til modulopgaverne, som udleveres i starten af hvert modul. Krav og formalia I forbindelse med løsningen af opgaven, er der en række formalia, der SKAL overholdes. - Opgaven løses i grupper á 1 til 3 studerende. INGEN grupper på mere end tre studerende accepteres - Grupperne skal registreres på Fronter - I skal lave en løsning, der har et vist omfang : Den skal løbende opdateres med nyt indhold, og brugerne skal have mulighed for at bidrage med indhold. Det er med andre ord ikke nok at lave en one-pager. - I skal selv nde en samarbejdspartner på projektet. Samarbejdet kan antage ere former: - Det kan være en virksomhed/organisation/kunde, I laver en løsning for - Det kan være en samarbejdspartner I går sammen med om at lave et nyt projekt (altså ikke samarbejdspartneres eget site, men en ny webløsning lavet i samarbejde med dem - co-branding). - Det kan være en samarbejdspartner, der deler informationer med jer - eksempelvis en organisation, der ved noget om et bestemt emne, som i kan bruge til udvikling af egen idé. -
- I SKAL have mulighed for at poste indhold på jeres website og de sociale medier. Laver I en case for en virksomhed/organisation/kunde, skal de derfor indvillige i at I publicerer indhold for dem, eller nde en kreative løsning for hvordan i kan arbejde uden begrænsninger og restriktioner fra virksomhedens side. Eksamen & vurderingskriterier 12. Uge af projektforløbet er i henhold til studieordningen en eksamen i multimedieproduktion, avanceret. Eksamen er mundtlig, varer 30 minutter, og foregår som et projektforsvar. Den studerende har først 5 minutter til at præsentere sit projekt, dernæst 15-20 minutters mundtligt eksamination og sidst 5-10 minutters votering og feedback. Der gives karakter efter 12-skalaen. Karakteren gives på basis af den studerendes viden, færdigheder og kompetencer i de emner, der behandles i løbet af forløbet. Viden, færdigheder og kompetencer for hvert emne vurderes ud fra følgende taksonomi: 1. Forklar begrebet (f.eks. mikroanimationer ) - vidensniveauet 2. Vis hvor I har implementeret det i jeres løsning (f.eks. hvor kan man se mikroanimationer i jeres løsning) - færdighedsniveauet 3. Redegør for hvordan i har implementeret det (f.eks. redegørelse af hvordan mikroanimationerne er kodet) - kompetenceniveauet Aflevering Hver gruppe a everer et link til den digitale løsning samt en præsentation i form af en PDF, der dokumenterer centrale aspekter af projektforløbet. Krav og kriterier for dokumentation udleveres mandag d. 31/10-2016. A evering sker via Wise ow senest den 04/11-2016 kl. 10.00. God arbejdlyst, Mvh 3. Semester teamet