Redesign af hjemmeside

FeelGood Bakery Redesign af hjemmeside Af Christian Severin, Kasper Bartholin, Michelle Demir & Julie Løchte - september 16 REDESIGN AF HJEMMESIDE 1

Analyse af FeelGood Bakeries hjemmeside Feelgood Bakery er en hjemmeside, der sælger glutenfri mel og mixes til at lave forskellige brød og kager. Feelgood Bakery s fokus er, at give deres kunder den bedste forudsætning for at kunne lave glutenfri bagværk gennem salg af mel og mixes. Dette kombineres med en lang række opskrifter, som kunderne kan lave derhjemme ved hjælp af Feelgood Bakery s produkter. Der er umiddelbart to aspekter af afsenderens, Feelgood Bakery s, mission: At være en one-stop destination for mennesker som lider af glutenallergi, men også mennesker, som ønsker at leve en sundere livsstil uden gluten. De ønsker derfor at skabe en webshop med fokus på sundhed og velvære, hvor kunder kan komme tilbage og vide med sikkerhed hvilke produkter, de kan købe. Wireframes over Feelgood Bakerys hjemmeside:!!! Grafiske virkemidler Når man først går ind på feelgoodbakery.squarespace.com er man bestemt ikke i tvivl om, hvad siden handler om. Forsiden består af mange billeder af bagværk, og dette bliver understreget af et full-screen baggrundsbillede med bagværk. Dog fungerer baggrundsbilledet også som et negativt grafisk virkemiddel, da navigation, som er placeret øverst på siden, er utydelig og svær at læse (se billede nedenfor). REDESIGN AF HJEMMESIDE 2

Siden er responsiv, hvilket også kommer til udtryk i navigation, der bliver til en drop down-menu i et mindre format. Første breakpoint sker ved 1016px, andet sker ved 777px og det sidste ved 625px. Lige efter navigation optræder virksomhedens logo på en gennemsigtig baggrund, som klart dominerer ved førstehåndsindtryk. Der bliver som udgangspunkt ikke brugt mange farver på hjemmesiden; derimod bruges full-screen baggrundsbilledet på næsten alle sider, og der bliver derefter brugt samme hvide farve, men med forskellige niveauer af opacity for at distancere indholdet. Den ene anvendte typografi er Adelle og bliver brugt både som display og body font. Der er altså ikke forskel på typografivalg mellem overskrifter og brødtekst. Den anden skrifttype, Helvetica Neue, bliver kun brugt i navigation, hvilket er et smule fragmenteret designvalg. Sproglige Virkemidler Generelt er sproget på Feelgood Bakerys hjemmeside velformuleret og forståeligt. Dog optræder der steder i deres tekst, hvor valget af sproget kan fremstå useriøst og dermed give læseren en useriøs opfattelse af bageriet. Dette kan give læseren et utroværdigt billede af deres produkter. På trods af at sproget nogle steder opstår en smule useriøst, er sproget velformuleret og forståeligt. De understøtter hertil deres troværdighed med kommentarer fra forskellige brugere og forklarer ligeledes om deres flere års knoklen i køkkenet for at opnå de bedste resultater. Man får dermed et billede af, at der ligger meget arbejde bag deres produkter, og at de tager det seriøst. Altså får man et indtryk af, at de kan stå 100% inde for kvaliteten af deres produkter, hvilket som kunde virker overbevisende. Teksten er skrevet i et personligt, talesprogsagtigt sprog. Mange steder bliver der refereres til kunden som du og der italesættes gentagne gange hvordan bagerens sortiment skal berige kundens privatliv, hvorfor tonen bliver personlig og henvender sig direkte. Som beskrevet overstående bliver der benyttet en afslappet tone med slang mm., som dog kan give hjemmesiden et lidt useriøst og uprofessionelt præg. Dog er tonen velegnet ift. stamkunder og bagerens hensigt om at skabe en hjemlig, tryg stemning. REDESIGN AF HJEMMESIDE 3

Strukturelle Virkemidler Hjemmesidens menu er placeret øverst på siden, og derfor bliver det nemt for brugeren hurtigt at finde den ønskede side. Alligevel er siden rodet, og når man fx vil gå ind på sidens webshop, åbnes denne i en helt ny fane på en ekstern hjemmeside. Siden har meget forskelligt indhold, både information om virksomheden og generel produktinformation. Der er udførlige beskrivelser af produkterne og svar på diverse spørgsmål, brugeren kunne have omkring gluten. Der er også en side med opskrifter, hvor kunden kan finde inspiration til at bruge FeelGoodBakery s produkter i sit eget køkken. Siden lykkes ved engagere brugeren gennem billeder, opskrifter og information om gluten. Desværre forvirres brugeren omkring, hvorvidt virksomheden sælger melmix og/ eller færdigbagte produkter, da siden ikke indeholder en klar opdeling af de to produktkategorier. Den forvirrende struktur betyder muligvis, at man bruger længere tid på hjemmesiden, men det er ikke udelukkende positivt, da det giver et negativt og utroværdigt billede af virksomheden. Research Når man sammenligner andre glutenfrie bageriers hjemmesider med Feelgood Bakery, er valget af layout meget forskelligt. Feelgood Bakery har lavet en hjemmeside med et layout, hvor der sker meget i forbindelse med billeder, information og farver, og hvor de har forsøgt at forholde sig inden for stilrammen ved brug af matte farver, der passer til brødet. Andre hjemmesider, der ligeledes sælger glutenfrie produkter, har valgt at bruge et mere simpelt layout. Man kan argumentere for, at Feelgood Bakerys hjemmeside indebærer flere elementer, hvorfor den visuelt virker mere interessant sammenlignet med andre. Hjemmesiden er responsiv og tilpasser sig både til tablet og mobil. Især mobilformatet er der gjort meget ud af, hvor menuen også bliver til en dropdown-menu. Hjemmesiden lever op til flere af tidens trends, men nogle gange bliver den også lidt uoverskuelig med mange små billeder og lange tekster. I stedet kunne de have valgt at fuldføre stilen med store baggrundsbilleder og korte formuleringer for at leve op til nutidens trends for hjemmesider. REDESIGN AF HJEMMESIDE 4

! Persona Målgruppe: Personer med glutenallergi/-intolerans Navn: Morten Alder: 45 Bopæl: København N Civilstatus: Gift Beskæftigelse: Pensionsrådgiver hos PFA Pension Gennemsnitlig årlig indkomst før skat: 450.000 kr./år Interesser Morten arbejder meget, hvorfor hans fritid er vigtig for ham. Han prioriterer familietid, så snart der er tid til det, hvilket desværre ofte kun er til morgenmad eller i weekenden. Morten nyder at afslutte dagen derhjemme foran tv et med noget sødt til tanden, hvilket ikke altid er let at finde for en glutenallergiker. REDESIGN AF HJEMMESIDE 5

Mediebrug Morten er ikke så aktiv på de sociale medier, men er oprettet på Facebook og LinkdIn. Han bruger mest tid på fjernsyn og telefon, sidstnævnte dog mest i arbejdsmæssige sammenhænge. Social adfærd Morten har mange gode kollegaer fra PFA, som grundet lange arbejdstimer er dem han omgås mest. Når han har et hul i kalenderen ser han sine tre bedste gymnasiekammerater til et glas vin eller til pokeraften. Han har derudover et sommerhus i Hornbæk, som ham og familien besøger, når det er muligt. Holdninger til kategorien Morten glutenallergi er enormt omfattende og fylder meget i hans hverdag. Det er svært at få det til at hænge sammen til sociale arrangementer med middage mm. samt i hjemme, da hans familie ikke lider af allergien. For Morten er det derfor enormt essentielt og til stor hjælp at bagerier som Feel Good Bakery findes. Det hjælper ham, når han spiser morgenmad med familien eller vil hygge sig med noget bagværk om aftenen. Målgruppe: Sundhedsinteresserede kvinder 20+ Navn: Cassandra Alder: 30 Bopæl: Frederiksberg Civilstatus: Single Beskæftigelse: Blogger Gns. Indkomst før skat: 300.000 kr./år (eksl. diverse sponsorater) Interesser Cassandra interesserer sig for sundhed og velvære og går meget op i at holde sig sund og smuk. Derfor deler hun sin hverdag med sine mange følere på sin blog mitperfektelowcarblife.dk. Hun elsker også at finde nye steder, hvor hun kan købe lækre, sunde måltider og helsedrikke, hun kan flashe på sit farverige instagram-feed. REDESIGN AF HJEMMESIDE 6

Mediebrug Cassandras job afhænger meget af de sociale medier, og hun er derfor flittig bruger af dem, da de holder hende opdateret på de seneste trends inden for kost og træning. Hun bruger derfor mange timer om dagen på facebook, instagram og andre konkurrerende blogs. Social adfærd Når Cassandra skal være sammen med sine veninder, holder hun meget af at sidde på en lækker café og vende verdenssituationen over en latte, der selvfølgelig er lavet på økologisk soyamælk. Holdninger til kategorien På trods af Cassandras store passion for at vedligeholde sin sunde livsstil, har hun også en sød tand. Derfor sætter hun stor pris på steder som FeelgoodBakery, der sætter fokus på, at man sagtens kan forkæle sig selv uden unødvendigt indtag af gluten. Koncept & idé Efter vores overvejelser omkring FeelGoodBakery s sproglige, grafiske og strukturelle udtryk, har vi lavet en opsamling på, hvad der fungerer og ikke fungerer på hjemmesiden. Der er mange problemer med designet og opdelingen af de forskellige subsider, hvilket gør det svært for brugeren at benytte hjemmesiden. Derfor vil vi lave et design, hvor vi stadig vil gøre brug af de mange inspirerende billeder, opskrifter og tekster, men hvor vi optimerer formidlingen af sitets budskab og indhold. Vi har derfor valgt at skære ned på antallet af sider i navigationen, så vi stadig beholder alt det nuværende indhold, men samler det på 1 forside og 4 subsider - Om, Webshop, Opskrifter, Kontakt. Vi ændrer farvepaletten, der ses på vores nye styletile og ændrer også lidt på skrifttyperne. Alt dette gør vi for at få websitet til at virke mere troværdigt og give en helhedsoplevelse, hvor brugeren også får et positivt indtryk af, at FeelGoodBakery er en levende virksomhed. Det vil vi opnå ved at indsætte bageriets instagram-feed på forsiden og ved at flytte testimonials, så de dukker op på forskellige sider. Vi har lavet wireframes og layoutdiagrammer til vores redesign - disse findes i Bilag 1 sammen med vores styletile over både den nuværende hjemmeside og vores redesign. REDESIGN AF HJEMMESIDE 7

Kodning Beskrivelse af test og testresultater Testen gav os mulighed for at lægge sidste hånd på vores site og gav os desuden en forsikring om, at vores hjemmeside er velfungerende og forståelig, i og med det er første gang den opleves af nogen, som ikke har arbejdet på det. Derfor gjorde brugertesten det nemmere at komme helt i mål og være sikker på, at redesignet er færdigt. REDESIGN AF HJEMMESIDE 8

Refleksioner over processen Vi har valgt at lave et redesign af FeelGood Bakerys hjemmeside med fokus på simplicitet og tilgængelighed. Derfor har vi benyttet en baggrundsfarve i stedet for et baggrundsbillede og organiseret billederne, så de får en funktion og giver et UI med en velorganiseret side. Vi har samlet teksten på i alt 4 subsider med UX i baghovedet og henblik på at øge brugervenligheden. Der er ingen ændringer i brødteksten, men da antallet af sider er mere end halveret, bliver det nemmere at skimme sig frem til den ønskede information. Grundet den uændrede tekst er sproget og måden, hvorpå bageriet henvender sig til brugeren, stadig det samme, men vi har forsøgt at optimere formidlingen og fjerne den forvirring, vi selv oplevede, første gang vi besøgte den originale hjemmeside. I vores proces har vi fået mulighed for at arbejde med development med lidt mere frie tøjler end vores stilarts-projekt, hvilket har været spændende og lærerigt. Det intense forløb gav en meget løsningsorienteret proces og gav samtidig anledning til at udnytte kompetencerne i gruppen til fulde. LINK TIL REDESIGN: http://christianseverin.dk/redesign/ USERNAME: kea PASSWORD: kea REDESIGN AF HJEMMESIDE 9

BILAG 1 Wireframes REDESIGN AF HJEMMESIDE 10

Layoutdiagrammer REDESIGN AF HJEMMESIDE 11

REDESIGN AF HJEMMESIDE 12

Styletile Styletile over nuværende design på hjemmesiden REDESIGN AF HJEMMESIDE 13

Styletile over vores redesign af hjemmesiden REDESIGN AF HJEMMESIDE 14