Vig Festival

Ny hjemmeside

Hvordan kan vi skabe en ny platform for Vig Festival, der i tråd med deres brand, præsenterer billetsalg, kunstnere og praktisk information, der samtidig kan bruges både før, under og efter festivallen afholdes?

Grafiske elementer

Vig Festivals hjemmeside får sit udtryk fra årets tema, de lyserøde bølger og striber med gradiente lyserøde farver. Igennem Illustrator er det muligt at uddrage og fremhæve diverse elementer, der herefter er benyttet på hjemmesiden rundt omkring på hjemmesiden som baggrunde og baggrundselementer.

Eksempelvis på baggrunden i megamenuen, er der benyttet de bølgede streger, der kan laves i Illustrator ved hjælp af "Bland" funktionen, der kan benyttes til at blande former sammen og skabe overgange imellem form og farve.

De udfyldte elementer er lavet som former, der er udfyldt med et rundt gradient mesh layer, der går fra den lyserøde farve helt ned til en mørk rød nuance. Baggrunden er en almindelig oval gradient, der giver det let afrundede sorte omrids i bunden, der bliver lysere og lysere mod toppen af det grafiske element.

Hero sektionen

På vores hjemmesider, benytter vi custom fields, der gør det muligt for kunder selv at rette i tekster, billeder og knapper, der let flettes ind i hjemmesidens øvrige design.

I eksemplet til højre, ses Vig Festivals hero sektion, hvor det er muligt for kunden at ændre h1 overskriften, og dermed. Tekststylingen er lavet på forhånd, så tekstens vægt altid er fed, i versaler og samme skriftstørrelse, derudover er orddeling slået fra, i tilfælde af at teksten skulle gå på to linjer, hvor linjeafstanden også er forudbestemt.

Da det skal være muligt for kunden at ændre teksten regelmæssigt, giver det ikke mening at bruge mere avanceret tekst

Underside sektioner

Ligesom der i hero sektionen er oprettet custom fields der gør det muligt at oprette sektioner, til føje billeder, overskrifter, taglines, brødtekst og knapper med tekst.

På undersiderne er der udviklet tre forskille sektioner, tekst + billede, billede + tekst og centreret tekst. Her er det muligt for kunden selv at opstille deres side, selvom vi anbefaler kunder at variere mellem de tre sektioner for at skabe et naturligt flow i teksten.

På eksemplet til venstre ses en tekst + billede sektion, hvilket vil sige at teksten er på venstre side, og billedet på højre. Her er der defineret følgende custom fields og den givne styling;
Tagline, der har samme vægt som overskriften, men samme tekststørrelse som brødteksten, skrevet i versaler.
H2 overskrift, en fed overskrift der er den næst største på siden, for at skabe hierakti.
Brødtekst, venstrestillet brødtekst med løs bagkant, og en linjehøjde på omkring 1.3.
Knaptekst, CTA tekst med versaler i en lyserød boks.

Brødteksten er sat op i et WYSIWYG felt (What you see is what you get), hvilket vil sige at kunden her har frihed til at style kursiv, understreget og fed skrift. Derudover er det også muligt for kunden at indsætte links og punktform der også er stylet til at gå hånd i hånd med temaet, med blandt andet lyserøde linktekster.

I sektionerne med både tekst og billede, er der opsat styling a billedeboksene, der gør at billedet har samme højde som teksten, samt padding over og under teksten. Billedet dækker hele billedederammen uden at blive udstrukkede. 

Feed