Forside
CV
  • Github

  • LinkedIn

Cølm Banner

Cølm

Github logo

Cølm

Github logo

Om Projektet

Frontend

Dette projekt fokuserer på udviklingen af en ny visuel identitet samt et proof-of-concept webshop-design for Nimo Skin’s kommende brand, cølm.

Projektet er udarbejdet i React med Vite som værktøj, hvilket har givet et hurtigt og effektivt udviklingsmiljø. Målet har været at skabe en engagerende og interaktiv side, hvilket er opnået ved hjælp af animationsbibliotekerne Motion og GSAP.

Til styling af siden har jeg anvendt Tailwind CSS, hvilket har gjort det enkelt at skabe en responsiv og moderne brugeroplevelse. Alt indhold på siden, herunder billeder skabt i Blender, samt design og animationer, er udviklet fra bunden.

Nimo Skin ønskede at udvikle en visuel identitet, der skiller sig ud fra deres eksisterende brand ved at fremstå mere minimalistisk, eksklusiv og moderne. Dette blev opnået gennem research af målgruppen, markedet samt Nimo Skin's værdier og visioner. Resultatet er et design og en webshop, der opnår netop dette.


Techstack

React
icon-React
Vite
icon-Vite
GSAP
icon-GSAP
Motion
icon-Motion
Tailwind CSS
icon-Tailwind CSS
JavaScript
icon-JavaScript

Snapshots

snapshot
snapshot
snapshot
snapshot

Teknologier

React

Jeg har brugt React til at bygge en struktureret og modulær frontend, hvor komponenter genbruges for at skabe en skalerbar kodebase. Det har gjort det lettere at udvikle og udvide projektet efter behov.

React logo
Vite

Jeg har brugt Vite som react framework til at udvikle websitet. Vite har gjort det nemt at starte et nyt projekt i et mere simpelt react miljø, hvilket har optimeret udviklingsprocessen.

Vite logo
Tailwind CSS

Til styling har jeg anvendt Tailwind CSS, hvilket har givet mig mulighed for hurtigt at opbygge et responsivt og moderne design. Det har gjort det nemt at holde en ensartet stil og sikre, at sitet fungerer godt på alle enheder.

Tailwind CSS logo
Motion

Motion har gjort det muligt at tilføje flydende animationer og interaktioner, der forbedrer brugeroplevelsen. Jeg har blandt andet brugt det til animerede knapper og sektioner, der giver websitet et mere dynamisk og engagerende udtryk.

Motion logo
JavaScript

JavaScript er brugt gennem React til at tilføje interaktivitet og dynamik til websitet. Jeg har anvendt det til at implementere funktioner og interaktioner, der gør brugeroplevelsen mere engagerende og intuitiv.

JavaScript logo
GSAP

GSAP har været et kraftfuldt værktøj til at skabe mere komplekse animationer. Jeg har brugt det til at skabe engagerende effekter på blandt andet 'Om os'-siden og i webshoppen, hvor animationerne hjælper med at guide brugeren gennem indholdet.

GSAP logo

3D Model

GithubLinkedInEmail

Tobias Wolmar