Forside til rapport

Således vil vores forside til rapporten se ud. Vi har brugt et billede som vi også bruger på én af vores undersider, da vi synes at post-its beskriver den generelle idéproces rimelig godt, hvilket er relevant for e-konceptuddannelsen. Vi genbruger desuden de runde former, som også kan ses på vores undersider.

online bannerreklame

En skitse til en eventuel online banner reklame.
Igen stemmer farverne og formerne overens med vores andre platforme. Desuden har vi prøvet at lege med fonten, således at den ikke ligner andre kedelige reklamer. Der må godt være noget originalt.

Vi har også gået med tanken, at lave reklamen offline - ved at komme dem i gratisaviserne el.lign.. Hvis dette blev realiseret, skulle vi overveje at gøre brug af QR-koder som på plakaten. Da behøver man at gemme aviserne, men blot scanne reklamen og få lagt sitet ind som bogmærke i telefonen.

IA på intranettet

Når man har logget sig ind på intranettet, vil man se både en horisontal menu og en vertikal menu (navigation), som tilsammen kaldes en ”inverted L”-menu. I den horisontale menu kan man navigere sig videre til en kontakt-side og en hjælp-side – derudover kan man trykke sig tilbage på forsiden. Den vertikale er derimod langt mere i centrum, da det er her, man kan finde de relevante oplysninger. Her kan man finde skemaet, opgaver, kalenderen, mails, lærerene og til sidst en side om fravær fra lærerenes side. Intranettets informationsarkitektur følger den hierarkiske struktur, da vi har en forside med et antal over-menupunkter, såsom dem der kan findes ude i den vertikale menu, men også den horisontale menu. Den følger dog ikke strukturen nøjagtigt, da der ikke er nogle ”levels” eller niveauer, altså der er ikke nogen yderligere undermenuer under menupunkterne. Den vertikale menu bliver altså ved med at se ens ud. Kort sagt, er der tale om et bredt hierarki uden niveauer.

Validering

SWOT og TOWS

Her er vores SWOT og TOWS, som vi først lægger ind på bloggen nu, da der løbende er blevet lavet ændringer i den.

Wireframe til intranet

Her er wireframes til intranettet.

Intranet

Som det kan ses i vores tidligere indlæg, har vi arbejdet på, at lave en app, som skal være en indgang til et intranet - vi har dog også fået designet intranettet i form af en webside, hvilket kan ses i dette indlæg.

Det første man kommer ind på, er denne side som kræver et login, før man kan fortsætte til den egentlige side.

Når man så er logget ind, kommer man ind på denne side. Som udgangspunkt, brugte vi www.lectio.dk som en inspiration, da vi alle sammen har brugt denne side i gymnasiet, og man kan sagtens sige at vi har savnet den, efter vi er begyndt på denne uddannelse. Lectio er en simpel og overskuelig side, men navigationen er derimod ikke optimal. Det er sådan, at der ikke følger nogen menu med på undersiderne, så man skal hele tiden gå tilbage til forsiden, for at kunne navigere videre. Dette har vi selvfølgelig valgt at rette op på, ved at den vertikale menu (boksen som er navngivet "navigation"), følger med på alle undersiderne. Derudover har vi valgt at lave en boks med de seneste opdateringer, så man nemt og hurtigt kan tjekke om der er sket noget siden sidst. Efter at have kigget på 46h-wikien (som vi multimediedesignere bruger), har vi også tilføjet de mange sociale medier som uddannelsen benytter. Til sidst, har vi valgt at bruge 46h billedet som et blikfang, da siden ville virke for "kedelig" uden billeder - derudover understreger det også, hvilken skole der er tale om. Vi har brugt de samme farver som på easj, og som vi bruger i vores webdesign for at skabe en sammenhæng.

Wireframes til webdesignet

Her er vores wireframes til webdesignet. Det giver et let og simpelt overblik over, hvordan vores side er opbygget.

Det fremgår tydeligt hvor simpel vores forside egentlig er, da det er "pæren" der skal tage opmærksomheden, og gøre siden interessant. Ser man derimod på vores undersider, sker der lidt mere, men der er fordi der bliver behov for endnu en menulinje (den horisontale), samt en vertikal menu. Derudover har vi leget med opstillingen af billeder. Undersiderne vil være opbygget på samme måde.

Endelige App design

Vores App ser således ud, hvor vi har valgt at have en simpel stil med det sorte, og så have den samme stil som vores subsite design, hvor vi har anvendt pæren som et faded baggrundsbillede. Og ellers har vi bare lavet strukturen standard..

Det første billede er vores forside, hvor den loader resten af siderne op. Dernæst ses login siden, hvor brugeren har et brugernavn og kode som man får på skolen. Når man så er logget ind, kommer man ind på menusiden, hvor man kan se alle menuer man har mulighed for at vælge. For at vise hvordan menuundersiderne ser ud, har vi lavet to menuundersider, Opgaver og Sygdom. Under Opgaver har vi valgt at opstille det således, at alle fag har hver deres menu, og der under er det som en kalender, hvor den studerende har mulighed for at gå ind og se, hvilke opgaver og bøger der skal læses til de næste dage. Sygdom undersiden har vi lavet således, at alle lærernes navne på studiet er der inde, derudover har vi en kommentarboks og et kryds, så når man trykker på krydset bliver det rødt, og det symbolisere at læreren er syg... og der har læreren mulighed for at give en kommentar - til bl.a. dato, opgaver, læsning osv.

Wireframes for App

Her er vores wireframes for app'en, så man kan se, hvordan den er struktureret på de enkelte sider.

IA for App'en

Det informations arkitektur mønster vi bruger til vores App, er den hierarkisk form for struktur, da vi har en forside med tilhørende undersider. Derudover er det en dyb struktur, da vi har et topniveau og en masse underniveauer.

Vi har lavet en struktur, hvor det er nemt for brugeren at komme frem til ”målet”, da brugeren kun skal bruge de 3 steps for at komme ind til det der ønskes.

Vi har lavet en vertikal navigation, da det på en smartphone er nemmere at scrolle ned, end det er at scrolle hen. Det at have denne navigation, gør også, at det er nemmere og hurtigere for brugeren at se, hvad der står på menuen.

Snak med Annette

Både i dag og i går fik vi snakket med Annette Finnsdottir, som underviser E-koncept-klasserne i design. I går stillede vi hende nogle spørgsmål angående vores uddannelses-sted, hvad der er godt, og hvad der kunne gøres om, samt skolens generelle behov på nuværende tidspunkt. Hun gav os desuden nogle forslag til, hvad vi kunne gøre i forhold til vores koncept - eksempelvis at spille på den nærhed der er mellem lærere og elever, i modsætning til KEA, hvor læreren ikke har tid til den hver enkelte elev.

I dag viste vi hende vores design for at høre hendes mening. Hun kunne godt lide vores måde at tænke på, og at vi havde lavet noget anderledes. Hun gav os nogle råd til, hvordan vi kunne forbedre undersiderne.

De sociale medier

På Facebook vil vi oprette en gruppe, hvor de studerende kan blogge, uploade billeder og dele tanker og ideer med deres medstuderende. Ideen er at det skal være et Forum, hvor man kan bl.a. kan søge hjælp til opgaver angående design, kodning etc..

For udefrakommende er det muligt at læse om E-Koncept uddannelsen, få overblik over skolens placering og få indblik i studieaktiviteterne. 

Koncept, budskab & slogan

Vi har tidligere i processen beskrevet vores koncept, budskab og slogan. Vi har lavet nogle ændringer efter vi har talt en del med Stine omkring vores design.

Konceptet:

Vores koncept går kort fortalt ud på at vi har designet en pære, som skal visualisere idéer og skal gøre "dig" klar over at det er den rigtige uddannelse at tage, sagt på en anden måde, pære skal lyse vejen frem. (Uddannelse er vejen frem)

Hvis vi skal gå mere i dybden med det, vil vi have folk skal se at det er en utrolig kreativ uddannelse fyldt med idéer og skøre tanker. Det er netop derfor vi har lavet en forside, som ikke er noget man ser mange steder. Vi vil være anderledes.  

Budskab:

Som det er beskrevet overstående, har vi arbejdet med budskab før, vi har valgt at beholde vores budskab, da vi stadigvæk føler det hænger sammen med vores koncept og det vi vil sende af signaler til vores modtagere. 

Budskabet lyder følgende:

 

Hvis du vil skabe et godt netværk samt udvikle dig på en kreativ måde, skabe idéer og beskæftige dig med de digitale trends så søg ind på E-konceptudviklingsuddannelsen på Campus Køge.

Slogan:

Vores tidligere slogan lød på følgende måde:

Gå den digitale vej.

Men da vi har ændret vores koncept en smule og vores fokus ikke kun ligger i "vejen frem," men derimod også pæren, har vi besluttet at ændre det.

Vi har hver især udviklet slogans som er:

• Følg lyset
• E-Koncept er vejen frem i lyset
• Skab/få lysende idéer
• Skab/få rullende idéer
• Vær en del af fremtiden
• Skab dit eget (lysende) univers
• Tænk ud af boksen  
• Brug pæren
• Før dine idéer frem i lyset
• Gå den kreative vej
• Skab idéerne her 
• Vi oplyser din vej frem 
• Følg lyset og brug pæren

Vi har været ude at teste vores slogans, og over halvdelen af dem vi spurgte, kunne bedst lide "Gå den kreative vej". Og dette slogan passer også til vores 3 ring target, hvor vores kerneværdi er kreativitet.

App udvikling

Dette er layoutet for vores app, når man har logget ind fra forsiden.

Endelige IA

Dette er vores Informations Arkitektur på vores endelige design af E-konceptudvikling uddannelsens subsite til easj.dk.

Vores Informations Arkitektur er lavet ud fra et hierarki, da vi anvender flere niveauer, altså vi har en forside, undersider og underundersider. Derfor er vores hierarki et "dybt" hierarki, da vi har et topniveau og flere underniveauer. Vores hierarki er også et "polyhierarki", da man kan finde det samme link flere steder på siderne, og det anvendes på hjemmesider med flere niveauer.

Vi kan ikke rigtig vurdere navigationsbaren på forsiden, fordi den er utraditionel, men umiddelbart mener vi, at det er en horisontal navigationsbar. På alle vores undersider har vi både en horisontal og vertikal navigationsbar, dette kaldes også en ”inverted L” navigationsbar.

Derudover har vi anvendt sitemaps på alle sider, så brugeren også har mulighed for at navigere sig rundt på en anden måde. Den type sitemap vi har anvendt, er det konceptuelle sitemap, da vi har topniveauer og under disse underniveauer, som viser, hvad der indenunder hvert menupunkt.

Digital dagbog

Ud fra vores persona, Kristine, har vi lavet hendes digitale dagbog. 

Kristine er en person som er afhængig af de digitale medier. Fra morgen til aften bruger hun enten sin smartphone eller computer til at holde sig opdateret hvad angår de sociale medier samt nyheder. 

Til og fra skole befinder hun sig i det offentlige rum, hvor der reklameres på busser, stationer, huse og andet, og det er her hun har tiden til at nærstudere plakater, flyers etc.. 

Netop derfor har vi lavet en plakat, som skal sættes op rundt omkring i Storkøbenhavn på stationer og busstoppesteder.

Desuden har vi overvejet bannerreklamer til busser samt en radioreklame på f.eks. The Voice (mange unge mennesker, som hører til målgruppen, lytter til denne kanal.)

Det er de færreste, der ikke hører musik/radio til og fra skole/arbejde hvad enten det er over bilanlægget eller smartphonen - og dermed er det oplagt at reklamere via dette medie.

To do-liste

1. Resten af subsite layout
2. Plakat
3. Bollemodellen
4. Socialemedier (Facebook/Twitter)
5. App
6. Scenarie af egen subsite
7. Problemfelt/problemstilling
8. Færdiggøre TOWS/SWOT
9. Ændring af IA-Analyse
10. Ændring af AIDA
11. Ændring af andre modeller? 
12. Andre modeller?
13. Gestaltloven
14. Hilman Curtis
15. Tage billeder til subsite
16. Færdigskriverapport - struktur
17. Rette grammatik osv
18. Indledning
19. Konklusion
20. Litteraturliste
21. Bilag
22. Kode subsitet
23. SEO
24. Validering
25. Uddybe koncept
26. Slogan
27. Perspektivering 
28. Interview
29. Usability test
30. interview
31. subsite univers
32. Design Intranet 
1. IA-analyse
2. Usability
3. Scenarie
33.  Koncept Hook
1. Nærhed 
34.  Wireframes
35. Begrundelse for valg af modeller

Moodboards

Dette er vores inspirationsmoodboard, hvor vi har fundet billeder af de elementer, som vi tænker på, når vi tænker på E-konceptudvikling uddannelsen.

Ud fra vores inspirationsmoodboard, er vi så kommet frem til dette præsentations-moodboard. Hvor vi er kommet frem til disse elementer. I farvepaletten har vi valgt farver fra easj.dk, samt sat ekstra for at gøre det til "sin egen". Så har vi valgt disse billeder, fordi de visualisere vores 3 ring target, og er med til at vise vores layout. Og vores typografi er Tahoma, hvis ikke det er samme som på easj.dk, så er det en der ligner easj.dk.





Plakat udkast

Ovenstående plakater er vores endelige. 

Den til venstre, sælger uddannelsen på baggrund af stemningsbilleder, mens den til højre lægger op til at uddannelsesinstitutionen er den eneste der tilbyder uddannelsen på dansk. 

For begge plakater er farverne genkendelige fra vores subsite samt app. Pæren er desuden integreret, så der udover farverne er en vis troværdighed.

Desuden har vi gjort brug af QR koder, som er den hurtige adgang til informationer i det offentlige rum. 

Idéudvikling

Udvikling

Vi har haft en samtale med Stine hvor hun sagde vores menubar ikke illustrerede en vej. Vi besluttede derfor at lave en brainstorm over hvad vi forbandt med ordrerne "vejen frem." Vi udviklede hver især, nogle idéer:


Efterfølgende gik vi i gang med at videreudvikle ideer med vores post-its fra i går af.
Vi havde hver i sær nedskrevet 4 ord, som vi syntes var studierelevante. Ud fra dem kombinerede vi forskellige ideer, og endnu engang blev ord udplukket.  

Følgende ord blev lagt i bunken:

- en pære
- en stige
- en lynlås
- retro stilen
- en labyrint

Vores content er lig med vores gamle layout, men selve menubaren er blevet mere enkel og ren. En horisontal menubjælke i mørk farve med x-antal menuknapper, som er relevante for sitet. Det som skiller sig ud fra det gamle koncept er, at det ikke er en vej, der skal illustreres, men at vejen frem bliver 'oplyst' af en pære.
En pære oplyser og får vejen synliggjort, som hvis det var en tunnel.

"Vores uddannelse er vejen frem i lyset"!

Lys symboliserer: ideer, glæde, liv/død, varme og vi tænker på en pære.

..."vejen frem i lyset"!  er lig med; vejen frem til succes. Det vil altså sige, at hvis du vælger E-koncept som uddannelse, er du garanteret et par iderige og innovative år og samtidig ser fremtiden lys ud - man får og opnår sin egen form for succes.    

 

På forsiden forsiden skal der desuden være en illustration af en pære. 

Vi har haft svært ved at komme op med noget originalt, så eftersom at pæren både står for ideer og lys, har vi brugt den ide, selvom den er set før. 

Vi havde de forskellige layout til testing. Pære-ideen er den, der fik bedst kritik, men vi fik at vide, at der stadig skulle udvikles på den. 

Vores testpanel havde svært ved at se uddannelsen integreret i designet.   

Denne ide, er en regnbue i enten traditionelle pastelfarver eller i easj.dk's farver. Vi ved alle, at for enden af regnbuen finder man skatten. Skatten er i dette tilfælde - succes - man er færdiguddannet!
Denne ide er udviklet ud fra vores gamle koncept, vejen frem. Regnbuen er lagt ned og forsvinder ud i et forsvindingspunkt.

Denne ide er igen udviklet ud fra det gamle koncept. Menubaren er holdt i sort og hvide/lyse farver. Menuknapperne er de hvide afmærkninger, men ser på de danske motorveje. Menubjælken er i sig selv en vej.

Hvis man ser på overskriften "E-KONCEPT" er t'et integreret i en pære. Ikke fordi der er blevet lagt betydning i t'et udover at det selvfølgelig betyder teknologi, som er det bærende for uddannelsen.
Pæren lyser op og menuknapperne fremhæves/oplyses, når der er en mouseover-effect.

Lynlås ideen var en anderledes ide, som sagtens kunne have været aktuel, hvis ikke det var fordi at kodningsdelen ville ville volde os problemer, eftersom vi slet ikke er faglig dygtige nok.