Bromma Parklycka – Fastighetsplattform för marknadsföring
Fastighetssajt för marknadsföring med lead-CRM och AI-chatt.
Besök live-projektet →Bromma Parklycka är byggd som en fastighetssajt för marknadsföring som samtidigt fungerar som ett lead-system för säljteamet. Målet var tydligt: presentera projektet klart, göra det enkelt att anmäla intresse och ge kunden ett rent sätt att följa upp leads.
På den publika sidan kan besökare utforska projektet, se tillgänglighet, öppna dokument och använda en AI-chatt för vanliga frågor. På adminsidan spårar ett lättviktigt CRM leads, konversationer och statusar på ett ställe, med stöd för export till externa arbetsflöden.
Mitt arbete täckte den digitala delen av inflödet: bostadspresentation, UX/UI, implementation, spårning, Meta-kampanjer, leadinsamling och överlämning till dem som ansvarade för säljuppföljning. Det stödde säljprocessen; det är inte ett påstående om att jag personligen sålde bostäder eller att varje lead blev en köpare.
Viktiga funktioner:
- Landningssida byggd för konvertering med tydlig CTA (”Anmäl intresse”)
- Tabell över bostäder/tillgänglighet med snabb åtkomst till PDF:er och dokument
- AI-chattassistent (svenska/engelska) för projektfrågor
- Lead-insamling som sparar förfrågningar + chatthändelser
- Admin-CRM: statusspårning av leads, sök/filtrering, konversationshistorik, CSV-export
- E-postautomatisering för bekräftelser + adminnotiser
- Google Maps + Meta Pixel-konverteringsspårning
- Microsoft Clarity-värmekartor för att hitta UX-friktion och förbättra flöden
Hero-sektionen är designad för att göra en sak bra: snabbt förmedla känslan av projektet och leda besökaren mot att anmäla intresse.
Sektionen ”Bostäderna” visar en tydlig tillgänglighetstabell och länkar till viktiga PDF:er (planlösningar / dokument), så att besökare slipper leta efter information.
Admin-dashboard för lead-hantering: sökbar lead-lista, statusspårning och snabb CSV-export för överlämning till externa CRM-processer.
Microsoft Clarity användes för att se vad besökare faktiskt klickar på, hur långt de scrollar och var de fastnar, och sedan för att iterera på layout och CTA:er utifrån verkligt beteende.
Meta Ads-rapportering användes för att följa prestanda och målgruppsfördelning (räckvidd/klick per ålder och kön), vilket hjälpte till att styra kreativa val och förbättringar av landningssidan.
Teknisk översikt:
- Next.js 14 (App Router) + TypeScript
- Tailwind CSS med anpassad varumärkesstil + mörkt läge
- PostgreSQL + Prisma (migrationer + strukturerade datamodeller)
- Anpassad sessionsautentisering med HMAC-signerade cookies
- OpenAI-chattintegration med kontexthämtning + konversationsspårning
- Upstash Redis för hastighetsbegränsning / driftsäkerhet
- Resend för transaktionsmejl med varumärkta mallar
- Driftsatt på Vercel (produktionsmiljö + konfiguration)
Utöver utvecklingen omfattade arbetet även bildredigering, DNS-uppsättning för båda domänerna samt e-post- och domänposter. Meta-annonskampanjer kördes och resultaten följdes via både Meta-rapportering och Clarity, vilket gjorde det enklare att förbättra UX utifrån verkligt användarbeteende i stället för gissningar.