Back to Projects

Craft'd Habitat - Architectural Portfolio Website

Craft'd Habitat is a premium architectural portfolio website for a Ghanaian architectural consultancy specializing in holistic wellbeing design. The website serves as both a digital showcase of their architectural projects and a platform for client engagement, featuring a sophisticated design that reflects the company's focus on luxury, wellness, and sustainable architecture.

2024
Craft'd Habitat
6 weeks
View Live

Project Gallery

Home Page

Home Page

Technologies

Vanilla JS (ES6)Frontend
Firebase FirestoreDatabase
EmailJSIntegration
Swiper.jsCarousel
CSS Custom PropertiesDesign System

Key Features

  • Custom IntersectionObserver lazy loading system for heavy media content
  • Consistent luxury design system with extensive CSS custom variables
  • Responsive typography scale (Playfair Display & Montserrat)
  • Contact capture stored in Firestore with automated EmailJS notifications
  • Touch-optimized accordion sidebars and navigation panels

Results

  • Significantly reduced initial page weight and time-to-interactive
  • Delivered a polished, luxury brand portfolio experience
  • Increased user engagement and streamlined client inquiry process

Challenges & Solutions

Managing page responsiveness and performance under heavy architectural media loads

Creating seamless sidebar animations and submenus without a build step

Integrating multiple third-party API solutions on a component-based static site

HTML5CSS3JavaScriptFirebaseLazy LoadingUI Architecture