ntabs · exemplos
Vitrine#
Cada cartão abaixo é o HTML da própria página, sob o tema dela. São páginas, não fotos de páginas, e todas são markdown: abra uma e leia o texto. Pessoas, empresas e números são fictícios.
Sites#
Sites inteiros com chrome: site, feitos com as diretivas de layout: menu, hero, grades, bento, carrossel, faixa de logos, números que contam e rodapé. Do celular à tela ultra-wide, no claro e no escuro.
Orbit
- Recursos
- Espaços
- Preços
- Blog
Baixar
Conheça o Orbit, o jeito calmo de navegar
Abas que se arrumam sozinhas, uma barra lateral que lembra e um lugar para tudo o que você abre.
Baixar para Mac
Ver o filme
"O Orbit é o navegador que eu estava esperando."
— Quem usou por uma semana
40%
menos abas abertas depois de uma semana
1.200
times trocaram de navegador este ano
3x
mais rápido para achar qualquer coisa
Um navegador que chega antes de você
Abas organizadas, tela dividida e uma barra de comandos, sem nenhuma configuração para aprender.
Barra de comandos
Tudo fica a um atalho de distância.
Um espaço para cada lado seu
Trabalho, casa e projetos paralelos, cada um com as próprias abas e o próprio tema.
Conhecer os espaços
Relay
- Produto
- Documentação
- Preços
Entrar
Começar grátis
E-mail para quem escreve código
A API que entrega na caixa de entrada, com logs que você entende e domínios verificados em minutos.
Começar grátis
Ler a documentação
import { Relay } from "relay";
const relay = new Relay(process.env.RELAY_KEY);
await relay.emails.send({
from: "Ana <[email protected]>",
to: "[email protected]",
subject: "Seu pedido saiu",
markdown: "# Chegou a hora\nO pedido **#4821** está a caminho.",
});Times que confiam no Relay para mandar o que importa
Tudo o que acontece com cada mensagem
Cada envio tem uma linha do tempo: aceito, entregue, aberto, devolvido. Sem abrir chamado para descobrir.
Domínios em minutos
SPF, DKIM e DMARC conferidos por você, com o registro exato para colar no DNS.
Webhooks assinados
Entregue, aberto, clicado, devolvido. Cada evento chega com assinatura e reenvio.
Modelos em markdown
Escreva o e-mail como escreve um README. O HTML compatível com o Outlook fica com a gente.
Ambiente de teste
Uma chave que finge enviar, para a suíte não mandar e-mail a ninguém.
Filas por prioridade
Senha e recibo passam na frente da newsletter.
Regiões
São Paulo, Virgínia e Frankfurt. Os dados ficam onde o cliente está.
Entregas que você consegue ler
A taxa de entrega por dia, por domínio e por modelo, sem exportar planilha.
- 99,3% chega na caixa de entrada
- 1,8 s do envio à entrega, na mediana
- 0 mensagens perdidas desde o lançamento
title: Entregues por dia (milhares)
---
dia,entregues
seg,182
ter,204
qua,219
qui,236
sex,251
sáb,120
dom,983 bi
mensagens enviadas no ano
99,99%
disponibilidade da API
14 mil
times usando o Relay
Marina Costa
- Trabalho
- Experiência
- Escrita
Conversar
Desenho ferramentas que times usam o dia inteiro.
Oito anos em produto, hoje liderando design no Cobrali. Gosto de sistemas, de planilhas bonitas e de tirar cliques do caminho de quem trabalha.
Ver o trabalho
Currículo em PDF
8
anos em produto
40+
lançamentos
3
sistemas de design do zero
Trabalho selecionado
Três projetos, do sistema de design ao painel de cobranças. Cada um mudou um número que o time olhava toda semana.
Cobrali · Cobranças que se explicam
2024 · liderança de design
Redesenhei o painel de cobranças de 30 mil pequenas empresas. As chamadas ao suporte sobre "por que meu cliente não pagou" caíram pela metade em três meses.
Ler o estudo de caso
Visitaê · Agenda de visitas
2022 · design de produto
Uma agenda que corretor e comprador editam juntos. A taxa de visitas remarcadas caiu de 38% para 11%.
Levaki · Um sistema para sete países
2020 · sistema de design
180 componentes, tokens por país e uma documentação que os engenheiros abriam por vontade própria.
Outros projetos
Cartazes da Semana de Design
Identidade para o evento de 2023.
Uma fonte para números
Algarismos tabulares para painéis.
Grade de ícones
240 ícones em 20 px, código aberto.
Experiência
2023 — agora
Head de design, Cobrali — um time de seis designers, pagamentos e cobranças para pequenas empresas.
2020 — 2023
Designer de produto sênior, Visitaê — visitas, propostas e o aplicativo do corretor.
2017 — 2020
Designer de sistemas, Levaki — o sistema de design que atendia sete países.
Escrita
Planilhas são interfaces
Por que eu começo todo painel numa planilha, e o que ela ensina que o Figma esconde.
O botão que ninguém clicou
Um teste A/B que perdemos e o que aprendemos sobre confiança.
Tokens sem dor
Como sete países usaram o mesmo sistema sem virar sete sistemas.
NORTE
- Projetos
- Estúdio
- Contato
Identidade, tipografia e espaço para quem tem algo a dizer.
Estúdio de design em Porto Alegre, desde 2011.
Projetos selecionados
O estúdio
Somos onze pessoas entre designers, tipógrafos e uma arquiteta. Trabalhamos com poucos clientes por vez, do nome à placa na porta, e cada projeto tem uma sócia responsável do primeiro ao último dia.
Desenhamos marcas para museus, editoras, cooperativas e empresas de tecnologia que preferem ser lembradas a ser notadas.
14
anos de estúdio
210
projetos entregues
9
prêmios de design
Mais projetos
Cooperativa Campo Largo — marca e embalagens
Arquivo de Vila Serena — sistema de sinalização
Norte Grotesk — uma família tipográfica
Teatro Vila Serena — temporada 2025
Livraria Cachalote — identidade
name: Lia Ramos
bio: Cozinha de verdade, sem frescura. Receitas de 20 minutos, um podcast e a newsletter de domingo.
avatar: /demo/layout/person-5.svg
instagram: https://instagram.com
youtube: https://youtube.com
tiktok: https://tiktok.com
spotify: https://spotify.com* [Meu livro: Panela Única](#livro)
[Newsletter de domingo](#newsletter)
[Parcerias e publicidade](mailto:[email protected])
1,2 mi
pessoas cozinhando junto
Podcast Prato Feito
Ep. 88 — mercado, feira ou atacado?
youtube: https://youtu.be/exemplo
title: Arroz de forno em uma panela só
note: O vídeo mais visto do canal, 3,4 milhões de vezes
Newsletter de domingo
Uma receita, uma lista de compras e o que está barato na feira. 48 mil leitores.
Assinar grátis
spotify: https://open.spotify.com/show/exemplo
title: Prato Feito, o podcast
note: Toda quarta, 30 minutosPanela Única
O livro com 80 receitas que sujam uma panela só. Segunda edição, com o capítulo de marmitas. Todas testadas nesta panela de ferro, que é a que eu tenho em casa.
Comprar o livro
Ler um capítulo
Do Instagram
BRASA/26
- Palestrantes
- Programação
- Local
Ingressos
14 e 15 de novembro · Recife
Brasa Conf 2026
Dois dias sobre design e produto feitos no Brasil, para quem faz.
Garantir ingresso
Ver a programação
24
palestras
900
pessoas
2
dias no Armazém 9
6
oficinas práticas
Palestrantes
Helena Prates
Estúdio Norte
Tomás Reis
Banco Lume
Júlia Anes
Levaki
Marina Costa
Cobrali
Lia Ramos
Prato Feito
Rafa Lemos
Polo Mangue
Programação
Sexta, 14
| Hora | Palestra |
|---|---|
| 09:00 | Abertura e café |
| 10:00 | Helena Prates — Marcas que a cidade adota |
| 11:00 | Tomás Reis — O design de um app com 100 milhões de contas |
| 14:00 | Oficinas |
| 17:00 | Júlia Anes — Pesquisa em 48 horas |
Sábado, 15
| Hora | Palestra |
|---|---|
| 09:30 | Marina Costa — Planilhas são interfaces |
| 10:30 | Lia Ramos — De um vídeo a um livro |
| 14:00 | Oficinas |
| 16:00 | Rafa Lemos — Recife, polo de produto |
| 18:00 | Encerramento e festa |
A equipe
Quem está montando os dois dias. Os membros do grupo da organização se veem aqui; todo mundo vê os palestrantes acima.
Palavras de corredor
Primeira conferência? Estas são as que você vai ouvir no café. Vire para saber.
Ingressos
Lote 2 à venda. O preço sobe no dia 1º de outubro.
Cursos#
Um curso é uma pasta: a página de cima apresenta e lista as lições, cada lição é uma página, e o que precisa ficar de cor está em @flashcards — cartões que viram ao clicar.
As três lições: No café, Na rua, No restaurante.
Um tema para o site inteiro#
Uma subpágina sem cerca theme veste o tema da página de cima. Com inherit, ela herda e muda só o que precisa.
Preços do Orbit#
Nenhuma cerca de tema: tudo vem do Orbit.
Blog do Orbit#
inherit e outra fonte, maior, para ler.
Documentação do Relay#
inherit com chrome: app: as cores do site, o caminho de páginas de volta.
Estudo de caso da Marina#
Uma página de portfólio que herda o portfólio.
Páginas de trabalho#
Semana 36 · 1 a 7 de setembro
Visão geral
1,2 mi
e-mails entregues
99,2%
entregues na caixa de entrada
312 ms
latência p95 da API
14
alertas abertos
Envios por região
type: donut
title: E-mails por região (mil)
---
região,e-mails
São Paulo,521
Virgínia,388
Frankfurt,214
Tóquio,96Envios ao longo da semana
type: area
title: Envios por dia (mil)
---
dia,transacional,newsletter
seg,32,120
ter,41,133
qua,38,141
qui,52,150
sex,47,162
sáb,12,80
dom,9,64Um site de receitas · últimos 30 dias
Audiência
8.412
visitas
3.107
visitantes únicos
2m 14s
tempo médio
41%
rejeição
Visitas por semana
type: line
title: Visitas por semana
---
semana,visitas
S1,1420
S2,1890
S3,2310
S4,2792Origem do tráfego
type: pie
title: Sessões por origem
---
origem,sessões
Busca,3980
Direto,2210
Social,1470
Referência,752ntabs · bloco novo
Checklist
Um bloco que conta, agrupa e lembra. O markdown já desenhava - [ ], mas a caixa vinha desativada: era a foto de um checklist. Este funciona.
title: Antes do deploy
## Testes
- [ ] Suíte Ruby — espera **982 runs, 0 falhas**
- [x] Suíte JavaScript
- [ ] Console limpo em todas as páginas
## Revisão
- [ ] Ler o diff inteiro
- [ ] Conferir que nada de `debugger` ficou
## Publicação
- [ ] Subir a branch
- [ ] Esperar o CIO contador vale pro todo e pra cada seção. A barra segue o accent do tema.
Um segundo, independente
Dois checklists na mesma página não dividem marcações.
Checklist AbrirPerfis e conversas#
Um feed, um currículo, um chat: formatos conhecidos, escritos em markdown.
Feed
Bruno Aragão
Fundador do Relay · Recife, Brasil · pill:accent:Conectar pill:Mensagem
Bruno Aragão · 2º · 3h
Nos últimos meses foquei nos webhooks do Relay. A tese: quem integra primeiro fica. A documentação virou uma página, e eu uso todo dia.
👍 48 · 💬 12 · ↗ 6
Clara Duarte · 1º · 1d
Publiquei minha primeira página no flows.md. O tema editorial ficou bonito sem eu mexer em nada.
👍 22 · 💬 4
Experiência
| Cargo | Onde | Período |
|---|---|---|
| Fundador | Relay | 2024 – hoje |
| Engenheiro de software | Levaki | 2019 – 2024 |
| Estagiário | Cobrali | 2018 – 2019 |
Competências
APIs · Entregabilidade de e-mail · Design de produto · Markdown
Conversa
Suporte Orbit
title: hoje
Ana: Oi! Instalei o Orbit no notebook novo, mas meus espaços não apareceram @ 09:12
me: Oi Ana! Você entrou com a mesma conta do outro computador? @ 09:13
Ana: Entrei sim @ 09:13
me: Então é a sincronização que ainda está baixando. Abre Ajustes → Contas e toca em Sincronizar agora @ 09:15
me: Com muitos espaços leva uns dois minutos na primeira vez @ 09:15
Ana: Apareceram 🎉 obrigada @ 09:20
me: De nada! Qualquer coisa é só chamar @ 09:21Ana
Apareceram 🎉 obrigada · 09:20
Caio
Dá pra exportar os favoritos? · ontem
Orbit · canal
Nova versão com tela dividida · ontem
Pessoas e conversa fictícias.
Suporte Orbit AbrirPara você
Início
Clara Duarte · @clara.escreve · 2h
Publiquei o guia de estilo do time como uma página no flows.md. Markdown, tema, dois diagramas. Zero HTML. pill:accent:flows pill:escrita
💬 12 · 🔁 34 · ♥ 210 · 👁 4,1 mil
Bruno Aragão · @bruno.aragao · 5h
Testando escrever o blog inteiro em markdown e publicar com um clique. O tema escuro veio de graça. pill:blog
💬 3 · 🔁 8 · ♥ 96
Relay · @relay_mail · 1d
Logs de entrega que você entende: aceito, entregue, aberto, devolvido. A linha do tempo inteira no link. pill:accent:e-mail
💬 7 · 🔁 21 · ♥ 143
Tendências para você
#markdown · 12,4 mil posts · #designsystem · 3,2 mil · #escrita · 1,8 mil
Quem seguir
| Dora Escreve @dora_escreve | Ensaios sobre escrita e ferramentas | pill:accent:Seguir |
| Relay @relay_mail | E-mail para quem escreve código | pill:accent:Seguir |
Pessoas, perfis e números fictícios.
Início Abrirliaramos · Seguindo
Lia Ramos
128
publicações
2.431
seguidores
512
seguindo
Cozinha de verdade, sem frescura. Receitas de 20 minutos toda terça. pill:accent:Receitas toda terça pill:Belo Horizonte
🖼 Cuscuz de frigideira
18 minutos, uma panela. 210 curtidas
🖼 Feira de sábado
O que estava barato. 96 curtidas
🖼 Bolo de fubá
A receita da avó, sem balança. 143 curtidas
🖼 Marmitas da semana
Cinco almoços em uma hora. 77 curtidas
🖼 Arroz de forno
O vídeo mais pedido. 64 curtidas
🖼 Café da tarde
Pão de queijo de liquidificador. 58 curtidas
Destaques
Receitas · Feira · Livro · Podcast
Pessoa, perfil e números fictícios.
Lia Ramos AbrirPara você
@liaramos
▶ 48,2 mil
Arroz de forno em uma panela só pill:accent:#receita
▶ 12,7 mil
Feira com 50 reais pill:#economia
▶ 9,4 mil
Marmita que não fica sem graça pill:#marmita
▶ 7,1 mil
Pão de queijo de liquidificador pill:#lanche
▶ 5,8 mil
Três molhos, um pote pill:#molho
▶ 4,3 mil
Bolo de fubá sem balança pill:#bolo
214 mil
curtidas
12,4 mil
seguidores
318
seguindo
42
vídeos
Som em alta
som original — liaramos · 1,2 mil vídeos
Pessoa, perfil e números fictícios.
@liaramos Abrir