Project URL: lighthouse-preview.pages.dev
Portfolio Exhibit: bongaceron.pages.dev
Role: Front-End Developer / Jamstack Specialist. I served as the UI/UX Designer and Frontend Developer for the Lighthouse Research & Advisory website prototype. Responsibilities included website planning, user experience design, visual design, responsive frontend implementation, content structuring, branding, and conversion-focused landing page development.


1. Executive Summary

Lighthouse Research & Advisory provides specialized market research, consumer insights, and strategic consulting services. Accessing research expertise and booking consultation sessions can often be a slow, high-friction process for prospective corporate clients and decision-makers requiring rapid market intelligence.

This case study details the redesign and development of a highly optimized, multi-page web platform prototype. Built using a modern Jamstack architecture and deployed on Cloudflare Pages, the initial phase establishes a high-converting, mobile-first homepage shell designed to expand seamlessly into dedicated subpages for deep-dive research reports and service categories, replacing a fragmented inquiry workflow with a streamlined conversion tool.


2. The Problem & Local Context

Decision-makers searching for consulting services are frequently evaluating partners on mobile devices between meetings or during travel. For these users, a slow, bloated site filled with unnecessary scripts or complex navigation panels creates immediate friction, leading to abandoned visits and lost consulting engagements.

The consulting firm required a web presence that fulfilled three core requirements:

  • Instantaneous Performance: Must load instantly on mobile networks so busy executives can review consulting capabilities and service offerings without delay.
  • Structured Booking Intake: Replacing unstructured inquiry forms and back-and-forth emails with an organized, clear path for scheduling consultations and requesting project proposals.
  • Scalable Architecture: Establishing a modular multi-page foundation that provides immediate homepage clarity while accommodating future dedicated content routes, case studies, and service pages.

3. Technical Strategy & Architecture

To ensure maximum speed, security, and zero maintenance overhead, the redesign and development relied on a decoupled, Jamstack architecture:

  • Static Generation: The entire interface is pre-rendered using semantic HTML, custom-tailored Tailwind CSS, and lightweight vanilla JavaScript. No heavy client-side frameworks were used, keeping the asset footprint exceptionally small while enabling effortless multi-page routing.
  • Global CDN Deployment: Hosted on Cloudflare Pages. By serving the entire site directly from the network edge, the Time-to-First-Byte (TTFB) is near-instantaneous across all client browsers and devices.
  • Managed Edge Infrastructure & Hosting: By leveraging an advanced static architecture on enterprise-grade edge networks, the platform scales automatically to handle traffic spikes. This setup eliminates the need for database maintenance, server patching, or dynamic backend hosting fees, delivering continuous uptime and high reliability.

4. Key Design & Implementation Features

A. Mobile-First Navigation & Modular Structure

Recognizing that many executive inquiries originate on mobile devices, the header features a clean, responsive layout paired with an interactive slide-down navigation panel. The navigation structure is built specifically to accommodate deep multi-page hierarchy while giving top priority to a full-width "Book Consultation" action button inside the panel.

B. Structured Service & Scope Breakdown

Instead of ambiguous service descriptions, the layout presents a clear, organized breakdown of consulting capabilities—ranging from primary market research and competitor benchmarks to strategic advisory workshops—serving as the launching point for dedicated subpages in upcoming iterations.

C. Trust-Centered Aesthetic

Strategic consulting demands immediate executive trust. The design utilizes a refined dark ledger color scheme paired with subtle warm accents, balancing modern web design practices with the traditional, authoritative feel expected of professional advisory firms.


5. Results & Technical Impact

  • Ultralight Payload: By eliminating external framework dependencies, the total page size remains remarkably lean, resulting in near-perfect performance scores and instantaneous page renders.
  • Hardened Security: Without an exposed database or dynamic content management system, the site is inherently secure against common web vulnerabilities, server downtime, and unauthorized access attempts.
  • Frictionless UX: Potential corporate clients can review service offerings, inspect consulting frameworks, and initiate a consultation request within seconds of opening the page on any device.

6. Conclusion

The Lighthouse Research & Advisory project demonstrates how the redesign and development of a professional consulting site can eliminate user friction and maximize client conversions without complex software stacks. By combining semantic HTML, responsive Tailwind CSS styling, and edge hosting on Cloudflare Pages, the project delivers a fast, secure, and expandable digital gateway.