Pregled projekta

Razvoj fleksibilnog i visoko prilagodljivog dizajn sistema koristeći Next.js za front-end i Figma alate za dizajn kolaboraciju.

Ključne funkcionalnosti

• Biblioteka komponenti: Izgrađen set modularnih i višekratno iskoristivih UI komponenti koristeći React i Next.js, sa fokusom na pristupačnost i responzivnost.
• Prilagođavanje tema: Integrisan sistem tema koji omogućava laku izmjenu paleta boja, tipografije i stilova izgleda koristeći CSS varijable i Figma tokene.
• Figma integracija: Bliska saradnja sa dizajnerima kroz zajedničku biblioteku u Figmi sinhronizovanu sa kodom.
• Dokumentacija: Detaljna dokumentacija sa Storybook okruženjem za prikaz komponenti i najboljih praksi.

Korištene tehnologije

• Next.js: Za brze i serverski renderovane React aplikacije.
• Figma: Za dizajn i izradu prototipa.
• CSS varijable: Za modularno i fleksibilno stilizovanje.
• Storybook: Za interaktivnu dokumentaciju komponenti.

Izazovi i naučene lekcije

Glavni izazov bio je balansiranje između fleksibilnosti i konzistentnosti dizajna. Rješenje je pronađeno u definisanju jasnih pravila i tokena. Saradnja dizajnera i developera kroz Figmu i Git znatno je poboljšala efikasnost procesa.

Ishod

Dizajn sistem se aktivno koristi na više projekata, što omogućava brži ciklus razvoja, bolju konzistentnost dizajna i unaprijeđenu saradnju između timova.