Files
blog/index.html
T

243 lines
9.8 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Blog — Tinqs Studio</title>
<meta name="description" content="Dev logs, behind-the-scenes, and lessons learned from building games, tools, and platform infrastructure at Tinqs Studio.">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://www.tinqs.com/blog/">
<meta property="og:type" content="website">
<meta property="og:url" content="https://www.tinqs.com/blog/">
<meta property="og:title" content="Blog — Tinqs Studio">
<meta property="og:description" content="Dev logs, behind-the-scenes, and lessons learned from building games, tools, and platform at Tinqs Studio.">
<meta property="og:image" content="https://www.tinqs.com/img/og-cover.jpg">
2026-06-02 22:50:20 +01:00
<style>
/* ── Self-contained index styles (Studio provides site chrome) ── */
:root {
--c-accent: #c9935a;
--c-accent-l: #d4a87c;
--c-bg: #0d1117;
--c-text: #e6edf3;
--c-muted: #9aa7b4;
--c-border: #2a3340;
--c-blue: #38bdf8;
--c-purple: #a855f7;
--c-gold: #f59e0b;
}
*, *::before, *::after { box-sizing: border-box; }
body {
margin: 0;
padding: 0;
background: transparent;
color: var(--c-text);
font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
2026-06-02 22:50:20 +01:00
/* ── Section label kicker ── */
.section-label {
display: inline-block;
font-family: ui-monospace, 'SF Mono', 'Cascadia Code', Consolas, monospace;
font-size: 0.72rem;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--c-blue);
2026-06-02 22:50:20 +01:00
border: 1px solid rgba(147, 140, 129, 0.25);
border-radius: 999px;
padding: 4px 14px;
margin-bottom: 16px;
}
/* ── Blog header ── */
.blog-header {
max-width: 720px;
margin: 0 auto;
padding: 60px 24px 32px;
}
2026-06-02 22:50:20 +01:00
/* ── Gradient index title ── */
.blog-header__title {
background: linear-gradient(90deg, #c9935a, #f59e0b 40%, #38bdf8);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
font-weight: 800;
font-size: 2.4rem;
line-height: 1.25;
margin: 0 0 12px;
}
.blog-header__subtitle {
color: var(--c-muted);
font-size: 1.05rem;
line-height: 1.6;
margin: 0;
}
/* ── Blog list ── */
.blog-list {
max-width: 720px;
margin: 0 auto;
padding: 0 24px 60px;
display: flex;
flex-direction: column;
gap: 16px;
}
/* ── Blog card ── */
.blog-card {
display: block;
text-decoration: none;
background: #0c1119;
border: 1px solid var(--c-border);
border-radius: 12px;
padding: 20px 24px;
transition: border-color 0.2s;
}
.blog-card:hover {
border-color: var(--c-accent);
2026-06-02 22:50:20 +01:00
}
/* ── Date pill ── */
.blog-card__date {
display: inline-block;
font-family: ui-monospace, 'SF Mono', 'Cascadia Code', Consolas, monospace;
font-size: 0.72rem;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--c-blue);
2026-06-02 22:50:20 +01:00
border: 1px solid rgba(147, 140, 129, 0.25);
border-radius: 999px;
padding: 4px 14px;
margin-bottom: 10px;
}
.blog-card__title {
color: var(--c-text);
font-size: 1.25rem;
font-weight: 700;
line-height: 1.35;
margin: 0 0 8px;
}
.blog-card__excerpt {
color: var(--c-muted);
font-size: 0.92rem;
line-height: 1.55;
margin: 0 0 12px;
2026-06-02 22:50:20 +01:00
}
/* ── Read link accent ── */
.blog-card__read {
color: var(--c-blue);
font-size: 0.9rem;
font-weight: 500;
2026-06-02 22:50:20 +01:00
}
.blog-card:hover .blog-card__read {
color: var(--c-purple);
2026-06-02 22:50:20 +01:00
}
</style>
</head>
<body>
<!-- BLOG HEADER -->
<div class="blog-header">
<span class="section-label">Dev Log</span>
<h1 class="blog-header__title">From the Workshop</h1>
<p class="blog-header__subtitle">Behind-the-scenes notes on building games, forging tools, and running a small studio that punches above its weight.</p>
</div>
<!-- BLOG LIST -->
<div class="blog-list">
<!-- hand-authored HTML posts (not from build.js) -->
<a href="pi-flow-native-brain" class="blog-card">
<span class="blog-card__date">4 June 2026</span>
<h2 class="blog-card__title">How Pi Agents Build, Test, and Ship Game Code with Oracle-Backed Flows</h2>
<p class="blog-card__excerpt">A flow spawns, agents fan out through five oracle gates, the game-builder fixes 19 red tests while vision judges check the live game — and it all runs as one autonomous flow.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="voice-missing-input-game-dev" class="blog-card">
<span class="blog-card__date">10 June 2026</span>
<h2 class="blog-card__title">Why Voice Is the Missing Input for Game Development</h2>
<p class="blog-card__excerpt">Speaking a bug while looking at the screen beats typing it from memory ten minutes later. Here's how voice-to-agent pipelines work, why game dev is the ideal use case, and what changes when you stop typing bug reports.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="live-ozan-radio" class="blog-card">
<span class="blog-card__date">7 June 2026</span>
<h2 class="blog-card__title">Live Ozan Radio: A Personal AI Station in Cursor</h2>
<p class="blog-card__excerpt">I wanted a radio that never plays catalog music — only fresh AI compositions shaped by my taste. Here's the stack, the player, and how I DJ every generated track with metadata.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="blog-visual-upgrade" class="blog-card">
<span class="blog-card__date">3 June 2026</span>
<h2 class="blog-card__title">How We Restyled Our Blog with Two Template Files and Zero Dependencies</h2>
<p class="blog-card__excerpt">We gave the Tinqs blog a visual refresh — gradient titles, dark code panels, date pills, amber accent bars. Two template files, one build step, zero external dependencies.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="agent-harness" class="blog-card">
<span class="blog-card__date">25 May 2026</span>
<h2 class="blog-card__title">What an Agent Harness Is and Why Game Dev Needs One</h2>
<p class="blog-card__excerpt">A raw AI model is stateless. An agent harness wraps around it and provides identity, memory, tools, context, and guardrails. Here's why game development needs its own.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="fal-image-generation" class="blog-card">
<span class="blog-card__date">25 May 2026</span>
<h2 class="blog-card__title">AI Art at Every Price Point: How We Generate Game Assets with fal.ai</h2>
<p class="blog-card__excerpt">We generate all visual assets for our game through fal.ai — concept art, icons, logos, trailer frames. Here's the 4-layer prompt pattern that actually works, and how we pick between 12 models spanning two orders of magnitude in cost.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="fork-dont-build" class="blog-card">
<span class="blog-card__date">25 May 2026</span>
<h2 class="blog-card__title">Fork, Don't Build: How We Modified Gitea, Pi, and Godot Instead of Starting from Scratch</h2>
<p class="blog-card__excerpt">Three forks, less than 0.5% code changed. Why modifying existing platforms beats building new ones — and how we turned Gitea into a game dev platform with 3D preview, AI agents, and LFS-first workflows.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="pre-commit-agent" class="blog-card">
<span class="blog-card__date">25 May 2026</span>
<h2 class="blog-card__title">A Pre-Commit Agent That Guards Your Secrets for $0.001</h2>
<p class="blog-card__excerpt">Too many things to remember before hitting commit. Don't leak API keys. Don't reference classified codenames. Don't link to deleted repos. We built a two-layer pre-commit hook — regex + LLM — that catches all of it for $0.001.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="godot-optimisation" class="blog-card">
<span class="blog-card__date">22 May 2026</span>
<h2 class="blog-card__title">Streaming a 12km Archipelago in Godot 4</h2>
<p class="blog-card__excerpt">Godot has no built-in asset streaming. We built four layers to run a 12km archipelago with 9 islands, 155 vegetation types, and 2,000 crowd instances — on an RTX 3060.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="studio-cli" class="blog-card">
<span class="blog-card__date">18 May 2026</span>
<h2 class="blog-card__title">One Binary to Rule Them All: Our Studio CLI</h2>
<p class="blog-card__excerpt">Every machine in our studio runs the same Go binary. It knows who you are, what machine you're on, and what services are reachable. It takes screenshots, sends them to cloud vision, and runs health checks — in 100ms.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
<a href="agentic-workflow" class="blog-card">
<span class="blog-card__date">6 March 2026</span>
<h2 class="blog-card__title">How a 4-Person Studio Runs on AI Agents</h2>
<p class="blog-card__excerpt">We gave AI agents persistent identities, skill playbooks, and access to our entire knowledge base. Here's how four people ship like forty.</p>
<span class="blog-card__read">Read &rarr;</span>
</a>
</div>
</body>
</html>