Tessel Studio

Varför vi byggde det

De flesta studior sätter upp en Webflow- eller Framer-sajt och betraktar saken som klar. Vi ville inte ha en broschyr — vi ville ha en fungerande produkt som bevisar att vi kan leverera den typ av plattform vi säljer. Sajten du läser detta på är resultatet. Det är vår portfölj, vår backstage och vår förberedelseyta för varje teknik som senare hamnar i klientarbete.

Om ett teknikval inte överlever att vara vårt eget dagliga verktyg, hamnar det inte i en klientoffert.

Vad som finns inuti

Den publika sidan är en trespråkig marknadssajt (EN / UK / SV) med en hero-scen som kör en nattlig stadssilhuett med en levande kodredigerare som default — och växlar till en dagsljushimmel med drivande moln när användaren väljer ljust tema. Under den: om oss, utvalda projekt, tjänster med priser, garantier, betalningsupplägg, FAQ, kontakt, omdömen. Allt ligger bakom next-intl med språkprefixade rutter, språkmedveten SEO och OpenGraph-bilder genererade per request.

Portföljen läses från MDX-filer i src/content/projects/ — en frontmatter-validerad fil per projekt per språk, parsad med gray-matter och renderad med next-mdx-remote. Att lägga till ett nytt case är en PR med tre .mdx-filer. Caset du läser just nu ligger i src/content/projects/tessel.sv.mdx.

Backstage är det som gör sajten till mer än en broschyr. Bakom inloggningen finns två separata ytor:

• Klient-dashboard — en inloggad klient ser projekten vi bygger åt dem, laddar upp briefer, hämtar deliverables, chattar med oss i appen och får notifikationer när status ändras.
• Admin-dashboard — översikt med statistik, projekthantering med filuppladdning till Vercel Blob, inkorg för kontaktförfrågningar, användarhantering med rolländringar, audit-logg över varje administrativ åtgärd, redaktörer för FAQ och omdömen, sajtinställningar, samt en samlad lista över alla klientkonversationer i chatten.

Autentisering är better-auth med lösenord och Google OAuth, plus e-postverifiering, lösenordsåterställning, bekräftelse av e-postbyte och kontoradering via mejlbekräftelse. Raderingsflödet utfärdar en engångstoken, skickar en bekräftelselänk och raderar användaren först när hen klickar — inga raderingar i smyg.