Shahriar Kabir Portfolio
Premium personal brand website for an AI company executive. A full thought-leadership platform with editorial content, career narrative, schema structured data, and a curated design system.
Business Impact
Operational outcomes delivered.
Built for a Head of Operations at a leading AI company (PrimeSync AI).
Published BPO/AI industry thought-leadership pieces live from day one.
Schema.org JSON-LD, OG images, and sitemap configured at launch.
Screenshots
Project Metrics
About This Project
Built a premium personal brand website for Shahriar Kabir, Head of Operations at PrimeSync AI. The site goes far beyond a typical portfolio — it's a thought-leadership engine. Features include an MDX-powered editorial blog with published BPO and AI industry articles, dynamic OG image generation per post via @vercel/og, a triple-font editorial system (Inter + Fraunces + JetBrains Mono), Schema.org JSON-LD structured data for rich search results, cookie consent, Vercel Analytics, Framer Motion animations, Instagram embeds, and QR code generation. The design follows a 'Paper, Ink & Forest' color palette with Lenis smooth scrolling. The career timeline is designed as a visual story arc, not just a list of jobs.
Articles about
Homepage — Overview
Insights — Thinking
Career — Strategic Road
Dossier — Professional Credentials
Life & Motion — Visual Chronicles
Article: Mobile Auto-Repair & AI
Article: BPO CX Strategy
Technology Stack
Key Challenges
- •Translating a complex personal brand identity ('The Architect & The Explorer') into a cohesive digital experience
- •Building an editorial system that handles MDX blog articles with dynamic OG image generation per post
- •Designing a triple-font typographic system that balances Inter, Fraunces, and JetBrains Mono effectively
- •Implementing Schema.org JSON-LD structured data for rich search results via a dedicated component
- •Creating a career timeline as a visual narrative story arc rather than a plain job list
Solutions
- ✓Designed 'Paper, Ink & Forest' editorial color palette with bespoke typography for a premium curator feel
- ✓Built MDX pipeline with @vercel/og for auto-generated social share images per article
- ✓Implemented <SchemaData /> component for clean JSON-LD injection without coupling to page components
- ✓Used Framer Motion for staggered reveal animations and Lenis for buttery smooth scrolling
- ✓Integrated Instagram embeds, YouTube player, and QR code generator for rich media presence