BRAND
CAITO brand system — story, voice, visual rules, and how this site ships.
This page documents the portfolio as a working brand: Signal Path narrative from Home, edge DNA from About, delivery pillars from What I Do, and the monochrome bureau UI that holds them together.
Explore docsI didn't jump markets. I climbed them.
Positioning: Chief AI Technology Officer (CAITO) from Singapore — enterprise AI architect for AIEE.DEV, Quicksales.ai, and Craveva. Not a startup landing page. An architectural bureau case study: structure first, materials second, lived proof last.
The brand thesis mirrors the Signal Path on Home — Act I The Floor → Act II The Giants → Act III The Builder. Every rung still runs: helpdesk service, P&G / HPE / ST Eng operating culture, founder capital, blockchain rails, then multi-LLM agent systems.
Aesthetic: high-contrast monochrome — black ink on white field. Uppercase labels. Metric-led proof. Ship-not-decked language.
01 — Career DNA
Enterprise · Founder · Hands-on AI · Scale Proven
02 — Platforms
AIEE.DEV · Quicksales.ai · Craveva · GEMS · ARENA
03 — Agents & systems
Multi-LLM · MCP · RAG · NL2SQL · Cursor-native
04 — Proof surfaces
Works · Speaker · Partners · Insights · Hire Me
Four pillars that never leave the stack
Same edge language as About — the brand promise is the climb compiled, not a persona invented for AI.
Enterprise DNA
Fortune Global 500 · Gov mega-ICT · Multi-country SLA · CxO stakeholders — HPE · P&G · ST Engineering · Sea.
Founder DNA
Fundraising · Product architecture · GTM · Multi-venture CAITO load — GEMS US$62.5M pipeline · Quicksales · Craveva · GAME ONE · ARENA.
Hands-on AI
Multi-LLM · MCP · RAG · NL2SQL · Cursor · Next.js / TypeScript — agents in WhatsApp sales, F&B OS, and enterprise hubs.
Scale Proven
20+ platforms · 70K+ users · US$68.2M tech fund · S$1.3B SOEasy · 14 AI products · 342+ LLMs (Craveva).
Voice & proof rules
Say
- CAITO / CTO — not “AI influencer”
- Shipped · pipeline · SLA · users
- Vertical products, not generic chatbots
- Singapore · SEA / APAC · hybrid
- Cursor-native · weekly ship
Don't
- Purple glow startup tropes
- Pill clusters / emoji decoration
- Abstract gradient “AI” stock
- Deck language without delivery proof
- Soften titles — keep metric edge
Canonical proof line: US$68.2M tech fund · S$1.3B SOEasy · US$62.5M GEMS pipeline · US$440B+ employer backdrop.
What I Do
Leadership · build · advisory · training
Synced with services.html — seven engagement shapes, three commercial modes (Mandate · Project · Retainer / session).
01 — Fractional CAITO / CTO
Hands-on AI tech leadership — architecture ownership, shipping cadence, CxO alignment.
02 — Enterprise AI hub & SaaS
Next.js / TypeScript / GCP — multi-tenant isolation and production AI data OS.
03 — Agentic systems
Multi-LLM · MCP · RAG · NL2SQL · human-in-the-loop into sales, ops, data.
04 — Domain AI products
Sales · CRM · ERP · F&B · Retail · Voice · Education · POS.
05 — Cursor-native delivery
Weekly ship architecture → GTM with Copilot / Claude Code / MCP.
06 — Advisory · speaking
Board tech, diligence-style advice, keynotes / panels across AI & product.
07 — Training & mentoring
Workshops on enterprise AI, agentic systems, and shipping in production.
Information architecture
Twelve public surfaces. Primary paths: discover proof (Works) → understand depth (About / Brand / Signal Path) → engage (Hire Me). Insights is the living industry feed.
Wordmark & navigation
The primary mark is typographic: oversized .text-fit page titles (ANDY KOH / ABOUT ME / BRAND). No separate logo file — the name is the brand signal at hero scale.
Navigation uses .d-menu-1: uppercase links, weight 800, 2px underline on hover/active. Mobile collapses via d-menu-mobile.js hamburger. Social logos sit in the footer only.
Nav specimen
Palette
Scheme-02 monochrome. Primary is pure black. Accents come from weight and space — not hue. Avoid purple-on-white, cream-serif terracotta, and glow effects.
Typography
Single family: Plus Jakarta Sans (title + body). Hierarchy is size and weight, not a second font.
Chief AI Technology Officer
01 — Fractional CAITO / CTO
Enterprise AI solutions leader — CAITO for AIEE.DEV, Quicksales.ai, and Craveva.
Grid & spacing
Bootstrap container. Canonical section: col-lg-2 label + col-lg-10 content. Insights list: two-column cards. Works: three-column hover tiles. Signal Path: spine + act gates + nodes.
UI components
Industry filters
Underline active state — matches nav, not pill chips.
Stat counter
S$2B
Page blueprints
Schematic layouts — structural logic before polish. Same bureau language as the live site.
Motion & UX rules
Motion creates hierarchy — never decoration noise. Prefer short fades and underlines over glow or bounce.
- WOW fadeSection entrance · stagger via data-wow-delay
- Signal PathGSAP ScrollTrigger · spine draw · 3 act gates · node ignition · payoff scoreboard · reduced-motion static
- Hover scaleWorks tiles · image scale 1.2 · title opacity swap
- Shuffle textLET'S TALK and primary buttons · letter scramble on hover
- Filter underlineInsights industries · grow 2px bar under active label
- MarqueeHome proof strip · 342+ LLMs · WhatsApp AI · pipeline
- AI chat widgetFloating assistant · scoped CSS · non-blocking
- Scroll affordanceFloat “Scroll to top” + vertical page-nav + scrollbar cue
- PreloaderBrief #de-loader mask before content reveal
Imagery guidelines
Hero / portrait
Full-column photo beside intro copy. Prefer documentary / stage / workspace — not stock abstract gradients.
Works tiles
Edge-to-edge project stills with dark overlay tags (.d-tag-s2) and year. Title centered, vanishes on hover.
Gallery / speaker
Real event and archive photos only. Excluded / packaging images never return to Gallery. Speaker media stays on Speaker.
Partner logos
Locked official marks where curated (ESWF circles, ST Eng transparent, Anna Sui slab-serif). Never redownload Clearbit word-art.
Insights thumbs
Square crop (aspect-ratio: 1) left of meta + uppercase headline. Video posts mark “Video” in meta row.
Social icons
Footer only — LinkedIn · Facebook · WhatsApp · Email. Consistent 40×40 marks.
How this website is built
Static HTML portfolio for Koh Bin Hing, Andy — customized for CAITO content, Signal Path narrative, and a live AI Architecture news feed.
Structure
Static HTML · Bootstrap 5 grid · scheme-02 black
Theme JS
jQuery · plugins.js · WOW · Jarallax · Isotope · GSAP
Custom JS
d-menu-mobile · signal-path · custom-marquee · page-nav · ai-chat-widget · ai-news-*
Insights API
Python :8787 · /api/industries · /api/articles · Contabo cron ~20/day SGT
Contact
handler.php · PHPMailer · FormGuide validator · reCAPTCHA
Hosting
Production Contabo · local: python -m http.server 5500
Brand tokens and this documentation also mirror in docs/BRAND.md. Gallery exclusions live in images/gallery/excludes.json. Locked logos live under logos/locked/.
Credits
Content & direction
Koh Bin Hing, Andy — CAITO / Singapore
Portfolio
Koh Bin Hing, Andy
Custom engineering
Portfolio IA, Signal Path, Insights feed, brand system
Year
2025–2026