Archive for the ‘Design’ Category

Checkliste til planlægning af visuel kommunikation på vores website

januar 3, 2007

Eksplicit afsender
(Afsenderens intention med websitet)
1. Hvad vil afsenderen med sit website?

Implicit afsender
(Den ekspressive og de emotive funktioner)
2. Hvilke signaler og følelser vil afsender udtrykke om sig selv i websitet?
3. Hvilke visuelle og kommunikative virkemidler kan vi bruge til at formidle de signaler? (Komposition/layout, farver og deres sammensætning, motivvalg, illustrationer, typografiske valg, stemningsskabende udtryk, bevægelser, gestalter, etos, logos, pathos….)

Eksplicit modtager
(Undersøgelser af den kognitive, den konative og den emotionelle reception)
4. Hvordan skal websitet testes på målgruppen? (For at undersøge om målgruppen forstår websitet; om målgruppen kan finde rundt, om de ønskede signaler om afsender bliver formidlet)
5. Hvordan skal det testes om de faktiske brugere anvender websitet som planlagt, når websitet er taget i brug? (weblog, on-linespørgeskemaer…..)

Implicit modtager
(Den konative og de interaktive funktioner)
6. Har vi identificeret målgruppen?
7. Hvordan gør vi websitet nemt at orientere sig i og bruge for målgruppen?
8. Har vi tænkt over hvilke vigtige handlinger, vi gerne vil have brugeren til at gennemføre på websitet? (find, tilmeld, køb, stem, kommuniker….)
9. Hvordan kan vi bedst styre brugeren hen imod de handlinger, vi gerne vil have dem til at gennemføre?
10. Hvilken form for interaktion er absolut nødvendig? (Transmission, konversation, konsultation, transaktion, registrering)
11. Hvilke andre interaktionsformer kunne gøre websitet endnu mere attraktivt for afsender og/eller målgruppe?
12. Hvilke følelser skal websitet bibringe målgruppen?
13. Hvordan kan de følelser skabes?
14. Hvilke web-bruger-typer skal vi understøtte og hvordan? (Førstegangs-webbrugeren, den erfarne webbruger, websurferen og den internationale webbruger)
Produktet
(Den formale og den uudsigelige æstetiske funktion)
15. Hvordan gør vi websitet endnu mere kreativt, visuelt, lækkert?
16. Hvordan kan vi give målgruppen en større, bedre, anderledes, uventet – en ”jeg ved ej hvad-oplevelse”?
Konteksten
(Den referentielle og den intertekstuelle funktion)
17. Hvordan gør vi websitet let at komme i gang med at bruge?
18. Hvordan skal websitet ligne eller adskille sig fra andre af virksomhedens visuelle udtryk/figurer/slogans…. Eller fra andre lignende websites/medier?
Mediet
(Den fatiske og den navigative funktion)
19. Hvordan holder vi kontakten mellem websitet og brugeren og skaber oplevelsen af en rød tråd i websitet/ eller websitets dele (genkendeligt layout, design, typografi, farver, figurer)
20. Hvilke menu- og navigationsformer skal websitet have? (Funktionel, udforskende, narrativ, legende…)
21. Hvilken underliggende navigationsstruktur/informationsstruktur eller kombination af strukturer skal websitet anvende? (sekvens-, gitter-, hierarki-, hypertekststruktur)

Koden
(Den metakommunikative og den intersemiotiske funktion)
22. Hvilke billeder/motiver/andre elementer der refererer ud over websitet og giver særlige associationer (fra myter, legender, religiøse skrifter fx) kan evt. bruges til at understøtte/forstærke/visualisere de signaler og det budskab, der skal formidles?
23. Hvordan skal de visuelle elementer understøtte hinanden? (Skal der bruges en overordnet metafor og i givet fald hvilken? Skal billeder og andre visuelle elementer afløse eller forankre hinanden?)

Designproces

januar 3, 2007

Vi havde igennem projektet en længere design proces, hvor vi kom rundt omkring mange forskellige design. Vores design tog udgangspunkt i enkelthed, men sitet skulle stadig være ”smart”. Vi fandt derfor frem til sider som vi syntes indeholdt disse kriterier. Heriblandt fandt vi frem til google, skype, wishlistr og mange flere.
Vi vil her vise et udplug af vores design.

designudkast1.png

Ovenstående design er en af vores design, det har den lette baggrund, men falder igennem på det tunge grønne.

designudkast3.png

Det næste blev lidt mindre tungt, men er stadig for tungt.

designudkast2.png

Her er et andet design som igen er enkelt og let men måske for enkelt.

designudkast5.png

Til sidst kom vi frem til følgende design forslag som både var enkelt og visuelt tiltrækkende, syntes vi.
Senere i processen fandt vi imidlertid frem til ,at det var for enkelt, da det ikke var brugervenligt.

Herved kom vi frem til følgende ved at se lidt på andre design som www.wishlistr.com.

frontall.png

Usabillity

januar 2, 2007

Vi startede ud med at kode applikationen efter vores oprindelige design timepuzzle.kwark.dk, men måtte ændre både design og derfor også koden da vores tests viste, at sitet ikke var så brugervenligt, som vi regnede med.
I stedet for den informative tekst til venstre på applikationen, vil der være en informativ tekst første gang man benytter applikationen. Efterfølgende vil det kun være muligt at se denne tekst, hvis man benytter linket hjælp og vejledning.
Dette er gjort pga. det gav for meget spildplads, at have informationerne på sitet konstant.
Vi fandt også frem til, at det var nødvendigt med en deadline funktion, så brugerne kunne se, hvornår der var sidste frist for at afgive mødetidspunkt.

Punktet Organisation blev også slettet fra vores form, da det er muligt tilføje dette sammen med emne eller koordinator. Det resultere i færre felter der skal udfyldes, og derfor bliver det hele mere overskueligt.

Et andet punkt vi fjernede, var dobbelt mail. Det skulle ellers være muligt, at tilføje flere mail adresser, men det blev for rodet og forvirrende, så vi droppede den ide.

En helt essentiel ting vi ændrede på applikationen, var vores kalendere. Fra at kunne vælge enten datoer eller timer en bestemt dag, ændrede vi det til, at det skulle være muligt, at kunne gøre begge dele samtidigt. Hvis man var interesseret i, at arrangere et møde en bestemt dato kunne man vælde det, og herefter skulle det være muligt også at vælge et tidspunkt. Dette gjorde det meget mere overskueligt, og det var også en af de ting målgruppen havde problemer med at finde ud af.

Kalenderen er synlig med det samme man får siden frem, hvorimod på det gamle site skulle man selv vælge enten dato eller timer hvorefter kalenderen loadede.

Eftersom design layoutet er ændret, har vi også tilføjet den grønne farve, for at skabe fokus på de korte eksempler.

Vi har som skrevet, lavet tests og revurderet og ændret vores design flere gange. Dette har resulteret i, at vores applikation er blevet langt bedre, flottere og mere brugervenlig, men det har været problematisk at skrive rapport afsnittet – design. Vi har ikke fulgt planen om først, at lave design, derefter kode og til sidst skrive rapport, men derimod lavet tests til det sidste. Vi har måttet rette i rapporten derefter, og det har forrykket tidsplanen drastisk.

Opsætning af rapporten

januar 2, 2007

Opsætning af rapporten
Vi havde mange tanker om opsætningen af rapporten, da vi ønskede, at den skulle være funktionel og let at læse. Men samtidig visuelt tiltrækkende. Først satte vi den op vertikalt, da vi mente at dette gav muligheder for en mere visuel opsætning. Vi fandt imidlertid ud af at vi spildte for meget plads på dette. Hvorfor vi i stedet valgte at sætte den op lodret i to spalter. Herved overholder vi “reglen” om max 11 ord i længden pr. linie.

Vi valgte at sætte rapporten op i programmet word. Selvom det måske havde været mere multimedie designer agtigt at anvende indesign. Dette program tager imidlertid længere tid at sætte op i da der er mange flere funktioner. Opsætningen bliver dog også på mange måder bedre.
Hvis vi havde haft mere tid ville vi nok have sat den op i indesign.