2026-07-15 01:49:30 -04:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
< title > Sky Lattice — AI Hackathon Pitch< / title >
< link rel = "preconnect" href = "https://fonts.googleapis.com" / >
< link rel = "preconnect" href = "https://fonts.gstatic.com" crossorigin / >
< link href = "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,600;0,9..40,700;1,9..40,400&family=Instrument+Serif:ital@0;1&display=swap" rel = "stylesheet" / >
< style >
:root {
--bg: #0c1219;
--bg2: #121b26;
--ink: #e8eef5;
--muted: #8fa3b8;
--line: #243447;
--accent: #3d9bfd;
--accent2: #7ee0c3;
--warn: #f0b429;
--danger: #ff6b6b;
--card: #162231;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
height: 100%;
background: var(--bg);
color: var(--ink);
font-family: "DM Sans", system-ui, sans-serif;
}
body {
background-image:
radial-gradient(ellipse 80% 50% at 10% -10%, rgba(61,155,253,0.18), transparent 55%),
radial-gradient(ellipse 60% 40% at 90% 110%, rgba(126,224,195,0.12), transparent 50%),
linear-gradient(180deg, var(--bg), var(--bg2));
}
.deck {
height: 100%;
overflow: hidden;
position: relative;
}
.slide {
display: none;
height: 100%;
padding: clamp(2rem, 5vw, 4rem) clamp(2rem, 6vw, 5rem);
flex-direction: column;
justify-content: center;
max-width: 1100px;
margin: 0 auto;
animation: in 280ms ease;
}
.slide.active { display: flex; }
@keyframes in {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: none; }
}
.eyebrow {
font-size: 0.8rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--accent2);
font-weight: 600;
margin-bottom: 1rem;
}
h1 {
font-family: "Instrument Serif", Georgia, serif;
font-weight: 400;
font-size: clamp(2.8rem, 7vw, 4.6rem);
line-height: 1.05;
letter-spacing: -0.02em;
}
h1 em { font-style: italic; color: var(--accent); }
h2 {
font-family: "Instrument Serif", Georgia, serif;
font-weight: 400;
font-size: clamp(2rem, 4.5vw, 3.1rem);
line-height: 1.15;
margin-bottom: 1.25rem;
}
.lede {
font-size: clamp(1.15rem, 2.2vw, 1.45rem);
color: var(--muted);
max-width: 38rem;
line-height: 1.45;
margin-top: 1.25rem;
}
.grid2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.25rem;
margin-top: 1.5rem;
}
@media (max-width: 800px) {
.grid2 { grid-template-columns: 1fr; }
}
.card {
background: var(--card);
border: 1px solid var(--line);
border-radius: 4px;
padding: 1.25rem 1.35rem;
}
.card h3 {
font-size: 0.95rem;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--accent);
margin-bottom: 0.55rem;
}
.card p, .card li {
color: var(--muted);
font-size: 1.02rem;
line-height: 1.45;
}
.card ul { padding-left: 1.1rem; }
.card li + li { margin-top: 0.35rem; }
.bad { border-color: rgba(255,107,107,0.35); }
.bad h3 { color: var(--danger); }
.good { border-color: rgba(126,224,195,0.35); }
.good h3 { color: var(--accent2); }
.flow {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
align-items: center;
margin-top: 1.75rem;
font-size: 0.95rem;
}
.pill {
background: var(--card);
border: 1px solid var(--line);
padding: 0.55rem 0.9rem;
border-radius: 999px;
}
.arrow { color: var(--muted); }
.quote {
font-family: "Instrument Serif", Georgia, serif;
font-size: clamp(1.5rem, 3vw, 2.1rem);
line-height: 1.35;
max-width: 40rem;
border-left: 3px solid var(--accent);
padding-left: 1.25rem;
margin: 0.5rem 0 1.5rem;
}
.steps { counter-reset: step; margin-top: 1rem; }
.steps li {
list-style: none;
display: grid;
grid-template-columns: 2.5rem 1fr;
gap: 0.85rem;
margin-bottom: 1rem;
align-items: start;
}
.steps li::before {
counter-increment: step;
content: counter(step);
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
border: 1px solid var(--accent);
color: var(--accent);
display: grid;
place-items: center;
font-weight: 700;
font-size: 0.9rem;
}
.steps strong { display: block; color: var(--ink); margin-bottom: 0.2rem; }
.steps span { color: var(--muted); font-size: 0.98rem; }
.meta {
position: fixed;
left: 0; right: 0; bottom: 0;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.85rem 1.5rem;
font-size: 0.8rem;
color: var(--muted);
background: linear-gradient(transparent, rgba(12,18,25,0.92));
border-top: 1px solid transparent;
}
.brand { letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; }
kbd {
font-family: inherit;
border: 1px solid var(--line);
padding: 0.1rem 0.4rem;
border-radius: 3px;
color: var(--ink);
font-size: 0.75rem;
}
.big-number {
font-family: "Instrument Serif", Georgia, serif;
font-size: 4rem;
color: var(--accent);
line-height: 1;
}
.tagrow { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.5rem; }
.tag {
font-size: 0.78rem;
letter-spacing: 0.06em;
text-transform: uppercase;
border: 1px solid var(--line);
padding: 0.35rem 0.65rem;
color: var(--muted);
}
code {
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
font-size: 0.92em;
color: var(--accent2);
}
< / style >
< / head >
< body >
< div class = "deck" id = "deck" >
< section class = "slide active" data-title = "Title" >
< p class = "eyebrow" > AI Hackathon · Platform Engineering< / p >
< h1 > Sky Lattice< / h1 >
2026-07-15 02:02:57 -04:00
< p class = "lede" > In nature, a snowflake is made of an ice crystal lattice. < strong style = "color:var(--ink);font-weight:600" > Sky Lattice< / strong > is that structure for a Snowflake account.< / p >
< p class = "lede" style = "margin-top:1rem" > Snowflake itself is a blank slate. Every customer, we rebuild platforms by hand — lately with AI chats that forget < em > why< / em > . Sky Lattice is the layer under the copilots: blueprint + intent + decisions + deterministic plan. AI fills the forms; Terraform still ships the platform.< / p >
2026-07-15 01:49:30 -04:00
< div class = "tagrow" >
< span class = "tag" > Intent< / span >
< span class = "tag" > Decisions< / span >
< span class = "tag" > Blueprint< / span >
< span class = "tag" > Terraform< / span >
< span class = "tag" > AI Front Door< / span >
< / div >
< / section >
< section class = "slide" data-title = "Problem" >
< p class = "eyebrow" > The problem< / p >
< h2 > Snowflake is a blank slate.< br / > AI chats are amnesiac.< / h2 >
< div class = "grid2" >
< div class = "card bad" >
< h3 > Today< / h3 >
< ul >
< li > Every customer rebuild starts near zero< / li >
< li > RBAC, envs, zones = tribal knowledge< / li >
< li > LLM + Terraform: works once, forgets < em > why< / em > < / li >
< li > Follow-ups reopen a new chat with TF state, not judgment< / li >
< / ul >
< / div >
< div class = "card" >
< h3 > Cost< / h3 >
< ul >
< li > Weeks of senior time per engagement< / li >
< li > Inconsistent security posture< / li >
< li > Hard handoffs, harder audits< / li >
< li > AI accelerates typing — not institutional memory< / li >
< / ul >
< / div >
< / div >
< / section >
< section class = "slide" data-title = "Insight" >
< p class = "eyebrow" > Insight< / p >
2026-07-15 02:02:57 -04:00
< p class = "quote" > “Don’ < / p >
2026-07-15 01:49:30 -04:00
< p class = "lede" > Codify the recipe. Capture the why. Let AI drive the forms — never invent production IAM from scratch each session.< / p >
< / section >
< section class = "slide" data-title = "Product" >
< p class = "eyebrow" > What we built< / p >
< h2 > Sky Lattice< / h2 >
< p class = "lede" > An internal toolkit that turns “how we set up Snowflake” into a versioned product: blueprint + customer intent + durable decisions + deterministic plan — with Cursor/Claude as the optional front door.< / p >
< div class = "flow" >
< span class = "pill" > Natural language< / span >
< span class = "arrow" > →< / span >
< span class = "pill" > Skill + intent/decisions< / span >
< span class = "arrow" > →< / span >
< span class = "pill" > < code > platformctl plan< / code > < / span >
< span class = "arrow" > →< / span >
< span class = "pill" > Terraform / Snowflake< / span >
< / div >
< / section >
< section class = "slide" data-title = "Demo arc" >
< p class = "eyebrow" > Live story< / p >
< h2 > Greenfield in minutes.< br / > Brownfield without amnesia.< / h2 >
< ol class = "steps" >
< li >
< div >
< strong > Init Acme< / strong >
< span > < code > platformctl init< / code > + wizard → domains, envs, restricted finance< / span >
< / div >
< / li >
< li >
< div >
< strong > Plan the lattice< / strong >
< span > Deterministic object graph: DBs, zones, roles, warehouses< / span >
< / div >
< / li >
< li >
< div >
< strong > Record the why< / strong >
< span > Decision file: temporary exception, expiry date, rationale< / span >
< / div >
< / li >
< li >
< div >
< strong > Come back later< / strong >
< span > New chat opens the customer repo — not a blank brain< / span >
< / div >
< / li >
< / ol >
< / section >
< section class = "slide" data-title = "Differentiation" >
< p class = "eyebrow" > Why this wins< / p >
< h2 > Not another chatbot.< br / > Not another Terraform module dump.< / h2 >
< div class = "grid2" >
< div class = "card good" >
< h3 > AI where it belongs< / h3 >
< p > Skills interview and edit intent. Policy blocks unsafe shortcuts. Apply stays deterministic.< / p >
< / div >
< div class = "card good" >
< h3 > Memory that survives sessions< / h3 >
< p > TF state = what. Decision store = why. Intent = what we mean to run.< / p >
< / div >
< div class = "card good" >
< h3 > Repeatable with deviation< / h3 >
< p > Same blueprint, different customer params and approved overrides — not copy-paste HCL.< / p >
< / div >
< div class = "card good" >
< h3 > Low friction for Snowflake people< / h3 >
< p > Five verbs. Snowflake vocabulary. Familiar plan output. Optional agent IDE.< / p >
< / div >
< / div >
< / section >
< section class = "slide" data-title = "Market" >
< p class = "eyebrow" > Who cares< / p >
< h2 > Anyone shipping Snowflake platforms more than once.< / h2 >
< div class = "grid2" >
< div class = "card" >
< h3 > Primary< / h3 >
< ul >
< li > Data platform consultancies< / li >
< li > Internal platform / enablement teams< / li >
< li > Multi-account Snowflake orgs< / li >
< / ul >
< / div >
< div class = "card" >
< h3 > Pain they already feel< / h3 >
< ul >
< li > “We reinvent RBAC every client”< / li >
< li > “AI helped, then we lost the thread”< / li >
< li > “Brownfield is a black box”< / li >
< / ul >
< / div >
< / div >
< / section >
< section class = "slide" data-title = "Traction" >
< p class = "eyebrow" > Hackathon status< / p >
< h2 > Working scaffold. Honest v0.< / h2 >
< div class = "grid2" >
< div class = "card" >
< div class = "big-number" > v0.1< / div >
< p style = "margin-top:0.75rem;color:var(--muted)" > Blueprint · < code > platformctl< / code > · wizard · decisions · drift inventory · Cursor skill · demo customers< / p >
< / div >
< div class = "card" >
< h3 > Next vertical slice< / h3 >
< ul >
< li > Live Terraform → Snowflake apply< / li >
< li > Overrides that change the plan graph< / li >
< li > Live account discover< / li >
< / ul >
< / div >
< / div >
< / section >
< section class = "slide" data-title = "Ask" >
< p class = "eyebrow" > The ask< / p >
< h2 > Help us harden the lattice.< / h2 >
< p class = "lede" > We’ ’ < / p >
< div class = "tagrow" >
< span class = "tag" > Open source trajectory< / span >
< span class = "tag" > Consulting IP today< / span >
< span class = "tag" > Product tomorrow< / span >
< / div >
< p class = "lede" style = "margin-top:2rem;color:var(--ink)" > Sky Lattice — structure under the copilots.< / p >
< / section >
< / div >
< div class = "meta" >
< span class = "brand" > Sky Lattice< / span >
< span id = "progress" > 1 / 9< / span >
< span > < kbd > ←< / kbd > < kbd > →< / kbd > or click< / span >
< / div >
< script >
const slides = [...document.querySelectorAll(".slide")];
let i = 0;
const progress = document.getElementById("progress");
function show(n) {
i = (n + slides.length) % slides.length;
slides.forEach((s, idx) => s.classList.toggle("active", idx === i));
progress.textContent = `${i + 1} / ${slides.length}`;
}
document.addEventListener("keydown", (e) => {
if (e.key === "ArrowRight" || e.key === " " || e.key === "PageDown") { e.preventDefault(); show(i + 1); }
if (e.key === "ArrowLeft" || e.key === "PageUp") { e.preventDefault(); show(i - 1); }
if (e.key === "Home") show(0);
if (e.key === "End") show(slides.length - 1);
});
document.getElementById("deck").addEventListener("click", (e) => {
if (e.target.closest("a,button,kbd")) return;
show(e.clientX > window.innerWidth / 2 ? i + 1 : i - 1);
});
< / script >
< / body >
< / html >
