Web3 + AI Gamification Front-end Dev Hackathon
Personal project · 2026 Projeto pessoal · 2026

Solana WTF

What The Fork?! — turning a glossary SDK into a gamified learning platform What The Fork?! — transformando um SDK de glossário em uma plataforma gamificada de aprendizado

Year
2026
Role
Design + Development
Platform
Web (responsive)
Stack
Next.js 16 · React 19 · Tailwind v4
Status
Live
Built for
Superteam Brazil Hackathon
"Dry glossaries don't teach — play does." "Glossários secos não ensinam — jogar sim."
— Core product philosophy — Filosofia central do produto

Solana WTF is live — explore 1001 terms, play 5 games, and unlock AI personalities. Solana WTF está no ar — explore 1001 termos, jogue 5 jogos e desbloqueie personalidades IA.

Open Solana WTFAbrir Solana WTF
00 — The Bounty00 — O Bounty

Superteam Brazil Glossary Challenge Superteam Brazil Glossary Challenge

Superteam Brazil launched a $3,300 USDG bounty challenging developers to build innovative applications on top of the @stbr/solana-glossary SDK — an npm package with 1,000+ cross-referenced Solana terms, categorized content, and i18n support for PT-BR and Spanish. The brief: "Build something cool on top of it. And useful."

A Superteam Brazil lançou um bounty de $3.300 USDG desafiando desenvolvedores a criar aplicações inovadoras usando o SDK @stbr/solana-glossary — um pacote npm com mais de 1.000 termos Solana, conteúdo categorizado e suporte a i18n para PT-BR e espanhol. O briefing: "Construa algo legal em cima disso. E útil."

30%
Usefulness & ImpactUtilidade & Impacto
Solves real problems for developersResolve problemas reais para desenvolvedores
25%
Quality & PolishQualidade & Acabamento
Excellent functionality and user experienceFuncionalidade e experiência do usuário excelentes
25%
CreativityCriatividade
Novel approaches and unexpected implementationsAbordagens originais e implementações inesperadas
10%
SDK IntegrationIntegração com o SDK
Proper data layer usageUso correto da camada de dados
10%
DocumentationDocumentação
Clear setup instructions and demosInstruções de setup e demos claras
01 — The Challenge01 — O Desafio

1001 terms. Zero engagement. 1001 termos. Zero engajamento.

The @stbr/solana-glossary SDK contains 1001 Solana terms across 14 categories with translations in PT-BR and Spanish. It's a rich data source — but raw JSON files and term lookups don't teach anyone. The challenge: turn static data into something people actually want to use and come back to.

O SDK @stbr/solana-glossary contém 1001 termos Solana em 14 categorias com traduções em PT-BR e espanhol. É uma fonte rica de dados — mas arquivos JSON e consultas de termos não ensinam ninguém. O desafio: transformar dados estáticos em algo que as pessoas realmente queiram usar e voltar.

"People don't learn by reading definitions. They learn by using concepts in context — under pressure, with feedback, and with personality." "Pessoas não aprendem lendo definições. Aprendem usando conceitos em contexto — sob pressão, com feedback e com personalidade."

Design philosophy Filosofia de design
02 — The Solution02 — A Solução

Decode. Browse. Play. Decodifique. Explore. Jogue.

01
AI Decoder

Paste any error, code, or question. 4 AI personality guides explain Solana concepts in their own style. Cole qualquer erro, código ou pergunta. 4 guias IA explicam conceitos Solana no estilo deles.

02
Glossary BrowserNavegador de Glossário

Search, filter, and explore 1001 terms across 14 categories. Full i18n support. Busque, filtre e explore 1001 termos em 14 categorias. Suporte completo a 3 idiomas.

03
Learning GamesJogos de Aprendizado

5 games to reinforce knowledge: Daily, Speed Run, Connections, Lost in Translation, Category Blitz. 5 jogos para reforçar o conhecimento: Diário, Speed Run, Conexões, Lost in Translation, Blitz de Categorias.

03 — Personality System03 — Sistema de Personalidades

4 guides. 4 voices. 4 guias. 4 vozes.

Instead of generic AI responses, the decoder uses template-based personality guides — zero API cost. Each guide explains the same concepts in a radically different voice, making repeated lookups feel fresh.

Em vez de respostas genéricas de IA, o decoder usa guias de personalidade template-based — custo zero de API. Cada guia explica os mesmos conceitos com uma voz radicalmente diferente, fazendo consultas repetidas parecerem novas.

🎀
Maid-chan

Kawaii explanations with emoji and enthusiasmExplicações kawaii com emoji e entusiasmo

🔥
Degen Sensei

CT slang, "ser", "few understand this"Gírias de CT, "ser", "poucos entendem isso"

🤖
GLaDOS

Passive-aggressive, sarcastic precisionPrecisão passivo-agressiva e sarcástica

🎲
DnD Master

Epic fantasy narration for every conceptNarração épica de fantasia para cada conceito

04 — Progression & Unlocks04 — Progressão & Desbloqueios

Play more. Unlock more. Jogue mais. Desbloqueie mais.

The app uses a progression system inspired by gacha games. Playing games and using the decoder unlocks new personalities and character skins, with a cinematic fullscreen reveal animation.

O app usa um sistema de progressão inspirado em jogos gacha. Jogar e usar o decoder desbloqueia novas personalidades e skins, com uma animação cinematográfica de revelação em tela cheia.

Maid-chan skin unlock reveal DnD Master skin unlock reveal
1
Degen Sensei
Unlocked after scoring in 3 different gamesDesbloqueado após pontuar em 3 jogos diferentes
2
GLaDOS
Unlocked daily or after 3 games playedDesbloqueado diariamente ou após 3 jogos
3
Character SkinsSkins de Personagem
Unlocked at 5, 10, and 15 decodes per personalityDesbloqueadas com 5, 10 e 15 decodificações por personalidade
Solana WTF homepage
05 — Design System05 — Design System

Cyberpunk meets Solana.Cyberpunk encontra Solana.

Deep navy palette with Solana's official accent colors. Every element — from chamfered corners to neon glow cards — reinforces the cyberpunk aesthetic while maintaining readability and accessibility.

Paleta navy profunda com as cores oficiais da Solana. Cada elemento — de cantos chanfrados a cards com brilho neon — reforça a estética cyberpunk mantendo legibilidade e acessibilidade.

Color PalettePaleta de Cores
Brand Colors

Purple #9945FF · Green #14F195 · Cyan #03E1FF · Magenta #DC1FFF

TypographyTipografia
Font Stack

Orbitron (titles) · Rajdhani (nav) · Fira Code (mono) · Inter (body)

UI Components
Design TokensTokens de Design

glow-card · neon-btn · gradient-text · pixel-badge · category-pill

06 — Tech Stack06 — Tech Stack

Built with modern tools.Construído com ferramentas modernas.

Next.js 16
Framework

App Router, Turbopack, Server Components, 1001 static pages

React 19
UI Library

useSyncExternalStore, createPortal, CustomEvent bus

Tailwind CSS v4
Styling

Inline theme config, responsive cyberpunk design system

TypeScript
Type SafetySegurança de Tipos

Full type safety across components and API routesSegurança de tipos completa em componentes e rotas de API

Supabase
Auth + Database

Auth (Google + Wallet), cloud progress sync, RLS policies

@stbr/solana-glossary
Data SDK

1001 terms, 14 categories, i18n data (PT-BR, ES)

07 — SDK Integration07 — Integração com o SDK

Deep SDK integration.Integração profunda com o SDK.

Every feature in Solana WTF is powered by the @stbr/solana-glossary data. The custom server-side wrapper provides cached lookups, search, category filtering, and locale-aware translations.

Cada funcionalidade do Solana WTF é alimentada pelos dados do @stbr/solana-glossary. O wrapper server-side customizado fornece lookups em cache, busca, filtro por categoria e traduções com suporte a idiomas.

1
Terms API
getAllTerms(), getTerm(id), searchTerms(query)
2
Categories
getTermsByCategory(), getCategories() — 14 categories
3
i18n
getLocalizedTerms(locale) — PT-BR and ES translations
4
Games
getRandomTerm(), shuffled term selection for all 5 gamesgetRandomTerm(), seleção aleatória de termos para os 5 jogos
5
Decoder
Term detection in user input + personality-based explanationsDetecção de termos no input do usuário + explicações por personalidade
6
Static Gen
1001 term detail pages pre-rendered at build time1001 páginas de detalhe de termos pré-renderizadas no build
Giuliana's role in this project Papel da Giuliana no projeto
"I designed and built this entire platform solo — from the cyberpunk UI system and progression mechanics to the AI personality templates and cloud sync architecture." "Projetei e construí toda esta plataforma solo — do sistema de UI cyberpunk e mecânicas de progressão aos templates de personalidade IA e arquitetura de sincronização na nuvem."
Designer + Developer · Built with Claude Code
1001
TermsTermos
5
GamesJogos
4
AI GuidesGuias IA
3
LanguagesIdiomas
Let's work togetherVamos trabalhar juntos
Interested in
this project?
Interessado
neste projeto?