Marka Promosindo: Souvenir & Merchandise Website

A full marketing website designed and built end-to-end for a Jakarta-based custom souvenir and merchandise business targeting corporate, wedding, and personal event buyers.

The Brief

Marka Promosindo is a Jakarta-based business specializing in custom-printed souvenirs and merchandise (kipas, tumblers, and goodie bags) for corporate events, weddings, and personal occasions. The business needed a professional marketing website to establish credibility, showcase its product catalog, and convert visitors into WhatsApp inquiries.

Design and build a premium marketing website that feels boutique and trustworthy: one that makes a small souvenir business look as credible as an established brand, and turns product browsing into direct contact.

Visual Direction

The core challenge was tone: souvenir businesses often look generic. The brief was to go in the opposite direction: editorial, premium, memorable. Every visual decision was made to reinforce the brand's tagline: "Setiap Momen Layak Dikenang" (Every Moment Deserves to Be Remembered).

Key Pages

Homepage

The homepage is structured to answer the visitor's three questions in sequence: Who is this? (hero + tagline) → Why trust them? ("Kenapa Marka Promosindo?" with 4 trust cards) → What do they do? (6 service cards) → What's popular? (best-seller product grid). A gold marquee strip between sections acts as a brand moment and pacing tool.

Product Catalog

26 products across 3 categories (Kipas, Tumbler, Goodie Bag) displayed in a filterable grid. Filter tabs (Semua / Kipas / Tumbler / Goodie Bag) let buyers narrow by category without a full page reload. Each card shows the product image, category badge, volume/capacity, price in IDR, and a direct "Pesan Sekarang" CTA linking to the contact page.

Contact & WhatsApp Integration

The contact page uses a split layout: contact details on the left, inquiry form on the right. The form collects name, WhatsApp number, occasion type (Corporate, Wedding, Personal, Other), and a message. A persistent green WhatsApp CTA button in the navbar links directly to a pre-filled WhatsApp message, reducing friction for buyers who prefer not to fill forms.

Key Design Decisions

FAQ as a Trust Mechanism

Six accordion questions cover MOQ, custom design, production timeline (3–14 working days), express orders, and the full ordering process. Positioned next to a "Masih Ada Pertanyaan?" CTA card, giving visitors who still have doubts an immediate escape hatch to contact directly. FAQ reduces pre-sale anxiety, which directly increases conversion.

Mobile-First Navigation

The navbar uses a blur-backdrop effect and collapses to a hamburger on mobile. The hero's 2×2 image grid (visible on desktop) is hidden on mobile to keep the fold clean and the CTA immediately thumb-reachable. Every breakpoint was considered independently, not as a responsive shrink.

Tech Stack

Outcome

The site is live at marka-promosindo-website.vercel.app, deployed on Vercel. This project demonstrates the full design-to-code pipeline, from visual direction and component design through to production deployment, in a single project.

Unlike my enterprise UX work at BRI where design and development are separate disciplines, Marka Promosindo shows I can own the full stack: brand direction, UI design, component architecture, and deployment, start to finish.