Grundlæggende webdesign

1. Grundlæggende webdesign

2. Dagens program • Kommunikationsstrategi • Målgruppen • Stil og genre på Take A Look • Brugervenlighed • Teknisk løsning • Tillid på nettet Grundlæggende webdesign

3. SWOT-analyse • (Strenghts – Weaknesses – Opportunities – Threats) Grundlæggende webdesign

4. Målgruppe - disposition • Hvorfor er det vigtigt at kende sin målgruppe? • Vores målgruppeanalyse? • Problemer ved vores tilgang til målgruppeanalysen • Problemer ved minerva-modellen • Hvordan kan man undersøge sin målgruppe på forhånd? • Hvordan kunne vi have gjort det bedre – forskellige strategier? Grundlæggende webdesign

5. Hvorfor er det vigtigt at kende sin målgruppe? • Hvis man kommunikerer bredt kommunikerer man i • virkeligheden til sig selv. • Trofasthed overfor produktet. • Tanken bag målgruppeanalyse er: • Mennesker er forskellige • Mennesker kan grupperes. Grundlæggende webdesign

6. Vores målgruppeanalyse • Katja Berglunds erfaringer lagde grunden. • Minerva-modellen gav basis for en beskrivelse af målgruppen. Grundlæggende webdesign

7. Vores målgruppeanalyse • ”Din målgruppe kan føres ind på værdikortet, så du får et unikt • kendskab til dens holdninger og handlinger – tit med overraskende • resultater og altid med stor præcision” • (http://www.acnielsen.aim.dk/produkter/livsstil/minerva/minerva.asp) Grundlæggende webdesign

8. Problemer ved målgruppeanalysen • Lukket frem for afsøgende tilgang. • Hvor godt kender opdragsgiveren sin målgruppe? • Bygger målgruppen på vores fordomme? Grundlæggende webdesign

9. Problemer ved Minerva • Det moderne menneske spiller mange roller (Goffman). • Say-do problematikken. Grundlæggende webdesign

10. Hvordan kan man undersøge sin målgruppe? • Åbne interviews med potentielle slutbrugere. • Observation (fx i et stormagasins make-up afdeling). Grundlæggende webdesign

11. Faser i produktionen Forslag til brugerinddragelse Målgruppeanalyse Feltarbejde (interviews og observation) Statisk designoplæg / koncept Samtale med brugergruppen om eksisterende sites & test af statisk designoplæg Implementering af design Testfase Løbende tænke-højt tests af prototyper + interviews Tænke-højt tests Hvad kunne vi have gjort bedre – strategier • Afsøge en ny målgruppe for make-up kurser via feltarbejde. • Undersøge home-party-målgruppen mere i dybden. • Brugerinddragelse. Grundlæggende webdesign

12. Design disposition • Æstetik i forhold til vores site • Designparametre indarbejdet i Take a Looks brugergrænseflade • Afprøvning af idé via mock ups • Justering af mock up Grundlæggende webdesign

13. De æstetiske regler • Kontrast forhold • Balance • Variation Grundlæggende webdesign

14. 5 Designparametre • Overskuelighed • Imødekommenhed • Enkelthed/stilrenhed • Professionalisme • Den selvbevidste bruger Grundlæggende webdesign

15. Overskuelighed 5 designparametre • Visuelt tyngdepunkt – blikfang – balance – kontrast • Typografisk opsætning – smalle spaltebredder – • punktopsætning • Diagonalkomposition understøtter læseretningen • Forbedringer • Større linjeafstand • Mellemrubrikker Grundlæggende webdesign

16. Imødekommenhed 5 designparametre • Glade farver • Personligt sprog • Forbedringer • Varme farver Grundlæggende webdesign

17. Enkelhed/stilrenhed 5 designparametre • HTMinimalism (Cloninger) • “Uncluttered, clean, quick loading gif’s and no nonsense • attitude” • CSS • Rene linjer Grundlæggende webdesign

18. Professionalisme 5 designparametre • Stilen har indlejret seriøsitet • Dokumentation af Katjas professionalisme Grundlæggende webdesign

19. Den selvbevidste bruger 5 designparametre • Livskvalitet og selvtillid via billeder og tekst Grundlæggende webdesign

20. Usability & teknik disposition • Brugervenlighed • Æstetik/brugervenlighed • Hvorfor valgte vi at bruge CSS • Problemer med koden Grundlæggende webdesign

21. Brugervenlighed • Hvad er brugervenlighed? • "... the effectiveness, efficiency and satisfaction with which specified users can achieve specified goals in particular environments“ • (ISO DIS 9241-11) • Effektivitet: I hvilken udstrækning kan et opgaveformål opnås • Lethed: Hvilken indsats der er nødvendig for at opnå et mål • Tilfredshed: Hvor meget brugeren føler sig hjemme med produktet • og hvor acceptabelt produktet er som et redskab til at opnå • brugerens mål • (Jordan) Grundlæggende webdesign

22. Problemer med brugervenlighed • Mindre problemer med brugervenligheden: Billederne • Afgørende problem med brugervenligheden: Navigation Grundlæggende webdesign

23. Æstetik / brugervenlighed • Brugervenlighed overfor æstetik • Balance Grundlæggende webdesign

24. CSS • Hvorfor valgte vi at bruge CSS • Downloadstid • Redigerbarhed Grundlæggende webdesign

25. Problemer med koden • For mange classes • Padding og margin • Centrering • Tabel • Browser vindue • Redefinere body tag • Html Grundlæggende webdesign

26. Tillid på nettet - disposition • Medieformer • Take a Look & tillid • Appelformer Grundlæggende webdesign

27. Tillid på nettet Medieudvikling Nettets natur – mangel på tillid ? Grundlæggende webdesign

28. Take a Look & tillid • Menneskeligt – Katja skal hjem til kunden • Professionelt – Katja bryder en intimitetssfære Grundlæggende webdesign

29. Appelformer • Logos • Ethos • Pathos Grundlæggende webdesign

30. Logos • Fornuft • Logik • Argumentation Grundlæggende webdesign

31. Anvendelse af logos på Take a Look • Synliggøre adressen • Referenceliste • Katja argumenterer for hvorfor hun tilbyder makeup-kurser: • ”At lære at lægge en make-up nemt, hurtigt og billigt er et ønske for de fleste kvinder. Derfor tilbyder jeg make-up kurser, der er designet til den individuelle deltagers behov og ønsker” Grundlæggende webdesign

32. Ethos • Ethos • Afsenderens troværdighed • Brugerne skal kunne aflæse denne • Anvendelse af ethos på Take a Look • De gode råd • Billeder som dokumentation Grundlæggende webdesign

33. Pathos • Følelsesmæssig appel • Visuelle appetitvækkerere Grundlæggende webdesign

34. Storytelling • Underbygge Take a Looks kerneydelser • Fremstille firmaet troværdigt (ethos) der taler til både følelser (pathos) og logik (logos) • Klaus Fog: • ” I en fortælling som taler i stærke billeder og skaber menneskelig identifikation, bliver værdierne sat ind i en dynamisk sammenhæng, som vi kan forholde os til” Grundlæggende webdesign

35. Bredbåndsbrugere • Kilde: Danmarks Statistik, Juni 2004 Grundlæggende webdesign