STARTUP.DK 2.semester eksamen 2015 http://minimemo

Transcription

STARTUP.DK 2.semester eksamen 2015 http://minimemo
STARTUP.DK
2.semester eksamen 2015
http://minimemo.metteline.nu
FAKTAARK
PROJEKTTITEL
startup.dk
URL
minimemo.metteline.nu
SKOLE
Copenhagen Business Academy
HOLD
CLmul-a14e
ÅRGANG
2014
VEJLEDERE
Ditlev Vestergaard Skanderby
Marc Kluge
Frederik David Tang
Jesper Hinchely
Morten Rold
ANSLAG
71.318
HOVEDOMRÅDER
Design & Visualisering
Kommunikation og formidling
Interaktionsudvikling
Virksomheden
Email cph-mj420@cphbusiness.dk
Portfolio http://metteline.nu
Direkte http://metteline.nu/minimemo.html
Mette Line Tarp Jørgensen
Email cph-rl71@cphbusiness.dk
Portfolio http://rie-larsen.com
Direkte http://rie-larsen.com/minimemo.html
Rie Larsen
Email cph-st88@cphbusiness.dk
Portfolio http://simonetruelsen.dk
Direkte http://simonetruelsen.dk/minimemo.html
Simone Fie Truelsen
Email cph-ha105@cphbusiness.dk
Portfolio http://hma-design.dk
Direkte http://hma-design.dk/minimemo.html
Helena Maria Abel
2
INDHOLDFORTEGNELSE
INTRODUKTION
Indledning
Projektbeskrivelse
Problemformulering
Problemafgrænsning
IDÉUDVIKLING
MOODBOARD
METODE & TEORI
UDVIKLINGSMETODE PBS
WBS & Gantt-kort
Arbejdsprocess
BRAINSTORMING
PBS
WBS
GANTT-KORT
STAKEHOLDER
RISIKOANALYSE
VIRKSOMHEDEN
Elevatortale
Forretningsplan
Budget
S.W.O.T
Markedsanalyse
4
4
4
4
4
5
6
7
8
8
8
8
9
10
11
12
13
14
15
15
15
16
18
19
MÅLGRUPPE
Målgruppeanalyse
Personas
KOMMUNIKATION
Kommunikationsmodel
AIDA model
ANNONCE
Online/Offline annonce
Banner annonce
DESIGN BRIEF
FARVER
TYPOGRAFI
LOGOUDVIKLING
LOGOTEST
PRODUKTUDVIKLING
Skitser
Det endelige design
DESIGNUDVIKLING
Skitser
Wireframes
Mock-ups
Designprincipper
PRÆSENTATIONSDESIGN
INFORMATIONSDESIGN
NAVIGATIONSDESIGN
21
21
21
23
23
24
25
25
26
27
28
29
30
31
33
34
35
37
37
38
40
41
42
43
44
DESIGNMANUAL
INTERAKTIONSUDVIKLING
Pre-processed CSS
Responsivt design
SEO jQuery
Database
Use-case
ER-diagram
User-story
Prog. enhancement
Slideshow og annonce
BRUGERTEST
KONKLUSION
LITTERATURLISTE
BILAG
WBS GANTT-KORT Stakeholder Budget
Skydeskivemodellen Annonce Mock-up Use-case 46
50
50
51
52
53
55
59
59
60
61
61
62
63
64
67
68
69
70
71
72
73
74
75
3
INTRODUKTION
Indledning
Problemformulering
Miljøet er efterhånden både et meget omdiskuteret og relevant
område i dagens Danmark. Danskerne køber flere økologiske
varer, og vi fokuserer mere og mere på at skåne miljøet og
naturen, som vi skal give videre til de næste generationer. Dette
gør det åbenlyst at udvikle miljøvenlige og lærerige produkter
til børn, så samtidigt med de får en lærerig og brugbar oplevelse også får et indblik i en miljøbevidst hverdag fra barnsben
af.
Hvordan kan vi igennem en online/offline kommunikation motivere forældre til at købe en række lærerige og miljøvenlige
produkter til deres børn?
Projektbeskrivelse
Problemafgrænsning
Vi er en gruppe multimediedesignerstuderende der har
besluttet os for at starte vores egen virksomhed. Det skal være
en kommerciel virksomhed, som målretter vores forretning
mod et nichemarked.
For at indkræse vores projekt har vi lavet nogle afgrænsninger.
Vi skal udvikle nogle produkter, som kan promovere virksomheden og de ydelser vi tilbyder.
Vi skal udarbejde et website og en visuel identitet til vores nye
virksomhed.
Derudover skal vi lave en annonce, som skal gøre reklame for
vores nye virksomhed. Annoncen skal følge samme visuelle
udtryk som de øvrige produkter.
Til sidst skal der skrives en rapport der beskriver vores overvejelser, analyser, diskussioner, udviklingsproces mv. i forbindelse
med projektarbejdet.
• Hvilken målgruppe henvender vores virksomhed sig til?
• Hvordan kan vi markedsføre vores virksomhed mest hensigtsmæssigt?
Vi har i første omgang valgt at afgrænse vores målgruppe ned
til forældre med børn i alderen 4-6 år, for også at kunne afgrænse produkterne. Dette har vi gjort for at kunne fokusere
100% på de udvalgte produkter til den bestemte aldersgruppe.
Da børnene skal lære noget af disse produkter, er det vigtigt at
produkterne passer til målgruppen.
For at fokusere mest muligt på vores website, visuel identitet
og produkterne, har vi valgt at afgrænse budgettet i dette projekt.
Derudover har vi valgt ikke at gå helt i dybden med at beskrive
det pædagogiske og miljøorienterede aspekt, da vi ikke har
haft nok tidsressourcer og viden omkring dette.
Til sidst har vi valgt at begrænse vores udvalg af produkter. Vi
har brugt nogle få bogstaver og dyr, men vil i fremtiden udvide
med hele alfabetet.
4
IDÉUDVIKLING
Til at starte med at satte vi os i gruppen, hvor vi udarbejdede en
brainstorm, hvor vi kom op med en række ideer både til hvilken
form for virksomhed vi ville opstarte, og hvilken slags ydelser
og produkter indenfor multimedieområdet, vi ønskede at tilbyde.
Vi havde mange ideer oppe og vende, men vi blev hurtigt enige
om, at vi ønskede at opstarte en online virksomhed med en
tilhørende webshop, hvor det var muligt at tilbyde en række
produkter, som kunne promovere virksomheden og vores koncept yderligere.
Først havde vi en idé om at udvikle en webshop, som kunne
tilbyde grafiske plakater med forskellige motiver og størrelser,
men vi byggede hurtigt videre på ideen. Vi havde et ønske om
at kunne tilbyde flere produkter, og vores virksomhed skulle
dertil også have en række kerneværdier, som skulle være virksomhedens fundament. De udvalgte produkter endte med at
blive plakater, malebøger, drikkedunke og madkasser.
Vi valgte at ligge vores hovedfokus på miljøet, da det er et
meget omdiskuteret og relevant område både i dagens Danmark og på verdens plan. Vores produkter skulle være miljøvenlige uden kemiske stoffer for at skåne naturen, og hermed
også gavne ens egen sundhed.
Vi ville også gerne have, at denne række produkter skulle være
lærerige for børn fra 4-6 år, så samtidigt med at de ville lære
noget, ville børnenes forældre også få en mulighed for at gøre
deres børn miljøbevidste fra barnsben af.
Derfor gavner produkterne børnenes sundhed fra en tidlig alder. De lærerige produkter skulle også være til gavn for
børnenes indlæringsevne.
Vi har som udgangspunkt snakket om Jean Piagets udviklingsteori. Han mener nemlig, at børnene i vores målgruppe er sidst
i den præ-operationelle fase (2-6 år), som er lige før den konkret-operationelle fase (6-12 år). Her begynder barnet nemlig at
tænke logisk og systematisk. Vores mål er at forberede barnet
på den fase ved at give dem denne form for indlæring. Piaget
mener nemlig også, at barnets viden lagres i kognitive skemaer,
hvori at barnets erfaringer organiseres på et systematisk måde.
Barnet lærer nemlig i en form for tilpasning til miljøet, som
fagligt kaldes assimilation. Barnet forstår nye ting ved at indarbejde dem og tilpasse dem til de kognitive skemaer som de
allerede har.
Vores aldersgruppe kender allerede godt til de dyr, som vi gør
brug af, og tilpasser derfor til deres kognitive skemaer. Vores
formål med dette er f.eks. plakaten med tigeren og et ’T’. Barnet
ved, at dyret er en tiger, men kender nødvendigvis ikke bogstavet ’T’. Dette gør at barnet fremover vil associere T’et med en
tiger. På den måde tilpasser barnets indlæring sig til det kognitive skema.
I forlængelse med vores ide med Piagets udviklingsteori, har vi
også valgt et navn som går godt i spænd med vores koncept.
Da vi havde brainstormet en række forskellige navne, kom vi
hurtigt frem til Minimemo - Mini fordi at vores ’bruger’ af produktet er børn, og memo (memorize), fordi vores koncept går
ud på at barnet skal lære af produkterne.
5
MOODBOARD
6
METODE & TEORI
Vi har igennem vores analysedel brugt forskellige metoder og
teorier. Nedenfor har vi listet dem op for at få et overblik. De vil
løbende i rapporten blive beskrevet vist hvordan vi har brugt
dem.
S.W.O.T
Vi har brugt S.W.O.T analysen til at definere vores virksomheds
interne styrker og svagheder samt virksomhedens eksterne
muligheder og trusler.
PBS
Til at starte med lavede vi en PBS for at få et større overblik
over hvilken række produkter vi skal levere, og hvad disse skal
indeholde.
MARKEDANALYSE
For at finde ud af hvilke konkurrenter vores virksomhed har,
har vi benyttet os af skydeskivemodellen for at vise hvor der er
snæver og bred konkurrence.
WBS & GANTT-KORT
Noget af det første vi gjorde var at lave en WBS og et Ganttkort. Dette gav os et overblik over projektperioden, og vi havde
derfor bedre mulighed for at strukturere vores proces.
MÅLGRUPPEANALYSE & PERSONAS
For at finde ud af hvilken målgruppe vi henvender os til og for
at indkræse vores målgruppe, har vi lavet en masse research
og udarbejdet en målgruppeanalyse samt personas.
DESIGN BRIEF
Inden vi gik ordenligt i gang med projektet lavede vi et design
brief for at sætte nogle retningslinjer for os selv. Dette gjorde
det nemmere at komme i gang med resten af projektet.
AIDA MODEL
For at kommunikere med vores målgruppe og skabe den bedst
mulige måde opmærksomhed, har vi brugt AIDA modellen til
vores website.
STAKEHOLDER
Vi har lavet en power/interest matrix for at kunne forholde os til
hvor vores interessenter ligger henne og hvordan vi skal holde
dem informeret, tilfredstillet samt overvåget.
LASWELLS KOMMUNIKATIONSMODEL
Vi har brugt Laswells model til at redegøre for hvilke medier,
der benyttes for at kommunikere budskabet ud til en bestemt
målgruppe, og hvilken effekt budskabet får i sidste ende.
RISIKOANALYSE
Vi har udarbejdet en risikoanalyse for projektet for at få et overblik over hvilken række forhindringer der kunne komme undervejs, og hvilke konsekvenser disse kunne medføre.
7
UDVIKLINGSMETODE
Vi har gjort brug af planlægningsmetoderne PBS, WBS og
Gantt-kort til at udvikle vores projekt, da vi mente det var den
bedste måde at disponere vores tid og strukturere arbejdsopgaverne ordentligt.
Arbejdsproces
PBS
Hvis man kigger på det indledende arbejde i projektet er det
gået efter planen. Det skyldes, at det er ting, som vi har gjort så
mange gange før, at vi efterhånden kender processen godt.
Til at starte med lavede vi en Product Breakdown Structure
for at få et større overblik over hvilken række produkter vi skal
levere, og hvad disse skal indeholde.
WBS & Gantt-kort
Herefter udarbejdede vi en Work Breakdown Structure for at
opdele produkterne i mindre elementer for at gøre det nemmere at organisere vores arbejde yderligere. På vores WBS har
vi skrevet estimeret tid på, for at disponere vores tid ordentligt
fra start af – og hertil har vi også lavet et Gantt-kort, som viser hvilke dage vi har planlagt at lave hvad i arbejdsprocessen.
Gantt-kortet illustrerer projektets forløb i én helhed.
I dette projekt har vi nået alt det, som har været planlagt. Nogle ting er forløbet som forventet, mens noget andet har taget
både længere og kortere tid end forventet.
Derimod har vi brugt længere tid og ressourcer på at lave
websitet, fordi vi ikke har haft en lige så god fornemmelse af
hvor lang tid, at det ville tage. Undervejs er der nemlig opstået
en del komplikationer med databasen og vores responsive
design. Dog har det ikke haft den store betydning for vores
arbejdsproces, da vi har kunne tage tid og ressourcer fra vores
produktudvikling. Produktudviklingen har taget det halve af den
tid, som vi egentligt havde sat af til det. Derfor har vi også kunne
tage noget af den tid, og bruge på rapportskrivning- og opsætning i stedet.
Ud over disse projektudviklingsmetoder, har vi også gjort brug
af få elementer fra den agile udviklingsmetode Scrum. Hver
dag har vi haft et morgenmøde (daily scrum meeting) klokken
9. Her har vi hver især fortalt hvad vi har lavet derhjemme siden
dagen før (sprint backlog), og om der har været nogen forhindringer undervejs, som de andre kan hjælpe med. Når vi er
gået hver til sit om eftermiddagen, har vi også på forhånd aftalt
hvilke punkter på listen, som vi hver især skal lave færdige derhjemme til dagen efter (sprint review), hvor vores morgenmøde
starter.
8
BRAINSTORMING
Om
Webshop
Madkasser
Webshop
Forside
Produkter
Drikkedunke
Plakater
Navigation
Kontakt
Malebøger
Nyhedsbrev
Logo
Nyhedsbrev
Rapport
STARTUP.DK
Navn
InDesign
Annonce
Produkter
Målgruppe
Lærerigt
Miljøvenligt
Sociale medier
Børn 4-6 år
Visuelt design
Instagram
Mommy blogs
Forældrer
Facebook
9
PBS
Minimemo
Website
Rapport
Annonce
Responsivt design
Planlægning
Reklame
Visuel identitet
Designmanual
Illustrator
HTML, CSS & JS
Analyser, metoder
& teorier
Målgruppe
Webshop
Diskussion
Print & web
PHP & SQL
SEO optimering
10
WBS
Minimemo
Indledende
Indledende design
Website
Rapport
Produkter
Responsivt design
Rapportopsætning
Annonce
(2 timer)
(32 timer)
Målgruppe
Plakater
(3 timer)
(32 timer)
Idéudvikling
Moodboard
(8 timer)
(2 timer)
Brainstorming
Kodning
(8 timer)
Skitser, wireframes &
mock-ups (8 timer)
Problemformulering
Designvalg
(16 timer)
(3 timer)
Analyser, metoder &
teorier (68 timer)
Malebøger
(8 timer)
Designprincipper
PBS
Logo
Database
Designbrief
Drikkedunke
SEO optimering
Designmanual
Madkasser
(2 timer)
WBS
(3 timer)
Gantt-kort
(3 timer)
Forretningsplan
(8 timer)
(16 timer)
(16 timer)
(200 timer)
(24 timer)
(5 timer)
Tekster & indhold
(24 timer)
Validering
(3 timer)
(5 timer)
(8 timer)
Aflevering
Finpudsning
(8 timer)
(32 timer)
(32 timer)
(32 timer)
Konklusion
(8 timer)
Korrektur
(5 timer)
For at se vores WBS i stor se bilag 1
11
GANTT-KORT
Minimemo
Start
Slut
Dage
4
Maj
5
Maj
6
Maj
7
Maj
8
Maj
9
Maj
10
Maj
11
Maj
12
Maj
13
Maj
14
Maj
15
Maj
16
Maj
17
Maj
18
Maj
19
Maj
20
Maj
21
Maj
22
Maj
Man Tirs Ons Tors Fre Lør Søn Man Tirs Ons Tors Fre Lør Søn Man Tirs Ons Tors Fre
Indledende
- Idéudvikling
- Brainstorming
- Problemformulering
- PBS
- WBS
- Gantt-kort
- Forretningsplan
04.05
04.05
04.05
05.05
05.05
06.05
06.05
06.05
08.05
04.05
04.05
06.05
05.05
06.05
06.05
08.05
5
1
1
2
1
1
1
3
Indledende design
- Moodboard
- Skitser, wireframes, mock-ups
- Designvalg
- Logo
05.05
05.05
05.05
05.05
07.05
08.05
05.05
06.05
08.05
08.05
4
1
2
3
2
Website
- Responsivt design
- Kodning
- Designprincipper
- Database
- SEO optimering
- Tekster & indhold
- Validering
06.05
06.05
11.05
11.05
18.05
25.05
13.05
28.05
28.05
07.05
28.05
11.05
20.05
25.05
15.05
28.05
23
2
18
1
3
1
3
1
Rapport
- Rapportopsætning
- Målgruppe
- Analyse, metoder & teorier
- Design brief
- Designmanual
- Konklusion
- Korrektur
05.05
11.05
05.05
11.05
12.05
21.05
26.05
28.05
28.05
11.05
05.05
22.05
12.05
22.05
27.05
28.05
24
1
1
12
1
2
2
1
Produkter
- Annonce
- Plakater
- Malebøger
- Drikkedunke
- Madkasser
11.05
11.05
11.05
11.05
11.05
11.05
22.05
22.05
22.05
22.05
22.05
22.05
12
12
Aflevering
- Finpudsning
28.05 29.05
28.05 28.05
23
Maj
24
Maj
25
Maj
26
Maj
27
Maj
28
Maj
29
Maj
Lør Søn Man Tirs Ons Tors Fre
12
12
12
12
2
1
For at se vores Gantt-kort i stor se bilag 2
12
STAKEHOLDER
Vi har fundet en række stakeholders, som kunne være interesserede og har relation til vores virksomhed. Derudfra har vi
lavet en Power Interest Matrix for at illustrere hvad de har af
interesse og relation til vores virksomhed.
Keep satisfied
High
Manage closely
• Forhandler
• Målgruppe/købere
• Børn/brugere
• Investorer
• Leverandør
Power
Monitor
Keep informed
• Konkurrenter
• Bank
Det er vigtigt for os som virksomhed at målgruppen, som er
køberne og børnene som brugere er meget tilfredse. Uden
dem kan vores forretning nemlig ikke holdes kørende. Hvis
vores forretning ikke bliver holdt kørende, er investorerne ikke
heller ikke tilfredse. Da det er dem, som har lagt penge i vores
virksomhed, har de også meget stor interesse i, at forretningen
går godt. Derfor har vi også valgt at placere investorerne der.
Derudover skal vi administrere vores forhandlere nøje. Vi har
valgt placere dem på matrixen med både høj magt og høj
interesse. Det er vigtigt for os, at vi holder øje med at de sælger
vores varer, at de står de rigtige steder på hylderne. Omvendt
har de også stor interesse i at sælge vores produkter. Lidt længere nede i samme felt har vi placeret leverandører med mindre magt og mindre interesse. Selvfølgelig er det vigtigt at vi får
leveret det rigtige produkt, og at de har os som kunde. Dog kan
man vende den om og sige, at hvis vi er utilfredse kan vi hurtigt
finde en ny leverandør såvel som at de kan finde nye kunder.
Da vi ikke er de eneste på markedet, som forhandler denne
slags produkter, er de vigtigt for os, at vi følger med. Derfor
er vigtigt for os at overvåge vores konkurrenter og hele tiden
sørge for at vi er foran.
Low
Low
Interest
For at se vores matrix i stor se bilag 3
High
Vi har placeret banken, som en af dem vi skal holde informeret.
De har stor interesse i, at det går os godt, så vi kan betale vores
lån tilbage. Derudover er det jo godt for dem, at det går os
godt, når det er dem som holder på vores penge.
13
RISIKOANALYSE
Vi har udarbejdet en risikoanalyse for projektet for at få et overblik over hvilken række forhindringer og situationer der kunne
komme undervejs, og hvilke konsekvenser disse kunne medføre. Vi har udformet et analyseskema, som viser de forskellige
risici, og hvordan det er muligt at forebygge og håndtere dem.
Hvad kan gå galt?
Sandsynlighed
(1, 3 eller 5)
Konsekvens
(1, 3 eller 5)
Sandsynlighed x
Konsekvens
Hvad skal der gøres for at
undgå denne risiko?
Én eller flere af gruppens
medlemmer bliver syge i
perioden
3
3
9
De andre gruppe-medlemmer
må arbejde hårdere. Den syge
må eventuelt lave opgave
hjemmefra
Tidsplanen holder ikke
3
5
15
Prioritering af arbejdsopgaver
Andre forhandlere vil ikke
afsløre deres leverandører
5
1
5
Sammenligning af priser på
forskellige websites og
udregne estimerede priser på
vores egne produkter
Én eller flere computere går
ned uden backup
3
5
15
Uploade løbende på Dropbox
Gruppen kan ikke samarbejde
--> Uvenskab
3
5
15
Være åben for andre ideer,
snakke pænt og have respekt
Opgavekrav misforståes
3
5
15
Spørge lærerne ved tvivl
1 = Lille, 3 = Middel, 5 = Stor
Hvis sandsynlighed x konsekvens er lig eller over 15 = indsatsområde
Skema: Kompeto.dk
14
VIRKSOMHEDEN
Elevatortale
Vi Minimemo er en online virksomhed der forhandler miljøvenlige og lærerige produkter til børn i alderen 4-6 år. Vi sælger
plakater, malebøger, drikkedunke og madkasser, der er 100%
miljøvenlige for at gavne dine børns sundhed fra en tidlig alder.
Vores grafiske design er derudover med til at skabe en god,
udviklende og lærerig barndom for dine børn.
Forretningsplan
Når man opstarter en ny virksomhed er der forskellige faktorer
der spiller ind. Til at starte med er det vigtigt at udarbejde en
række budgetter – først og fremmest et etableringsbudget:
Hvor mange penge har man brug for at kunne starte sin virksomhed op? Derefter er det også vigtigt at overveje hvilke
indtægter og udgifter man forventer, at ens virksomhed vil
have. Dertil skal man også udregne om man har råd til at drive
virksomheden på længere sigt.
OPSTART & BUDGET
Vi ønsker at finde investorer og optage et lån i banken samt
supplere med en opsparing for at kunne starte vores virksomhed op, og i forbindelse med dette skal vi også have et
CVR-nummer. Herefter skal vi finde nogle passende lokaler,
hvor der samtidigt er lagerplads til produkterne, som vi ønsker
at sælge på webshoppen. Det er også vigtigt at have styr på
udgifter såsom lønninger, leverandørpriser og produktionsudstyr – herunder computere, som både skal bruges til grafisk
arbejde og modtagelse af ordrer fra kunderne.
MARKEDSFØRING
Desuden er markedsføring også en stor del af vores opstart,
da det er essentielt at markedsføre sit brand ordentligt for at
få kunder – og ligeså vigtigt at vælge hvilke mediekanaler man
ønsker at bruge. Derfor har vi valgt at bruge omkring 20% af
vores omsætning på at markedsføre vores produkter, hvilket
vi vil gøre i form af annoncer i diverse magasiner der rammer
målgruppen. Derudover vil vi også kontakte en række mommy-bloggere, hvor vi vil sponsere en række produkter til disse
for at få omtale på deres blogs. Til sidst vil vi udnytte al den
gratis markedsføring vi kan få på de sociale medier – både på
Facebook og Instagram.
PRISER & LEVERENDØRER
For at udregne priserne på vores produkter har vi været igennem en lang research. Vi har kontaktet allerede eksisterende
miljøvenlige virksomheder (www.helsebarn.dk, www.sebra.dk,
www.helsam.dk) for at forhøre os om indkøbspriser samt priser
for produktion hos leverandørerne. Dette gav desværre ikke
pote, da alle virksomhederne gerne ville holde informationerne
fortrolige. Efter lang tids research på internettet måtte vi erkende, at disse informationer ikke er tilgængelige. Vi har derfor i
stedet valgt at kigge på købsprisen på de forskellige produkter,
og herefter fundet nogle priser til vores egne.
15
WEBSHOP
Vores virksomhed har en webshop hvilket gør, at det er et vigtigt punkt at have en dankortaftale med NETS og en betalingskortaftale til internationale kreditkort med Teller for at kunne
gennemføre en internethandel. Hertil er der en række beløb,
som der også skal tages hensyn til i budgettet, såsom et oprettelsesgebyr, årlig abonnementspris og transaktionsgebyrbeløb
for hver handel på webshoppen.
I FREMTIDEN
På længere sigt ønsker vi at udvide vores sortiment for at
kunne tilbyde vores kunder et større udvalg af produkter. På
denne måde kan vi ramme og gøre flere kunder interesseret,
og herved også stå stærkere på markedet.
Budget
For at sætte et budget sammen har vi været på internettet og
søge priser på forskellige udgifter på fx lokale- og lagerplads
samt emballage, produktionsudstyr, revisor, telefon og internet
og så videre.
Budgettet viser vores regnskab for et år, så vi kan skabe os et
overblik over vores omsætning, udgifter og overskud.
Som vi har beskrevet tidligere i vores afgrænsning, har vi valgt
ikke at gå helt i dybden med vores budget, da vi har fokuseret
på at bruge mere tid på andre punkter i projektet.
Der er derfor en masse udgifter, som vi ikke har taget hensyn til,
men vi har bevidst valgt at tage især de største udgifter med.
Vores budget er lavet til, hvor vores virksomhed er om mindst 2
år, og hvor der er ordentligt gang i virksomheden.
På et år kommer vi til at have en omsætning på 15.000.000 kr.
og udgifter på omkring 10.345.951 kr. Vi har derfor et overskud
på 4.654.049 kr. om året.
16
Produkter solgt om måneden
Måneder
Omsætning om året (kr)
1250
1000
12
15.000.000
Antal
Månedlige udgifter (kr)
Måneder
Udgifter om året (kr)
40.000
15.000
12
12
5000
12
1.920.000
180.000
5.000.000
60.000
Omsætning
kr pr. produkt
Plakater A3
Plakater A2
Malebøger
Madkasse
Drikkedunke
300
400
200
200
150
Udgifter
Løn
4
Lokaleleje + lagerplads
1
Produktion (1/3 af omsætningen)
Emballage til levering
1000
Produktionsudstyr (Computer,
grafisk tablet, printer, kabler)
Kontorartikler (Stole, borde,
kontorartikler)
Revisor
Markedsføring (20%)
Betalingsservice
Telefon
Abonnement
Internet
Domæne
1
1
1
1
1
1
Andet
Andet
100.000
2700
250.000
1000
2299
299
235
32
12
12
12
12
12
12
30.000
32.400
3.000.000
14.000
2299
3.588
2.820
844
Inkl start- og årligt gebyr
Inkl domænenavn
10.345.951
Overskud
Overskud om året
15.000.000
10.345.951
4.654.049
4.654.049
For at se vores budget i stor se bilag 4
17
S.W.O.T
For at få et overblik og definere vores virksomheds interne styrker og svagheder samt eksterne muligheder og trusler, har vi
udarbejdet en S.W.O.T. analyse. Dette kan give et indblik i hvilke
fordele og ulemper vores virksomhed har og kan blive udsat
for.
STRENGTHS - STYRKER
• Produkterne er miljøvenlige uden kemiske stoffer, der både .. skader miljøet og børnenes helbred og sundhed
• Materialerne som produkterne er lavet af er høj kvalitet
• Produkterne er lærerige for børn, og de er hermed med til at .. udvikle dem
• Websitet er brugervenligt, så det er muligt at alle interessere.. de kan finde nemt kan navigerere rundt
• Vi kommunikerer på de sociale medier
• Vi er lettilgængelige, da vi har en webshop, hvilket gør uanset
.. hvor du bor i landet har du mulighed for at købe vores pro.. dukter
WEAKNESSES - SVAGHEDER
• Vores udvalg af produkter er begrænset
• Priserne er høje, da de bedste materialer er anvendt
• Vi tilbyder ingen innovative produkter, som ikke i forvejen er
.. på markedet
• Vores målgruppe (børn 4-6 år) er begrænset
OPPORTUNITIES - MULIGHEDER
• Vi kan udvide webshoppen med flere slags produkter
• Fysiske butikker, så køberen kan mærke og se kvaliteten før
.. de køber
• Markedsføring af vores brand i udlandet
• Udvide til en bredere målgruppe for børn i flere aldre
THREATS - TRUSLER
• Konkurrenter – Andre der forhandler produkter som vores
• Priskonkurrence med disse forhandlere
KONKLUSION
Minimemos styrker er, at vi tilbyder lærerige produkter til børn,
som samtidigt er miljøvenlige og lavet af den bedste kvalitet.
Vores website er dertil også brugervenligt, så alle kan interesserede købere kan navigere nemt rundt – og det er også
muligt at følge med på de sociale medier. Svaghederne er, at
vores udvalg af produkter ikke er særlig bredt og innovativt, og
vores priser afhænger også af vores materialer, hvilket gør dem
høje. Derved har vi også en række konkurrenter som forhandler
produkter som vores, hvilket også skaber en priskonkurrence. I
fremtiden har vi mulighed for at udvide med flere slags produkter, og også udvide til en bredere målgruppe af børn. Til sidst er
det også en mulighed at åbne fysiske butikker og markedsføre
vores brand i udlandet.
Vi har valgt ikke at lave en T.O.W.S. analyse af vores virksomhed,
da vi i opstarten ikke ønsker at ændre vores strategi. Vi vil i stedet for se situationen an.
STRENGTHS
WEAKNESSES
OPPORTUNITIES
THREATS
18
Markedsanalyse
Til at starte med, har vi udarbejdet en konkurrentanalyse, hvor
vi har gjort brug af skydeskivemodellen, som viser hvilke steder
hvor der snæver og bred konkurrence mellem vores virksomhed og andre lignende virksomheder.
Der er ingen virksomheder, som har præcis det samme sortiment af produkter til samme priser, som samtidigt også er
promoveret som miljøvenlige og lærerige. Dog er der en række
virksomheder som har samme slags miljøvenlige produkter til
både samme priser, lavere priser og højere priser, men ingen
af dem markedsfører, at deres produkter er lærerige og styrker
børnene til at få en lærerig oplevelse.
I forhold til andre virksomheder lægger vi altså stor vægt på,
at barnet får en lærerig oplevelse af vores produkter samtidigt
med, at de er miljøvenlige og ingen kemiske stoffer indeholder.
MARKEDSFØRING AF VORES PRODUKTER
Vi har valgt, at markedsføre vores produkter online i en webshop, da flere og flere køber ting på internettet, fordi det er
nemt og tidsbesparende. I fremtiden ønsker vi at åbne fysiske
butikker for at kunden får mulighed for at mærke og se produkterne i hånden, så det også er muligt at kommunikere ud
til dem, der bedst kan lide at købe deres produkter i en fysisk
butik.
Vi promoverer vores brand igennem annoncer både offline
og online og på de sociale medier. Dette gør vi for at få større
omtale, og derved også opmærksomhed. Via annoncer i magasiner rammer vi den målgruppe der ikke er aktive på de
sociale medier.
SOCIALE MEDIER
Vælger man at markedsføre sine produkter på de sociale medier, er der mulighed for at sparre med kunderne, og derved
kunne forbedre produkter i sortimentet, da man hurtigt får et
feedback på disse. Desuden får kunderne også et større indblik
i virksomheden, da det er muligt at følge med undervejs.
På de sociale medier koster det nødvendigvis ikke noget at
markedsføre sine produkter. Dog er det meget tidskrævende,
hvis der skal være fremgang i promoveringen, da der oftest skal
opdateres med nyheder. Fordelen ved at markedsføre på de
sociale medier er altså at både indtjeningen og kundetilfredsheden øges.
Vi ønsker at kommunikere ordentligt ud til kunderne og have
tæt kundekontakt, hvilket er derfor vi ønsker at markedsføre os
på de sociale medier. Det er innovativt at brande sig selv online
på den måde, og vi er sikre på at vi kan blive bedre og bedre
hvis vi modtager direkte feedback fra kunderne.
Se vores facebook profil (link)
Se vores instagram profil (link)
19
SKYDESKIVEMODELLEN
Skydeskivemodellen viser hvilke konkurrerende virksomheder,
som vi skal være opmærksomme på både nu og i fremtiden. I
den inderste cirkel ser vi de virksomheder der tilbyder samme
produkter til samme målgruppe til nogenlunde samme pris,
som vi gør. I næste cirkel har vi virksomheder, som tilbyder
samme produktkategori som os. I cirklen efter vises virksomheder som udbyder produkter der dækker samme behov. I
yderste cirkel kan man se hvilke virksomheder der udbyder
hvad som helst i samme målgruppe og i samme prisklasse.
Sportsmaster
Disney
Bog&Ide
Matas
IKEA
Fermliving
H&M
Arrogantshop
Ilva
Sebra
Stadium
Alfabetdyr
Rosenaa
Krea
BR
Designletters
Idemøbler
LEGO
Toys’R’us
For at se vores skydeskivemodel i stor se bilag 5
20
MÅLGRUPPE
Målgruppeanalyse
Vi forhandler en række miljøvenlige og lærerige produkter til
børn i alderen 4-6 år, hvilket gør at vores primære målgruppe
er forældrene, da det er dem der køber produkterne til deres
børn i denne aldersgruppe.
Ud over at kigge på de sociodemografiske variabler, bliver
køberens holdninger og værdier også vægtet højt når de vælger produkter til deres børn. Ud over de velhavende mødre er
der også en lang række mødre, som nødvendigvis ikke har
en høj indkomst, der prioriterer miljøet højt og herved bevidst
køber miljøvenligt til deres børn.
Når man kigger på hvilken slags forælder der er den ideelle
køber af sådanne produkter, så er der en række sociodemografiske variabler der spiller ind såsom alder, køn og indkomst,
og derudover kan forbrugerens holdninger, værdier og livsstil
også have en afgørende rolle i deres køb.
Den sekundære målgruppe til vores produkter er børn og andre familiemedlemmer, som kunne være interesseret i at købe
miljøvenlige og lærerige produkter såsom bedsteforældre.
Vi har derfor været nødsaget til at samle en række informationer ind for at kunne underbygge vores målgruppeanalyse, hvilket vi har gjort ved at besøge en række forhandlere
(Grønært, Ønskebørn, BabySam), som tilbyder samme slags
produkter til børn. Vi har udspurgt disse om købernes forbrugsmønstre, og hvilken slags købere der er til disse produkter,
hvor de alle stort set gav samme svar på hvilken profil køberen
har.
Den typiske køber af miljøvenlige produkter til børn er mødre
i starten af 30’erne, som har en gennemsnitlig til høj indkomst,
hvilket altså vil sige, at det primært er kvinder fra middelklassen til overklassen der er købere. Disse mødre har oftest flere
penge mellem hænderne, hvilket gør at de har råd til at fokusere på deres børns sundhed og helbred ved netop at købe
miljøvenlige produkter uden kemiske stoffer.
Personas
Ud fra de informationer og den viden vi har indsamlet hos de
forskellige børneforhandlere, har vi kunne udforme tre profiler,
som oftest køber produkter som disse.
DEN MILJØBEVIDSTE
Johanne (28) bor alene med sin søn
Oliver på 5 år i en andelslejlighed på
Østerbro, hvor hun til dagligt også arbejder i arkitektfirma. Johanne har fra en
tidlig alder været miljøbevidst anlagt,
og når hun handler ind, så vælger hun
altid økologisk. Hun går meget op i, at
de produkter hun køber til sig selv og
sin familie skal være miljørigtige uanset
prisen, og vil hellere betale en højere pris end at gå på kompromis med miljøet.
21
Da Johanne er enlig forsørger, er det ikke mange penge hun
har mellem hænderne når regningerne er betalt. Hun har lært
at prioritere sin indkomst gennem tiden – og miljøet er altid
kommet i første række.
Når Johanne vælger ting og legetøj til Oliver, vægter hun det
også ekstremt højt, at produktmaterialerne er miljøvenlige og
uden kemiske stoffer, da hun både ønsker at skåne miljøet,
mens hun samtidigt gavner hendes søns helbred og sundhed.
“JEG VIL DET BEDSTE FOR MIT BARN”
Tina (33) bor i et lille rækkehus i Hørsholm med sin mand Morten og deres
datter Isabella på 4 år. Til dagligt arbejder Morten som pedel på en skole i
nabobyen, og Tina er uddannet pædagog, og arbejder i en institution med
handicappede børn.
DEN VELHAVENDE
Eva (35) bor i en stor villa i Hellerup med
sin mand Jørgen og deres to drenge
Karl og William på henholdsvis 4 og 6
år. Til dagligt arbejder Jørgen som direktør i eget firma, og Eva selv arbejder
som privat læge. De har begge to en
høj indkomst, og deres forbrugsvaner
er også herefter. De har begge dyre
vaner, og de kunne aldrig drømme om
at købe discountvarer og gå ned på kvaliteten.
Dette gælder også når de køber ting til deres to børn. De ønsker den højeste og bedste kvalitet de kan få, som selvfølgelig
også skal være fri for kemiske og skadelige stoffer. De er villige
til at betale den pris for de produkter deres børn skal have så
længe materialerne er i top, og så længe at produkterne samtidigt er lærerige for deres børn.
Til sammen har de en gennemsnitlig indkomst, og når de
handler, er det discountbutikker som Netto og Fakta, så de kan
spare penge for at kunne få råd til andre ting, som de prioriterer højere såsom ting til Isabella.
Det er hovedsagligt altid Tina der beslutter hvilke ting, legetøj
og tøj der skal købes til Isabella, som er parrets første og
eneste barn. Disse produkter prioriterer Tina højt, da de skal
være det bedste af det bedste, da hun ønsker at forkæle og
gøre det bedste for sin datter. Hun går højt op i, at produkterne
skal være lærerige for Isabella samtidigt med, at de ikke skal
kunne skade hendes sundhed på nogen måde.
22
KOMMUNIKATION
Laswells kommunikationsmodel
Vi har gjort brug af Laswells kommunikationsmodel for at illustere hvad vi vil kommunikere ud, hvilken målgruppe vi ønsker
at kommunikere med, og på hvordan vi har tænkt os at få vores
budskab ud.
HVEM - AFSENDER
Vores online virksomhed Minimemo.
SIGER – BUDSKAB:
Vi tilbyder en række produkter, som samtidigt med at børnene
får en lærerig oplevelse, så er de også miljøvenlige, hvilket
både er til gavn for miljøet og for børnenes sundhed.
I hvilken kanal – Medie:
Online webshop: Vi markedsfører vores produkter på vores
online webshop, hvor det er muligt at købe dem.
HVEM
SIGER HVAD
ANNONCE: Vi ønsker at gøre kunderne interesseret i vores
produkter gennem annoncer i magasiner, som rammer målgruppen. Disse annoncer ønsker vi også annonceret på diverse blogs for mødre. Blogging er ved at blive meget udbredt
fænomen i Danmark, og dette giver i høj grad gode effekter på
markedsføringen.
SOCIALE MEDIER: Vi er til at finde både på Facebook og Instagram, hvor kunderne kan hente inspiration til deres børneværelser og følge med i udviklingen af nye produkter.
TIL HVEM - MODTAGER
Vores produkter er udviklet til børn mellem 4-6 år, hvilket gør at
vi ønsker at ramme forældre med børn i denne alder.
MED HVILKEN EFFEKT - EFFEKT
Børnene lærer og får en oplevelse ud af vores produkter samtidigt med, at de er miljøvenlige uden kemiske stoffer.
I HVILKEN KANAL
TIL HVEM
MED HVILKEN EFFEKT
Forældre med børn i
alderen 4-6 år
Børnene lærer og
produkterne er miljøvenlige
FACEBOOK
INSTAGRAM
Minimemo
Miljøvenlige og
lærerige produkter
Online webshop,
annonce og sociale
medier
23
AIDA model
Vi har brugt kommunikationsmodellen AIDA på vores website
for at beskrive på hvilken måde vores budskab bliver kommunikeret ud, og hvilken effekt vi ønsker websitet skal skabe.
ATTENTION
Det handler fra første øjekast om at fange brugerens opmærksomhed. For at gøre dette på den bedst mulige måde, har vi
valgt at placere en slider øverst på websitet på forsiden, hvor vi
viser en række billeder af produkterne og tekst. Da der er bevægelse i slideren, er det med til at skabe en vis opmærksomhed, så brugeren bliver interesseret.
INTEREST
For at bibeholde brugerens opmærksomhed har vi under slideren på forsiden placeret en række udvalgte produkter, som
demonstrerer hvad vi kan tilbyde. Dette skal gøre brugeren
mere interesseret i at klikke videre rundt på websitet og se
hvad vi yderligere kan tilbyde af miljøvenlige og lærerige produkter.
DESIRE
På vores slider har vi billeder af børneværelser med vores
produkter, hvilket er med til at appellere til brugerens behov.
Hertil har vi også indsat inspirerende billeder fra virksomhedens
Instagram-profil, som viser hvordan vores produkter kan vises
på forskellige børneværelser.
Vi har også valgt at indsætte tekst der beskriver, at vores virksomhed går ind for 100% miljøvenlige produkter samtidigt med
at det grafiske design også er lærerigt for børnene. Dette appellerer også til brugerens behov for at købe produkter som
disse til deres børn.
ACTION
På forsiden kan brugeren tage aktion ved klikke ”Se mere”
under udvalgte produkter. Derudover er der også mulighed for
at tilmelde sig et nyhedsbrev og tage kontakt til virksomheden i
navigationslinjen.
ATTENTION
INTEREST
DESIRE
ACTION
24
ANNONCE
Online/Offline annonce
For at reklamere og promovere vores nye virksomhed Minimemo, har vi udarbejdet en annonce, som vi tænker skal indrykkes i magasiner både i trykt form og online. Vi ønsker at
have annoncer i det trykte magasin ’Vores Børn’ samt online
magasinerne ’Børn og Fritid’ og ’Dit Barn’.
Eksempel på annonce i “Dit barn”
Disse magasiner retter sig specifikt mod den primære målgruppe, som vi ønsker kommunikerer til.
Annoncen følger det samme visuelle udseende, som vi udtrykker på vores website for at skabe en genkendelighed. Vi har,
som vi også fortæller i vores forretningsplan, valgt at bruge 20%
af vores omsætning på markedsføring af vores virksomhed.
Dertil har vi valgt, at vores annonce skal fylde 1/1 side i magasinerne.
For at se vores annonce i stor se bilag 6
25
Dynamisk banner annonce
Da vi også har valgt at fokusere på at markedsføre vores virksomhed på diverse mommy blogs, har vi også udarbejdet et
dynamisk banner, som vil blive vist mellem bloggernes indlæg.
Det dynamiske banner skal gøre brugeren interesseret og give
lyst til at klikke på reklamen for hertil at blive omdirigeret videre
til vores website.
Link til vores online dynamiske banner annonce.
26
DESIGN BRIEF
OPGAVE START
4/5 – 2015
AFLEVERING
29/5 – 2015
KONCEPT
Vi er en gruppe multimediedesignerstuderende der har
besluttet os for at starte vores egen virksomhed. Vi Minimemo
er en online virksomhed der forhandler miljøvenlige og lærerige produkter til børn i alderen 4-6 år. Vi sælger plakater,
malebøger, drikkedunke og madkasser, der er 100% miljøvenlige for at gavne dine børns sundhed fra en tidlig alder. Vores
grafiske design er derudover med til at skabe en god, udviklende og lærerig barndom for dine børn.
MÅL
• Vi skal udarbejde et website og en visuel identitet til vores nye
.. virksomhed.
• Derudover skal vi lave en annonce, der skal gøre reklame for ..
.. vores nye virksomhed. Annoncen skal følge samme visuelle ..
.. udtryk som de øvrige produkter.
MÅLGRUPPEN
Den primære målgruppe er forældre med børn mellem 4-6 år.
Den sekundære målgruppe er familiemedlemmer med relation
til børn i denne alder såsom bedsteforældre.
VISUELT DESIGN
Farver
Vi vil igennem projektet gøre brug af to farver, en lyserød og en
mintgrøn. Disse farver vil gå igennem både i vores logo, produkter, website og annonce. For at skabe en ro og kontrast vil vi
bruge lyse baggrunde.
Billeder og grafik
Vi har tænkt os primært at gøre brug af en masse grafiske materiale for at skabe opmærksomhed på vores forskellige medier.
Typografi
Skrifttypen skal være moderne, og frem for alt letlæselig, så
modtageren får mest muligt ud af den skrevne tekst.
Logo
Vi vil fra bunden lave et enkelt og tidsløst design i virksomhedens farver lyserød og mintgrøn.
• Til sidst skal der skrives en rapport der beskriver vores overve.. jelser, analyser, diskussioner, udviklingsproces i forbindelse .. ..
.. med projektarbejdet.
27
FARVER
Vi har valgt en lyserød og en mintgrøn som vores gennemgående farver, og hertil to grå og en hvid farve for at skabe
noget kontrast.
Både den lyserøde og mintgrønne farve har vi valgt i en pastelnuance for at give vores visuelle identitet et blidt design. Farverne er behagelige, men stadig iøjenfaldende. Disse to farver
fremhæver vores visuelle identitet. De ses i logoet, på alle vores
produkter og går igen ved flere elementer på websitet.
For at skabe noget kontrast til disse to farver, har vi gjort brug
af en mørkegrå, en lysegrå og en hvid farve. Den hvide farve
bruger vi som baggrund på websitet. For ikke at blænde brugeren med en helt hvid farve, har vi knækket den lidt og brugt
farvekoden #FCFCFC.
Til teksten på websitet har vi brugt den mørkegrå farve, da den
går godt sammen med pastelfarver. Den sorte farve ville ikke
passe ind i vores design, og derfor har vi ikke gjort brug af den,
selvom det ville være typisk.
Til sidst er der den lysegrå farve som vi bruger til footeren på
websitet, hover-effekten på vores submenu og andre små elementer på sitet.
LYSERØD
CMYK: 8/29/16/0
RGB: 235/197/200
HEX: EBC5C8
MINTGRØN
CMYK: 33/0/210
RGB: 183/222/213
HEX: B7DED5
MØRKEGRÅ
CMYK: 59/47/44/33
RGB: 96/98/101
HEX: 606265
LYSEGRÅ
CMYK: 8/5/6/0
RGB: 239/293/293
HEX: EFEFEF
HVID
CMYK: 1/1/1/0
RGB: 252/252/252
HEX: FCFCFC
Samlet set går vores farver godt med hinanden og skaber en
god harmoni. Dette er vigtigt, da det vil give brugeren en god
oplevelse, og på den måde få lyst til at købe vores produkter.
28
TYPOGRAFI
På vores website gør vi brug af ’Raleway Regular’ og ’Raleway
Light’. ’Raleway’ er en sans-serif font.
Vi bruger ’Raleway Regular’ til alle overskrifter på sitet for at
tydeliggøre, at det er en overskrift, og at man dermed kan
adskille det fra brødteksten på sitet. I brødteksten har vi brugt
’Raleway Light’, som er en anelse tyndere i vægten, og på den
måde adskiller de sig fra hinanden samtidig med at de egentligt har et ens udseende.
Generelt har vi brugt ’Raleway’ som font, da den er letlæselig
og har et moderne udtryk. På denne måde fanger vi både målgruppen og gør brug af en font, som ikke ses alle steder. Udover på websitet har vi også gjort brug af den på annoncen for at
skabe en genkendelighed i designet.
På vores produkter (malebøger og plakater) har vi gjort brug
af en lidt anderledes font, nemlig ’Orator Std’, som også er en
sans-serif font. Den har vi valgt, da den går godt i spænd med
vores simple design og hele konceptet. Denne font vises nemlig kun med store bogstaver, hvilket vi gør brug af, da det er
børnene, som skal lære at genkende bogstaverne.
RALEWAY
Raleway Regular:
ABCDEFGHIJKLMNOPQRSTUVWXZYÆØÅ
Abcdefghijklmnopqrstuvwxyzæøå
0123456789(!?”#&/;,:.)
Raleway Light:
ABCDEFGHIJKLMNOPQRSTUVWXZYÆØÅ
Abcdefghijklmnopqrstuvwxyzæøå
0123456789(!?”#&/;,:.)
Orator Std:
ABCDEFGHIJKLMNOPQRSTUVWXZYÆØÅ
Abcdefghijklmnopqrstuvwxyzæøå
0123456789(!?”#&/;,:.)
29
LOGOUDVIKLING
Da vi først havde valgt vores navn til virksomheden og fundet
målgruppen, gik logoudviklingen ellers hurtigt. Vi blev hurtigt
enige om, at vores logo skulle visualiseres med vores navn i en
håndskrevet skråskrift. Vi fik hurtigt skitseret det i hånden og
indsat det i Illustrator, hvor vi kunne tegne det op med værktøjet Malerpensel. Efterfølgende har vi ændret i kurverne, for at
give buerne en ensartethed.
Ved at udvikle vores logo på denne måde, kan vi nøjes med
at have vores navn som logo, da det bliver unikt ved at vi selv
udvikler det fra bunden af. Vi har gennem udviklingen hele
tiden forholdt os til, at det skulle være simpelt, nemt at huske,
tidsløst, samt vise hvem vi er.
Da vi allerede vidste at vi ville gå efter to pastelfarver, fandt vi
nogle billeder på nettet, som vi kunne bruges som inspiration.
Vi har fundet en farvecirkel og nogle neglelakker som er pastelfarvede. På denne måde valgte vi en mintgrøn og lyserød
farve til vores logo. Derudover har vi også brugt de to farver,
som vores gennemgående farver i designet af vores visuelle
identitet.
Vi har valgt pastelfarver frem for stærke og iøjnefaldende farver, da farverne skal være behagelige at se på. Vi har valgt både
at tage en mintgrøn og en lyserød farve, for at vise, at vores
produkter både henvender sig til drenge og piger.
30
LOGOTEST
Vi har en logotest for at undersøge hvordan vores logo fungerer og bliver modtaget af brugeren. Derudfra har vi valgt en
række spørgsmål, som brugeren har skulle svare på.
TESTPERSON 2
Sort/hvid logo
TESTPERSON 1
Sort/hvid logo
1. Hvad ser du?
”Minimemo. Det er en flot tekst. Jeg tænker på en lille bitte
memoblok.”
2. Hvem tror du står bag dette logo?
”Minimemo. Jeg tænker, at de måske forhandler små memoblokke.”
Farve logo
3. Hvad er din første tanke, når du ser logoet med farve?
”Det er noget børnetøj. Fordi at der står mini og farver, tænker
jeg at det har noget med børn at gøre.”
4. Hvad tænker du at virksomheden forhandler og hvem
forhandler de til?
” Børnetøjs brand, som forhandler til børnetøjsbutikker. Eller
måske sådan et lille spil. Evt. En huskeleg, eller noget andet
som børn lærer af.”
1. Hvad ser du?
”Minimemo. Det må være et navn på virksomheden. To ord sat
sammen.”
2. Hvem tror du står bag dette logo?
”En virksomhed elektronik eller noget legetøj. Det kunne evt.
Være sådan noget som Disney. Ordet memo minder mig i
hvert fald om elektronik, mens at mini får mig til at tænke på
børn.”
Farve logo
3. Hvad er din første tanke, når du ser logoet med farve?
”At det er noget som henvender sig til børn, både piger og
drenge fordi logoet er sammen sat af de to farver.”
4. Hvad tænker du at virksomheden forhandler og hvem
forhandler de til?
”Som sagt må det være noget til børn. Jeg tænker stadig på
noget elektronisk legetøj.”
31
TESTPERSON 3
Sort/hvid logo
1. Hvad ser du?
”Et ord sammensat af mini og memo. Det er skrevet i
skråskrift.”
Efter de tre logotests, som vi har gennemgået, kan vi konkludere at alle tre testpersoner forbinder vores logo med en virksomhed som henvender sig til børn. Der er ikke nogen som
direkte kan se hvilke produkter, som vi forhandler. Derimod
forbinder de det alle sammen med noget, der har med hukommelse at gøre. På den måde har vi konkluderet, at vores logo
fungerer.
2. Hvem tror du står bag dette logo?
”En virksomhed som måske sælger noget småt eller til små,
og derfor hedder det mini, mens at memo står for noget med
hukommelse.”
Farve logo
3. Hvad er din første tanke, når du ser logoet med farve?
”At det må være noget som henvender sig til børn, både
drenge og piger.”
4. Hvad tænker du at virksomheden forhandler og hvem
forhandler de til?
”Som sagt noget til børn i en tidlig alder. Det kunne evt. være
et vendespil, eller en anden form for noget, som børnene
lærer af.”
32
PRODUKTUDVIKLING
ILLUSTRATIONER
Vi har lavet en række dyremotiver, som skal være på vores
forskellige produkter. De er udviklet i Adobe Illustrator. Først og
fremmest har vi lavet dem med værktøjet ’pen’ i fri hånd samt
værktøjet ’ellipse’ og trukket i kurvene med pilen ’direkte markering’. Derfor har vi heller ikke lavet nogle skitser af dyremotiverne. Undervejs at vi brugt linealer til at holde motiverne inden
for nogenlunde samme størrelse.
Vores valg af farver er sket undervejs i udviklingen. Vi har både
forholdt os til dyrenes virkelige farve og sørget for, at de er
tonet, så de også går sammen med vores to gennemgående
farver lyserød og mintgrøn.
Vi har designet disse dyremotiver, så de både har et barnligt
udseende, men at barnet stadig vil kunne genkende dyret i virkeligheden. Derfor har det også været vigtigt for os, at vi nemlig
gik efter dyrets virkelige farve, former og genkendelige træk.
PLAKATER
Plakaterne er vores første og førende produkt. Alle plakater
er også udviklet i Illustrator. Vi har lavet en række forskellige
plakater med både den mintgrønne og lyserøde farve. Baggrunden består enten af den mintgrønne eller lyserøde farve,
og dertil har vi lavet et hvidt rektangel i kanten hele vejen rundt
for at give det effekten af en ramme. Dette er et fast layout for
alle plakaterne.
Den første plakat vi lavede var med et dyremotiv og dyrets
navn. Her har vi sat dyremotivet i midten og placeret navnet der
under. Som skrifttype har vi brugt ’Orator Std’. Det har vi gjort, da
det er en meget simpel skrifttype som går godt i spænd med
vores simple design og hele konceptet. Denne skrifttype vises
nemlig kun med store bogstaver, hvilket vi gør brug af, da det
er børnene som skal lære at genkende bogstaverne.
Dernæst er vi gået videre med en anden plakat, hvor at vi kun
tager forbogstavet og dyremotivet med. F.eks. vises et ’T’ med
en tiger. Her har vi bare gjort T’et større i skriften og minimeret
dyremotivet.
Ved at bruge de samme motiver og et fast layout, skaber vi en
ensartethed og skaber en genkendelighed i vores design.
MADKASSER OG DRIKKEDUNKE
Ligesom med plakaterne er vi gået efter at lave to produkter
med alle dyremotiverne, så produktet både fås i den mintgrønne og den lyserøde farve. Både madkassen og drikkedunken er allerede eksisterende produkter, som vi har bearbejdet i Adobe Photoshop og derved skabt vores eget produkt.
Vi har brugt ’markeringsværktøjet til at vælge det af produktet
som skulle være farve og dernæst brugt ’farveerstatningsværktøjet’ til at give det den mintgrønne eller lyserøde farve.
Dernæst har vi indsat dyremotivet og lagt nogle skygger for at
for det til at se mere ægte ud.
33
MALEBØGER
For at videreudvikle på det med at børnenes læring, har vi valgt
også at lave en malebog. Idet at barnet får lov til selv at sidde
og tegne og farvelægger øger de indlæringen. Malebogen er
fyldt med vores illustrationer af dyremotiverne, deres omgivelser og bogstaver.
Malebogen er udviklet i Illustrator. På omslaget er vi gået efter i fast layout, og det er muligt at få malebogen i både den
mintgrønne og lyserøde farve samt med et af hvert dyremotiv.
Layoutet er opsat på den måde, at vi har lavet en baggrund
som ligner ternet papir. Langs venstre kant har vi et smalt rektangel, som enten er mintgrønt eller lyserødt. Dertil er en overskrift hvor at der står ’Malebog’ i samme farve med skrifttypen
’Orator Std’, som vi også bruger på plakaterne. Derudover har
placeret dyremotivet centreret med omgivelser som passer
til dyret. Hunden står på en græsplæne med et kødben, mens
mariehønen står på et blad. Vi har gjort det på denne måde for
at børnene også skal lære om dyrenes omgivelser.
Skitser
LOGO PLACERING PÅ PRODUKTER
På plakaterne er logoet at finde på bagsiden, nede i højre
hjørne, og på madkasserne og drikkedunkene kan man finde
logoet i bunden af produktet. Logoet er her ingraveret, sådan
at det ikke bliver slidt af, På malebøgerne finder man logoet på
bagsiden, nede i højre hjørne.
34
Eksempler på det endelige design
MALEBOG
TIGER
35
36
DESIGNUDVIKLING
Skitser
37
Wireframes
Forside
Computer
LOGO
GLOBAL NAVIGATION
SLIDER
Forside
Tablet
LOGO
GLOBAL NAVIGATION
UDVALGTE PRODUKTER
SLIDER
Forside
Mobil
LOGO
GLOBAL NAVIGATION
UDVALGTE PRODUKTER
INSTAGRAM
UDVALGTE PRODUKTER
INSTAGRAM
INSTAGRAM
FOOTER
FOOTER
FOOTER
38
Om Minimemo
Computer
LOGO
OM
GLOBAL NAVIGATION
Webshop
Computer
LOGO
BILLEDE
Nyhedsbrev
Computer
GLOBAL NAVIGATION
LOGO
SUBNAVIGATION
GLOBAL NAVIGATION
NYHEDSBREV
ALLE PRODUKTER
ALLE PRODUKTER
ALLE PRODUKTER
ALLE PRODUKTER
ALLE PRODUKTER
ALLE PRODUKTER
FOOTER
Kontakt
Computer
LOGO
KONTAKT OG FORMULAR
GLOBAL NAVIGATION
KONTAKT OG FORMULAR
HANDELSBETINGELSER
ALLE PRODUKTER
ALLE PRODUKTER
ALLE PRODUKTER
FOOTER
FOOTER
FOOTER
39
Mock-ups
For at se vores mock-up over forsiden i stor se bilag 7
40
Designprincipper
ENKELTHED, ENSARTETHED & FARVER
I vores design har vi gjort brug af enkelthed og ensartethed.
Det har vi gjort ved hjælp af to gennemgående farver og ens
former. Vi har skåret alt det unødvendige væk, og på den måde
skabt en rød tråd gennem vores samlede design.
Dette henvender sig både til forælderene, som er køberne af
produktet, men også barnet som er ’brugeren’ af produktet.
Hos forælderen drejer det sig om, at vores website er enkelt og
ligetil. På den måde er det nemmere både at købe og udforske
den række produkter, som vi forhandler hos Minimemo. Barnet
derimod er i en aldersgruppe hvor for mange ting og detaljer
hurtigt kan skabe forvirring , hvilket bestemt ikke er vores hensigt med konceptet.
Vores farver, ensartethed og enkelthed skaber genkendelighed, som både kan ses på produkterne, websitet og annoncen.
BRUGBARHED & GRIDS
På websitet har vi vægtet brugbarhed frem for fleksibilitet.
Vores website henvender sig til forældre som skal købe et produkt. Dette betyder også, at modtageren ikke nødvendigvis er
en ekspert online, og derfor skal websitet være brugbart og let
at betjene.
For både at skabe en enkelthed i layoutet på vores website,
har vi gjort brug af grids i vores kodning. Grids holder nemlig
elementerne organiseret på en flade for at skabe en grundlæggende struktur, som sørger for orden i kompositionen.
Disse grids er delt op i tolv kolonner, og hjælper os med at skabe ensartetheden på forskellige skærme såsom smartphone,
tablet og computerskærmen.
LINJER
Ud over grids har vi også gjort brug af linjer. Først og fremmest i
menuen, men også produkterne står på linjer. Objekter som står
på linje opfattes nemlig som sammenhørende, hvilket har god
sammenhæng med en webshop. Dette skaber også struktur.
GENTAGNE EKSPONERINGER
Vores design indeholder også gentagne eksponeringer. Da
det er et nyt brand, har folk en neutral holdning til det og vores
design. Derfor er det nemmere at påvirke dem til den positive
holdning. Det har vi gjort ved at forsøge at holde os til et design,
som brugeren nemt kan forholde sig til og passer ind i dagligdagen. Vi har gjort brug af de gode gamle drenge- og pigefarver, nemlig mintgrøn og lyserød. Vi understreger ikke nogen
steder, at det er delt op i drenge- og pigeprodukter, men sådan
har det altid været delt op, og det er derfor nemmere at forholde sig til. Denne gentagne eksponering med farverne kan
også have en negativ effekt på en lille del af målgruppen. Der
er nemlig flere og flere moderne forældre, som er begyndt at
dyrke det med intetkøn, og at det hverken hedder han eller
hun, men derimod hen. Dette betyder at de ikke vil ”skubbe”
deres barn til at blive påvirket af samfundet og af drenge- og
pigeting.
41
PRÆSENTATIONSDESIGN
I vores design har vi fokuseret meget på at tydeliggøre, at vi
som Minimemo er afsenderen. Gennemgående har vi både
på vores website, i annoncen og på produkterne, brugt de to
samme farver til at fremhæve vores visuelle identitet. Derudover har vi også brugt ’Raleway Light’ som typografi over alt på
websitet, samt i annoncen. ’Raleway Light’ er en sans-serif font,
som vi har valgt at bruge, fordi den giver et moderne udseende.
På websitet har vi holdt os til et fast layout, og gjort brug af
grids i vores kodning, og derved har vi også gjort brug af gestaltlovene; nærhed og lighed. Objekter som står tæt på hinanden bliver opfattet som sammenhængende. På den måde
har vi skabt noget luft og på den måde danner objekterne en
ramme i sig selv. Det har vi gjort brug af i både menulinjen, boksene på forsiden og ved produkterne i webshoppen. Her har vi
også gjort brug af lighed ved at holde de grupperede elementer i samme størrelse og former. Objekter som ligner hinanden,
opfattes nemlig også som sammenhængende.
I vores faste layout har vi gjort brug af en klassisk opbygning. Vi
har startet med vores logo oppe i venstre hjørne, som kan navigere hjem til forsiden. Dernæst har vi en horisontal menu som
sidder i højre side.
På forsiden har vi en slider i main indholdet, som viser eksempler på produkterne og viser eventuelle tilbud. Formålet med
den er at give modtageren en præsentation af hvilke produkter
vi forhandler, og give inspiration til børneværelset.
140 px
140 px
140 px
140 px
140 px
140 px
140 px
140 px
140 px
42
INFORMATIONSDESIGN
I vores design af websitet, har vi lagt fokus på at vores informationer skal være konkrete og overskuelige. Vi har kigget på
hvad der er vigtigt at informere, og hvor at kunden skal finde
informationerne.
Vores menupunkter har vi holdt til minimum for at gøre det
nemt for brugeren at finde det som de søger. På produkternes
individuelle sider har vi givet en kort beskrivelse af produktet,
som forklarer hvorfor produktet er lærerigt og miljøvenligt.
Dernæst tydeliggjort produktets pris, farve og størrelse.
På siden ’Om Minimemo’ har vi fokuseret kort og præcist på
at beskrive hvem vi er, og hvad vores grundværdier og formål
med virksomheden er. Dette har vi nemlig undersøgt os frem til,
at målgruppen er interesseret i at vide. Ved disse informationer
skaber vi også troværdighed og loyalitet overfor vores kunder.
Da vi har holdt vores informationer på minimum, har vi også
lavet en kontaktside, som gør det nemt tilgængeligt for kunden,
at kontakte os. Her har vi både oplyst vores telefonnummer,
e-mailadresse og hovedkontorets adresse. For at skabe direkte
kontakt fra sitet, har vi også lavet en kontaktformular.
43
NAVIGATIONSDESIGN
Vi har lavet en global navigation, som er horisontal og placeret
oppe i højre side af websitet. Vi har fokuseret på at imødekomme brugerens forventninger til, hvordan en menu ser ud
og fungerer. Derfor har vi også vægtet funktionalitet frem for et
fancy design.
PLAKATER
Vi har valgt at gøre global navigationen horisontal frem for
vertikal, da det giver et bedre overblik for brugeren. Man læser fra venstre mod højre, og derfor har vi sat menupunkterne i
rækkefølge efter relevans. For at gøre informationsarkitekturen
mere logisk og tydelig er menupunkterne navngivet forståeligt.
Af udseende har global navigationen hverken nogen baggrundsfarve eller border. Som tidligere nævnt, har vi nemlig gjort
brug af gestaltlovene; nærhed og lighed. Det betyder også, at
vi har kunne nøjes med at gøre brug af underline på det menupunkt, som man befinder sig på samt når man hover.
På webshoppens side har vi gjort brug af en subnavigation,
som giver brugeren mulighed for at vælge mellem de forskellige produkter. Den har vi valgt at gøre anderledes af udseende
for at tydeliggøre, at det er en subnavigation. Dog ligner den
stadig en menu og er også horisontal.
Udover menuerne har vi lavet en simpel brødkrummesti, så
brugeren hele tiden har mulighed for at vide hvor at de er, og
linke tilbage til hvor de kom fra.
44
Sitemap
Minimemo
Forside
Om Minimemo
Webshop
Nyhedsbrev
Kontakt
Plakater
Plakater
undersider
Malebøger
Malebøger
undersider
Madkasser
Madkasser
undersider
Drikkedunke
Drikkedunke
undersider
45
DESIGNMANUAL
RETNINGSLINJER
LOGO
Logoet findes kun i én version.
LOGO / Gør altid brug af Minimemos originale logo
LOGOFARVE / Gør altid brug af logoets originale farver: lyserød
(#ebc5c8) og mintgrøn (#b7ded5)
Logoet er Minimemos navn skrevet i en håndskrevet skråskrift.
Logoet optræder i farverne: lyserød (#ebc5c8) og mintgrøn
(#b7ded5).
FARVER / Brug Minimemos farvepalet. Farverne må sammensættes frit efter behov.
Logoets skrift er sammenhængende, men adskilles ved brug af
de to farver.
TYPOGRAFI / Brug altid Minimemos skrifttyper. Den primære
skrifttype er ’Raleway Regular’, som bruges til overskrifter og
kortere tekster. Den sekundære skrifttype er ’Raleway Light’,
som bruges til brødtekst.
Logoet skal optræde på alle brugte medier.
På plakater og malebøger er logoet placeret på bagsiden i højre hjørne. Mens at det på madkasser og drikkedunke er at finde
indgraveret i bunden af produktet.
GRAFIK OG MOTIVER / Gør altid brug af motiverne barnlige
udseende og dyrets virkelige farver.
VIRKEMIDLER / Gør altid brug af ensartethed og genkendelighed
PRODUKTER / Brug altid de samme produkter, ved forøgelse
af motiver.
46
FARVER
Konceptet for Minimemos design er at den visuelle identitet
skal tydeliggøres.
PRIMÆRE FARVER
LYSERØD
CMYK: 8/29/16/0
RGB: 235/197/200
HEX: EBC5C8
MINTGRØN
CMYK: 33/0/210
RGB: 183/222/213
HEX: B7DED5
HVID
CMYK: 1/1/1/0
RGB: 252/252/252
HEX: FCFCFC
Vores primære farver bliver brugt i logoet og på vores produkter. Derudover skal de primære farver bruges til at tydeliggøre
elementer eller skabe opmærksomhed i annoncer og andet
markedsføring.
Vores sekundære farver bruges til baggrund på websitet, tekster og andre simple elementer.
Produkterne skal altid besidde én primær farve, mens at produktets motiver altid skal være dyrets virkelige farver i en pastel
nuance.
SEKUNDÆRE FARVER
MØRKEGRÅ
CMYK: 59/47/44/33
RGB: 96/98/101
HEX: 606265
LYSEGRÅ
CMYK: 8/5/6/0
RGB: 239/293/293
HEX: EFEFEF
47
TYPOGRAFI
Minimemos primære skrifttype er ’Raleway Regular’, som er en
stilren sans-serif font. Den har et moderne udseende som er
præget af den tynde vægt. Den bruges til overskrifter og kortere tekst, som f.eks. i annoncen.
Minimemos sekundære skrifttype er ’Raleway Light’, som har
samme udseende som ’Raleway Regular’, men har en tyndere
vægt. Den er letlæselig, og derfor gør vi brug af den i vores
brødtekster.
I vores produkter gør vi altid brug af ’Orator Std’. Det er også en
stilfuld sans-serif font, men vises kun i store bogstaver.
PRIMÆR SKRIFTTYPE
Raleway Regular:
ABCDEFGHIJKLMNOPQRSTUVWXZYÆØÅ
Abcdefghijklmnopqrstuvwxyzæøå
0123456789(!?”#&/;,:.)
PRODUKTETS SKRIFTTYPE
Orator Std:
ABCDEFGHIJKLMNOPQRSTUVWXZYÆØÅ
Abcdefghijklmnopqrstuvwxyzæøå
0123456789(!?”#&/;,:.)
GRAFIK OG MOTIVER
Alle Minimemos produkter skal besidde et dyremotiv. Et produkt skal findes i én af hver primær farve, samt med et af hvert
dyremotiv.
Skal sortimentet udvides, skal dyremotiverne stadig udvikles i
samme stil med et barnligt udseende. Samtidig skal dyret altid
vises med dyrets virkelige farve i en pastel nuance. Sortimentet
af produkter kan altid udvides, så længe at motiverne og elementer altid bliver placeret i samme position.
SEKUNDÆRE SKRIFTTYPE
Raleway Light:
ABCDEFGHIJKLMNOPQRSTUVWXZYÆØÅ
Abcdefghijklmnopqrstuvwxyzæøå
0123456789(!?”#&/;,:.)
48
VIRKEMIDLER
Som virkemidler skal der altid gøres brug af ensartethed og
lighed. Dette skaber genkendelighed i vores design, og er derfor vigtigt at forholde sig til.
Det drejer sig bl.a. om webshoppen, som viser Minimemos
produkter, hvor at den samme størrelse benyttes på alle produkterne.
49
INTERAKTIONSUDVIKLING
Pre-processed CSS
Vi har valgt at bruge pre-processed css - LESS til at style vores
website, da vi her har haft mulighed for at gøre brug af variabler
i kodningen. Dette har gjort det nemmere i det lange løb, hvis vi
har skulle ændre noget generelt på websitet fx en farve. Dette
vil også være en fordel samt tidsbesparende i fremtiden, sådan
at vi ikke skal ændre koderne i hele CSS’en, men kun få steder.
Vi har haft vores LESS filer gennem en compiler der har genereret vores CSS filer, som vi har samlet i et dokument, som vi
kalder ”styles.css” for at gøre det mere struktureret.
Vores ”style.css” dokument ser således ud:
Eksempel:
I vores ”base.less” dokument har vi stylet hele vores website,
men vi har stadig bevaret en struktur ved at holde undersiderne
adskilt med kommentarer.
Eksempel:
// Index
// Om
// Shop
// Nyhedsbrev
// Kontakt
I ”tablet.less” og ”mobile.less” har vi stylet indholdet på websitet,
så den virker på de tre forskellige skærmstørrelser; computer,
tablet og smartphone.
@import “simplegrid.less”;
@import “base.less”;
@import “tablet.less”;
@import “mobile.less”;
50
Responsivt design
Vi har valgt at kode vores website ved hjælp af Simpel Grid,
som er udviklet af Dallas Bass. Simple Grid gør det mere simpelt at arbejde med responsive layouts, da hele websitet består
af kolonner placeret ud fra valgte antal. Vi har valgt at lave
vores website, så den fungerer på tre forskellige skærmstørrelser.
Eksempel:
// TABLET CSS
@media screen and (min-width: 768px) and (max-width:
940px)
.col-3-12 {.col-4-12;} //mixin with less
.col-9-12 {.col-1-1;}
.col-2-12 {.col-3-12;}
• Stor skærm (Computer størrelse): Over 940px i bredden
• Mellem skærm: (Tablet vertikal): Over 768px og under
939px i bredden
Som man kan i eksemplet, har vi valgt at ændre de kolonner vi
i vores HTML-dokument har sat til at skulle fylde 3-12 kolonner,
til i stedet at fylde 4-12 kolonner på vores tablet.
• Lille skærm: (Smartphone vertikal): Under 767px i bredden
Vi har i vores ”simplegrid.less” dokument på forhånd bestemt
alle måleforholdene for vores kolonner. Nederst i dokumentet
har vi selv bestemt hvordan vi vil have kolonnerne til at ændre
sig i forhold til, om vi ser siden på en computer, tablet eller
smartphone. Nedenfor ses eksempler på vores responsivt design.
Eksempel:
// MOBIL CSS
@media screen and (max-width: 767px)
.col-5-12 {.col-1-1;}
.col-7-12 {.col-1-1;}
.col-4-12 {.col-1-1;}
.col-6-12 {.col-1-1;}
Som man kan i eksemplet, har vi valgt at ændre de kolonner vi
i vores HTML-dokument har sat til at skulle fylde 5-12 kolonner,
til i stedet at fylde 1-1 kolonner på vores tablet.
51
SEO -Søgemaskineoptimering
Det er en vigtig del i både salg og markedsføring, at ens website kommer op i søgeresultaterne på de forskellige søgemaskiner. Derfor har vi valgt at optimere vores website til søgemaskiner for at rangere så højt som muligt. Udover online og
offline markedsføring af virksomheden, er der en række ting
man kan gøre for at ens website ranker højere på søgemaskiner, som derved resultere i højere besøgstal.
Til at starte med har vi optimeret vores url’er for at gøre det
mere overskueligt og søgevenligt for brugeren. Vores url’er er
korte, mens de samtidigt indeholder keywords der giver mening.
Eksempel:
http://minimemo.metteline.nu/madkasse_elefant_lyseroed.
html
Dernæst har vi lavet unikke titler med relevante søgeord på
hver side på websitet. Titlerne er dem der bliver vist på søgemaskinerne, og derved dem der skal være fængende for at
tiltrække besøgende.
Vi har også valgt at gøre brug af ’meta tags’ i <head>, selvom
disse ikke har nogen effekt på at rangeringen på søgemaskinerne. Dog vil disse stadig dukke op i søgeresultaterne, hvilket
gør det vigtigt at have en tekst der fanger køberen.
Eksempel:
<meta name=”description” content=”Vores madkasser er
uden kemiske stoffer, som både er til gavn for miljøet og dit
barns sundhed. Vi har flere forskellige farver og motiver. Vi
tilbyder også plakater, malebøger og drikkedunke.”>
Til sidst har vi også skrevet ’alt tags’ på alle vores billeder, da
søgemaskinerne ikke kigger på billederne, men derimod på
disse ’alt tags’. Vores ’alt tags’ indeholder relevante keywords for
hvad billedet illustrerer.
Eksempel:
<img id=”produktbilledet” src=”img/plakat_tiger_blaa.png”
alt=”plakat_tiger”>
Eksempel:
<title>Minimemo | Plakater – malebøger – madkasser – drikkedunke. Bestil online nu – hurtig levering! </title>
52
jQuery
Vi har blandt andet brugt jQuery til at lave vores webshopbilleder på computerversionen, sådan at man kan hover over
billedet og få mere information vist i en gennemsigtig div. Når
man trykker på den gennemsigtige div kommer man videre ind
på produktbeskrivelsen.
Eksempel på hovereffekt:
Eksempel:
HTML
<div class=”col-3-12”>
<section class=”produkter”>
<div class=”imgHolder”>
<a href=”plaket_t_blaa.html”>
<img class=”shopfoto” src=”img/plakat_t_blaa.
png” alt=”shop”>
<div class=”semere”>
<h3>SE MERE</h3>
</div>
</a>
<a href=”plaket_t_blaa.html”>
<span>”Tiger med T”<br><br>SE MERE</span>
<div class=”billedtekstBG”></div>
</a>
</div>
</section>
</div>
jQuery
$(document).ready(function(){
$(‘#gallery span’).hide();
$(‘.billedtekstBG’).hide();
$(‘#gallery .imgHolder’).mouseenter(function(){
$(this).find(‘span, .billedtekstBG’).show();
});
$(‘#gallery .imgHolder’).mouseleave(function(){
$(this).find(‘span, .billedtekstBG’).fadeOut(‘fast’);
});
• I jQuery koden bliver der i starten bestemt, at når siden er
klar skal den Span der ligger inde i <div id=”gallery”> samt <div
class=”billedtekstBG”> gemmes.
• Herefter bliver der med en .mouseenter funktion bestemt, at
når vi fører musen over skal <div class=”imgHolder”> der ligger inde i <div id=”gallery”> finde (‘span, .billedtekstBG’). og vise
dem.
• Bagefter vil .mouseleave funktionen at de samme elementer
skal forsvinde igen ved hjælp af .fadeOut(‘fast’);
53
Vi bruger også jQuery til vores hamburgermenu, der kun er vist
på mobilsiden.
Eksempel på hamburgermenu:
HTML
<div class=”mobile-nav”>
<div class=”menu-btn” id=”menu-btn”>
<div></div>
<span></span>
<span></span>
<span></span>
</div>
jQuery
$( ‘.menu-btn’ ).click(function(){
$(‘.responsive-menu’).toggleClass(‘expand’)
});
• Når man klikker på hamburgermenuen (menu-btn) bliver klassen ”expand” tilføjet til ”responsive-menu”.
•.toggleClass skifter mellem hændelsesforløbet når man klikker på knappen. Den gør altså, at den bliver vist og bliver lukket
hver gang man klikker på den.
<div class=”responsive-menu hide-on-tablet hide-on-com”>
<ul>
<li><a class=”aktiv” href=”index.html”><p>FORSIDE</p></a></li>
<li><a href=”om.html”><p>OM MINIMEMO</p></a></li>
<li><a href=”shop.html”><p>WEBSHOP</p></a></li>
<li><a href=”shop.html”><p>- PLAKATER</p></a></li>
<li><a href=”shop.html”><p>- MADKASSER</p></a></li>
<li><a href=”shop.html”><p>- MALEBØGER</p></a></li>
<li><a href=”shop.html”><p>- DRIKKEDUNKE</p></a></li>
<li><a href=”nyhedsbrev.php”><p>NYHEDSBREV</p></a></li>
<li><a href=”kontakt.php”><p>KONTAKT</p></a></li>
</ul>
</div>
</div>
54
Database
Når brugeren tilmelder sig et nyhedsbrev, så ser det således ud
i vores database med deres informationer:
Vi havde fra start af et ønske om, at når brugeren tilmeldte
sig nyhedsbrevet, så skulle deres fornavn, efternavn og
e-mailadresse komme ind i en database, så vi nemmere kunne
holde styr på informationerne.
Vi gjorde brug af Adobe Dreamweaver til dette formål, hvor vi
oprettede et local site til at starte med. Vi brugte xampp som
server, som var vores localhost. Til at starte med oprettede vi
en database på phpMyAdmin. Denne kaldte vi for ’minimemo’
og heri oprettede vi en table kaldet ’newsletter’ med følgende:
’id’, ’fornavn’, ’efternavn’ og ’email’. Grunden til, at vi har valgt
både fornavn og efternavn, er så vi har mulighed for at gøre
nyhedsbreve personlige ved at skrive kun fornavnet.
Til sidst eksporterede vi denne til en live server dog i en ny database ved navn ’metteline_nu_db, da vi havde problemer med
at flytte hele databasen, flyttede vi kun vores table ’newsletter’
til en ny database.
På billedet kan man se, at ’id’ er vores primary key, og hvilke
andre funktioner vi har tildelt de forskellige kolonner i tabellen.
55
PHP/SQL
Da vi skulle forbinde vores database til vores php script lavede
vi først et eksternt script hvor vi definerede de konstanter der
skulle bruges til databasen:
<?php
define(“HOSTNAME”, “mysql24.unoeuro.com”);
define(“MSQLUSER”, “metteline_nu”);
define(“MYSQLPASS”, ”tkemz3”);
define(“MYSQLDB”, “metteline_nu_db”);
?>
Vi indsatte require_once(‘mm_const.php’); i vores nye php-fil i
toppen for at få det nye til loade disse konstanter fra det eksterne php script.
Vi lavede en form, hvor brugeren skulle kunne taste sine informationer ind og klikke på ”TILMELD”, hvor de herefter vil blive
sendt ind i databasen via serveren:
<form id=”signup” method=”post” action=”<?php echo $_
SERVER[‘PHP_SELF’]?>”>
<p>
<label for=”fornavn”>Fornavn:&#42;</label>
<input type=”text” name=”fornavn” id=”fornavn” data-validation=”required”>
</p>
<p>
<label for=”efternavn”>Efternavn:&#42;</label>
<input type=”text” name=”efternavn” id=”efternavn” data-validation=”required”>
</p>
<p>
<label for=”email”>E-mail:&#42;</label><input type=”text”
name=”email” id=”email” data-validation=”email”>
</p>
<p>
<input class=”knapkontakt” type=”submit” name=”submit” value=”TILMELD”>
</p>
</form>
56
For at få dette til at fungere indsatte vi dette php script i toppen
af vores php-dokument for forbinde til databasen når ”TILMELD”-knappen bliver trykket.
if(isset($_POST[‘submit’])) { $connection = new mysqli(HOSTNAME, MSQLUSER, MYSQLPASS, MYSQLDB);
if($connection->connect_error){ die($connection->connect_error); }else
{ echo “Forbundet!”; }
Herefter skabte vi forbindelse mellem formen og de forskellige
data i vores table i databasen.
$fornavn = mysqli_real_escape_string($connection, $_
POST[‘fornavn’]);
$efternavn = mysqli_real_escape_string($connection, $_
POST[‘efternavn’]);
$email = mysqli_real_escape_string($connection, $_
POST[‘email’]);
Dertil ønskede vi også, at databasen skulle melde tilbage, hvis
en bruger ønskede at tilmelde sig nyhedsbrevet med en email
der allerede var tilmeldt. Brugeren ville her for at vide, at de
allerede var tilmeldt nyhedsbrevet – og så have mulighed for at
bruge en anden email i stedet.
$exists = 0;
$check = $connection->query(“SELECT email from newsletter WHERE email = ‘$email’ LIMIT 1”);
if($check->num_rows == 1){ $exists = 1; if($exists == 1) echo “<p>Du er allerede tilmeldt vores nyhedsbrev!</p>”; else {
$insert = “INSERT INTO newsletter(id, fornavn, efternavn,
email) VALUES (NULL, ‘$fornavn’, ‘$efternavn’, ‘$email’)”;
if($connection->query($insert)){ echo “Du er nu tilmeldt vores nyhedsbrev!”; }else { echo “Ups! Der gik noget galt!”;
}}
}
Samme fremgangsmåde har vi brugt til vores kontaktformular, men denne har vi ikke forbundet til databasen. Vi har gjort
følgende, så når brugeren trykker på ”SEND”-knappen, så bliver
beskeden sendt til vores email, hvor vi kan læse brugerens
oplysninger og kommentar.
57
Hertil dette script som er indsat i <head>
<?php>
$to = ’info.minimemo@gmail.com;
$subject = ‘Henvendelse til Minimemo’;
$headers = “From: info.minimemo@gmail.com\r\n”;
$headers .= “Content-type: text/plain; charset=utf-8”;
$authenticate = null;
$message = “Tak for din besked - vi vender straks tilbage!”;
$mailSent = false;
if(isset($_POST[‘send’])){
$mailSent = mail($to, $subject, $message, $headers, $authenticate); }
?>
<script type=”text/javascript”> $(document).ready(function(){ var myLanguage = { badEmail : “<br>” + ‘Udfyld venligst e-mail adresse her!’, requiredFields : “<br>” + ‘Udfyld venligst!’, } $.validate({language : myLanguage}); });
</script>
JQUERY -FORM VALIDERING
Til de forskellige forms vi har udviklet, har vi gjort brug af javascript til at validere de forskellige informationer. Hvis relevante
felter ikke er udfyldt ordentligt, kommer der en note frem med
hvad der mangler at blive udfyldt.
Eksempler på koderne:
<input type=”text” name=”fornavn” id=”fornavn” data-validation=”required”>
<input type=”text” name=”email” id=”email” data-validation=”email”>
58
Use-case
ER-diagram
Figuren illustrerer hvad de to aktører kan foretage sig og hvad
deres funktioner er på websitet. Brugeren kan finde forskellige
produkter på websitet samt agere ved at tilmelde nyhedsbrev
og tage kontakt til Minimemo i kontaktformularen. Minimemo
kan oprette flere produkter på webshoppen, sende nyhedsbreve ud, slette brugeren fra nyhedsbrevslisten i databasen
hvis dette ønskes og være til hjælp i kundeservice.
Vores ER-diagram illusterer vores database, som består af en
række tabeller som viser hvilke data der er påkrævet. Dette gør
det mere overskueligt at forstå, hvordan systemet er bygget op.
Finde produkter
newsletter
PK
Oprette produkter
MINIMEMO
BRUGER
Tilmeld nyhedsbrev
Sende nyhedsbrev
id
fornavn
efternavn
email
Slette nyhedsbrevs registrering
Tag kontakt i formularen
Kundeservice
For at se vores use-case i stor se bilag 7
59
User-story
For at illustrere på hvilken måde vores webforms fungerer og
fejlmelder hvis der skulle opstå problemer undervejs (form-validering), har vi udarbejdet en user-story for registering af nyhedsbrev og kontaktoplysninger i formularen.
For at brugerens rigtige oplysninger i form af navn og email
adresse kommer igennem til os, har vi kodet formularen sådan
at systemet fortæller, hvis der opstår en fejl undervejs i registeringen ved at fejlmelde informationerne som er forkerte.
Ønsker brugeren at tilmelde sig et nyhedsbrev for at holde sig
opdateret, kan dette gøres nemt under ’Nyhedsbrev’, eller har
brugeren et spørgsmål til os, kan vi kontaktes blandt andet i
kontaktformularen under ”Kontakt” i navigationslinjen.
Det er ikke muligt at tilmelde sig et nyhedsbrev, hvis ens mail i
forvejen er i systemet. Dertil kommer denne fejlmeddelse:
Desuden er det påkrævet at skrive sit navn og emailadresse, og
hvis disse ikke er korrekt opfyldt, kommer denne fejlmeddelse:
60
Progressive enhancement
Slideshow og annonce
Progressive enhancement bygger på 3 lag
På vores website har vi et slideshow, som er lavet i Edge Animate. Billederne skifter ved at de henholdvis har en opacity på
0 eller 100.
Struktur - omhandler kun HTML
Design – omhandler kun CSS → eksternt stylesheet
Behaviour – omhandler Javascript osv. → eksternt javascript
For at undgå at lave inline styles har vi benyttet os at progressive enhancement.
Dette betyder at vi sikrer os at alle lagene fungerer uafhængigt
af hinanden.
Det vil altså sige, at vi har separeret alle HTML, CSS og og JS
filer fra hinanden. På modellen til højre ses, hvordan vi har struktureret vores mapper og filer.
Derudover har vi også lavet en online dynamisk banner annonce der er 30 sek lang.
Vi lavede et langt billede i Photoshop, hvorefter vi satte det ind i
Edge Animate og herefter køre billedet hendad som et banner
Hvad de begge har til fælles er, at vi har sørget for, at de bliver
ved med at fortsætte i en uendelighed.
Nedenfor ses koden vi har brugt, for at de ikke stopper efter
sidste billede, men som sagt bare fortsætter.
Mapper
CSS
HTML & PHP
sider
HTML &
PHP
JAVASCRIPT
IMG
61
BRUGERTEST
www.minimemo.metteline.nu
INDLEDENDE SPØRGSMÅL
Hvad er dit navn?
Hvor gammel er du?
Hvad er din civilstatus?
Hvilken uddannelse har du/ i gang med?
Hvor bor du?
Hvad er dine fritidsinteresser?
Kan du lide sushi?
SCENARIE 1:
Du har hørt om Minimemo, som er en lille virksomhed der
sælger miljøvenlige og lærerige produkter. Din veninde har lige
købt en plakat til datter. Plakaten er lyserød og der er mariehøne og et M for Mariehøne. Du overvejer også bestille denne
plakat, så du går ind og tjekker prisen på plakaten i en A2-størrelse.
SCENARIE 3:
Undervejs bliver du i tvivl, og vil egentlig gerne vide om produkter evt. Forhandles i nogle butikker i nærheden af dig. Så du
vælger at tage kontakt til Minimemo.
SCENARIE 4:
Efter dit køb, vil du gerne følge med i hvad der ellers sker for
Minimemo. Vælg hvorledes at du vil gøre dette.
EVALUERING:
På en skala fra 1-10, hvor nemt synes du at det er at finde rundt
på Minimemos hjemmeside?
SCENARIE 2:
Da du har fundet prisen, vil du også gerne købe en tilhørende
malebog. Så den går du ind og finder.
62
KONKLUSION
For at motivere forældre til at købe en række miljøvenlige og
lærerige produkter til deres børn gennem online/offline kommunikation, har vi udviklet et online website med en dertilhørende webshop, hvor vi har illustreret hvilke produkter vi kan
tilbyde samt lagt stor vægt på, at vi er miljøvenlige både til gavn
for miljøet og børnenes sundhed. Det grafiske design på produkterne skal give børnene en lærerig og brugbar oplevelse,
og dertil også motivere forældrene til blive mere miljøbevidste
med hensyn til valg af produkter til deres børn. Af offline kommunikation vil vi indrykke reklameannoncer for vores virksomhed og produkter i magasiner, som rammer målgruppen for at
påvirke dem til, at vores produkter er det bedste valg til deres
børn.
Vores sekundære målgruppe er børn og andre familiemedlemmer der har en relation til børnene såsom bedsteforældre. Disse kunne netop være interesseret i at forkæle deres børnebørn
med miljøvenlige og lærerige produkter.
Vi mente, at det var mest hensigtsmæssigt at markedsføre
vores virksomhed både igennem vores webshop og i magasiner, men også igennem de sociale medier. Vi havde fra start af
et klart ønske om at kommunikere ordentligt ud til kunderne
og have tæt kundekontakt, hvilket var muligt at få på de sociale medier. På de sociale medier kan vi nemlig kommunikere
direkte med kunden både gennem markedsføring, men også
kundeservice, da det er muligt at chatte direkte med kunden.
Vores virksomhed henvender sig til forældre med børn i alderen 4-6 år. Vi har indsamlet en række informationer hos forskellige forhandlere, der tilbyder de samme slags produkter til
børn for at underbygge vores målgruppeanalyse. Kigger man
på forældrene, er det oftest mødrene der køber produkterne
til deres børn. Mødrene er typisk i starten af 30’erne og har
en gennemsnitlig til høj indkomst, hvilket altså vil sige, at det
primært er kvinder fra middelklassen til overklassen, der er
købere. Disse mødre har oftest flere penge mellem hænderne,
hvilket gør at de har råd til at fokusere på deres børns sundhed
og helbred ved netop at købe miljøvenlige produkter uden
kemiske stoffer.
63
LITTERATURLISTE
BØGER
20 Designprincipper
af Ian Wisler-Poulsen
Grafisk Litteratur, 1. udgave, 2012
ISBN-nummer: 978-87-91171-75-8
Digital Media Management
af Louise Harder Fischer & Marie Oosterbaan
Nyt Teknisk Forlag, 3. udgave, 2010
ISBN-nummer: 978-87-571-2723-2
Usability
af Ian Wisler-Poulsen & Ole Gregersen
Grafisk Litteratur, 1. udgave, 2011
ISBN-nummer: 978-87-91171-93-2
WEBSITES
- Simple Grid udvikling
http://thisisdallas.github.io/Simple-Grid/ (besøgt d. 06/05/15)
- Guides til interaktionsudvikling
http://www.w3schools.com (besøgt i perioden 07/05/1528/05/15)
- Kompeto.dk – risikoanalyse model (teori)
http://www.kompeto.dk/bloggen/risikoanalysen-lige-savigtig-i-et-frivilligt-projekt-som-i-en-virksomhed/ (besøgt d.
07/05/15)
- Viden om Scrum-metoden
https://www.scrumalliance.org/scrum/media/ScrumAllianceMedia/Files%20and%20PDFs/Why%20Scrum/Core%20
Scrum%20Translations/Core-Scrum-Danish.pdf (besøgt d.
08/05/15)
- Ph.d. Lene Nielsen: ”10 trin til personas” (analyse)
http://personas.dk/wp-content/10-trin-til-personas11.pdf
(besøgt d. 11/05/15)
- Opstart af virksomhed – forretningsplan (teori)
https://startvaekst.virk.dk/opstart (besøgt d. 13/05/1515/05/15)
- Kristeligt Dagblad (Ritzau): ”Flere og flere køber økologi” Udgivet: 23/05/15 (artikel)
http://www.kristeligt-dagblad.dk/danmark/oekologi-bliver-billigere-og-salget-stiger
(besøgt d. 14/05/15)
- Skydeskivemodellen (markedsanalyse)
http://hhxelev.dk/skydeskivemodellen/ (besøgt d. 20/05/15)
64
- Magasiner og e-magasiner til annonceringen
http://voresborn.dk/ (besøgt d. 15/05/15)
http://bornogfritid.dk/ (besøgt d. 15/05/15)
http://issuu.com/freemags/docs/ditbarn9 (besøgt d.
15/05/15)
- Størrelse til annoncen
http://cdn.system.ipapercms.dk/iPaper/Files/3ee3ca7b-5fa242bd-a290-76e3982d44be.jpg?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cDovL2Nkbi5zeXN0ZW0uaXBhcGVyY21zLmRrL2lQYXBlci9GaWxlcy8qIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNDY0MjY1NzM1fX19XX0_&Signature=SPUGjIrRcVEc8~NDZOlZKYGKfoRibPKs74W7E--r6tSKcw9v1PVZpTRuqh8GGbwaYaIcRMJGlgh~m8x2N7Hm2WkAnmbpJwykNWHfVnOOkR~8khZPXN4oCZTw58OsG2-akOn1NsQ--tpdIrJh2cZAsVXEZKGgoMYI8iMRPiQI2p8_&Key-Pair-Id=APKAIPGQN6BDBMBZ2LCA&response-content-disposition=inline%3Bfilename%3DMediakit_2014_Teknisk_info_ugeblade_UK.jpg
(besøgt d. 18/05/15)
- Hamburger-menu med CSS og jQuery (guide)
http://www.internetkultur.at/simple-hamburger-drop-downmenu-with-css-and-jquery/ (besøgt d. 20/05/15)
- Søgemaskineoptimering
http://seoanalyst.dk/det-perfekte-seo-title-tag/ (besøgt d.
22/05/15)
- Sociale medier – markedsføring (vejledning)
http://www.atak.dk/sociale-medier/ (besøgt d. 25/05/15)
https://www.ibiz-center.dk/viden-om-it/sociale-medier/
hvad-er-sociale-medier (besøgt d. 25/05/15)
BILLEDER
- Persona: Den miljøvenlige (Søgeord på Google: Miljø kvinde)
http://www.lf.dk/~/media/ARKIV/Mennesker/I%20landbrug/
Landmand_kvinde_900_503.ashx?w=833
- Persona: ”Jeg vil det bedste for mit barn” (Søgeord på Google:
Stereotype mødre)
http://voresborn.dk/wp-content/uploads/sites/3/2015/02/
mette-leder.jpg
- Persona: Den velhavende (Søgeord på Google: Karrierekvinde)
http://wizemeup.dk/wordpress/wp-content/uploads/2015/01/R7P0254.jpg
- Navigationsdesign (teori)
http://jboye.com/da/blog/navigationsdesign-pa-store-informationswebsites-sadan/
(besøgt d. 21/05/15)
65
INSPIRATION
http://www.sebra.dk - Inspiration til at udvikle grafisk design til
madkasser og drikkedunke
http://www.alfabetdyr.dk - Inspiration til at opsætningen af
website og plakater
http://www.arrogantshop.dk - Inspiration til at opsætningen af
website
Billeder brugt til billedredigering til instagram-fotos:
Billede 1
Billede 2
Billede 3
Billede 4
Billede 5
Billede 6
Billede 7
Billede 8
Billeder brugt til annoncer:
http://thedesigninspiration.com/patterns/white-wall/
http://www.luxoliving.dk/ferm-living-wooden-frame-roegeteg/
http://www.luxoliving.dk/ferm-living-wallsticker-mini-butterflies/
http://www.houseandhold.com/ferm-living-mini-hearts-wallsticker-black.html
Billeder brugt til andet billedredigering:
http://www.hukit.dk
Billede 1
Billeder brugt til produkter
http://www.sebra.dk/da/drikkedunk-village-dreng/
http://www.sebra.dk/da/madkasse-village-dreng-465/
66
BILAG
67
WBS - Bilag 1
Indledende
Minimemo
Indledende design
Website
Rapport
Produkter
Responsivt design
Rapportopsætning
Annonce
(2 timer)
(32 timer)
Målgruppe
Plakater
(3 timer)
(32 timer)
Idéudvikling
Moodboard
(8 timer)
(2 timer)
Brainstorming
Kodning
(8 timer)
Skitser, wireframes &
mock-ups (8 timer)
Problemformulering
Designvalg
(16 timer)
(3 timer)
Analyser, metoder &
teorier (68 timer)
Malebøger
(8 timer)
Designprincipper
PBS
Logo
Database
Designbrief
Drikkedunke
SEO optimering
Designmanual
Madkasser
(2 timer)
WBS
(3 timer)
Gantt-kort
(3 timer)
Forretningsplan
(8 timer)
(16 timer)
(16 timer)
(200 timer)
(24 timer)
(5 timer)
Tekster & indhold
(24 timer)
Validering
(3 timer)
(5 timer)
(8 timer)
Aflevering
Finpudsning
(8 timer)
(32 timer)
(32 timer)
(32 timer)
Konklusion
(8 timer)
Korrektur
(5 timer)
Tilbage til WBS
68
GANTT-KORT - Bilag 2
Minimemo
Start
Slut
Dage
4
Maj
5
Maj
6
Maj
7
Maj
8
Maj
9
Maj
10
Maj
11
Maj
12
Maj
13
Maj
14
Maj
15
Maj
Man Tirs Ons Tors Fre Lør Søn Man Tirs Ons Tors Fre
Indledende
- Idéudvikling
- Brainstorming
- Problemformulering
- PBS
- WBS
- Gantt-kort
- Forretningsplan
04.05
04.05
04.05
05.05
05.05
06.05
06.05
06.05
08.05
04.05
04.05
06.05
05.05
06.05
06.05
08.05
5
1
1
2
1
1
1
3
Indledende design
- Moodboard
- Skitser, wireframes, mock-ups
- Designvalg
- Logo
05.05
05.05
05.05
05.05
07.05
08.05
05.05
06.05
08.05
08.05
4
1
2
3
2
Website
- Responsivt design
- Kodning
- Designprincipper
- Database
- SEO optimering
- Tekster & indhold
- Validering
06.05
06.05
11.05
11.05
18.05
25.05
13.05
28.05
28.05
07.05
28.05
11.05
20.05
25.05
15.05
28.05
23
2
18
1
3
1
3
1
Rapport
- Rapportopsætning
- Målgruppe
- Analyse, metoder & teorier
- Design brief
- Designmanual
- Konklusion
- Korrektur
05.05
11.05
05.05
11.05
12.05
21.05
26.05
28.05
28.05
11.05
05.05
22.05
12.05
22.05
27.05
28.05
24
1
1
12
1
2
2
1
Produkter
- Annonce
- Plakater
- Malebøger
- Drikkedunke
- Madkasser
11.05
11.05
11.05
11.05
11.05
11.05
22.05
22.05
22.05
22.05
22.05
22.05
12
12
12
12
12
12
Aflevering
- Finpudsning
28.05 29.05
28.05 28.05
16
Maj
17
Maj
18
Maj
19
Maj
20
Maj
21
Maj
22
Maj
Lør Søn Man Tirs Ons Tors Fre
23
Maj
24
Maj
25
Maj
26
Maj
27
Maj
28
Maj
29
Maj
Lør Søn Man Tirs Ons Tors Fre
2
1
Tilbage til Gantt-kort
69
STAKEHOLDER - Bilag 3
Keep satisfied
High
Manage closely
• Forhandler
• Målgruppe/købere
• Børn/brugere
• Investorer
• Leverandør
Power
Monitor
Keep informed
• Konkurrenter
• Bank
Low
Low
Interest
High
Tilbage til Stakeholder
70
BUDGET -
Bilag 4
Produkter solgt om måneden
Måneder
Omsætning om året (kr)
1250
1000
12
15.000.000
Antal
Månedlige udgifter (kr)
Måneder
Udgifter om året (kr)
40.000
15.000
12
12
5000
12
1.920.000
180.000
5.000.000
60.000
Omsætning
kr pr. produkt
Plakater A3
Plakater A2
Malebøger
Madkasse
Drikkedunke
300
400
200
200
150
Udgifter
Løn
4
Lokaleleje + lagerplads
1
Produktion (1/3 af omsætningen)
Emballage til levering
1000
Produktionsudstyr (Computer,
grafisk tablet, printer, kabler)
Kontorartikler (Stole, borde,
kontorartikler)
Revisor
Markedsføring (20%)
Betalingsservice
Telefon
Abonnement
Internet
Domæne
1
1
1
1
1
1
Andet
Andet
100.000
2700
250.000
1000
2299
299
235
32
12
12
12
12
12
12
30.000
32.400
3.000.000
14.000
2299
3.588
2.820
844
Inkl start- og årligt gebyr
Inkl domænenavn
10.345.951
Overskud
Overskud om året
15.000.000
10.345.951
4.654.049
4.654.049
Tilbage til budget
71
SKYDESKIVEMODEL - Bilag 5
Sportsmaster
Disney
Bog&Ide
Matas
IKEA
Fermliving
H&M
Arrogantshop
Ilva
Sebra
Stadium
Alfabetdyr
Rosenaa
Krea
BR
Designletters
Idemøbler
LEGO
Toys’R’us
Tilbage til skydeskivemodellen
72
ANNONCE
- Bilag 6
MOCK-UP - Bilag 7
USE-CASE - Bilag 7
Finde produkter
Oprette produkter
MINIMEMO
BRUGER
Tilmeld nyhedsbrev
Sende nyhedsbrev
Slette nyhedsbrevs registrering
Tag kontakt i formularen
Kundeservice
Tibage til Use-case
75