INO
Uma vitrine de museu em silêncio – cada peça exposta flutua em um espaço branco, como um objeto individual atrás de um vidro, emoldurado por uma fonte quase preta e quase inaudível.
A INO funciona como uma galeria de joias quase monocromática: uma tela branca nítida, uma única tinta quente, quase preta, e uma ausência quase total de cor. O sistema visual trata cada anel como uma peça de museu — fotografias de produtos com aspecto clínico flutuando em um amplo espaço negativo, com hierarquia construída por meio da posição, espaçamento entre letras e volume de branco, em vez de por meio do tamanho ou cor da fonte. A navegação está localizada na parte inferior da página, consistindo em quatro pontos com rótulos (preenchidos ou vazios), uma inversão deliberada da barra superior tradicional do e-commerce. A própria marca é um conjunto de contornos de anéis concêntricos, ecoando a forma do produto e servindo como uma escultura tipográfica em vez de um logotipo.
Uma tela de largura total, sem limite máximo de largura para o conteúdo. A tela principal ocupa toda a largura da página, com fotografias e gráficos divididos igualmente (50/50). As grades de produtos são exibidas em linhas de três colunas com uma margem horizontal generosa a partir da borda da área visível. A navegação inferior é centralizada e ancorada ao rodapé da página, em vez de fixa. As quebras de seção utilizam fotografias editoriais em tela cheia ou espaço em branco puro — nunca uma barra de cores, linha divisória ou gradiente. O ritmo vertical é livre: 80/1/1 entre as seções principais, permitindo que a página respire em vez de ser preenchida com conteúdo. Não há barra lateral, mega menu ou cabeçalho superior — o logotipo "INO" está localizado exclusivamente no canto superior esquerdo da tela principal.
Dois modos distintos de exibição de imagens coexistem: fotografia clínica de produtos em um fundo plano, cinza-claro e uniforme (cada anel é fotografado centralizado, sem mãos, adereços estilizados ou sombras na superfície — o objeto é o protagonista) e imagens editoriais narrativas (um anel em uma caixa forrada de grama, uma mão segurando uma corrente), renderizadas como fragmentos editoriais dessaturados em tela cheia. As imagens de produtos servem como cartões de visita; as imagens editoriais transmitem a essência da marca. Ambas são monocromáticas ou quase monocromáticas — a grama na imagem principal é o único toque de verde, e mesmo esse é suavizado para um tom de floresta. Ícones não são usados na interface — um símbolo de anéis concêntricos substitui toda a iconografia.
Paleta
Neutro
- Obsidian Ink
#212123— Estados neutros, texto com ícones e feedback discreto da interface do usuário, onde os esquemas de cores devem permanecer discretos. - Bone
#ffffff— Páginas em tela, superfícies de papelão, texto invertido sobre fundo escuro. A superfície dominante; quase todo o site está localizado aqui. - Carbon
#000000— Preenchimento de ícones, contornos gráficos decorativos e preenchimento de estado ativo para o indicador de ponto de navegação. Usado com moderação para obter o máximo contraste tonal com a cor "óssea". - Ash
#999999— Bordas de contraste médio, contornos de controle e divisores estruturais. - Pebble
#a6a6a7— Texto de apoio discreto, separadores finos para o texto principal e metadados secundários. O tom de cinza funcional mais claro é usado para etiquetas de preço e textos complementares que devem se integrar ao fundo.
Tipografia
de 11 a 18px · 4 etapas
- Sequel100Wide — substituição: Jost (400 · esboços 400 · A única tipografia corporativa usada exclusivamente na versão 400 em todos os contextos — navegação, corpo do texto, títulos, cabeçalhos, preços e legendas. O símbolo geométrico com espaçamento amplo entre as letras reflete todo o estilo corporativo. A ausência de uma versão em negrito é intencional: a hierarquia é alcançada por meio de maiúsculas, espaçamento entre letras e posicionamento, em vez de variações na espessura da fonte.
- Arial — substituição: system-ui · esboços 400 · Uma alternativa para todo o sistema na renderização de botões em contextos legados. Não faz parte da identidade visual da marca — só aparece se o Sequel100Wide não carregar.
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | denso |
| Passo básico | 23px |
| Raio do botão | 50px |
| Raio do cartão | 8px |
| Sombras | não - bordas em vez de sombras |
| Entre seções | 80-120px |
A IA criará seu site no estilo INO e o preencherá.
- Compartilhe produtos e publicações através dos links - Instagram, TikTok, Facebook.
- Transfira o conteúdo do seu site antigo — basta especificar o endereço.
- Design moderno na melhor engine: React ( Next.js) com renderização no servidor e otimização de SEO integradas.
- Otimização de SEO totalmente automatizada para resultados de pesquisa e recomendações de redes neurais.
Estilos semelhantes
- Airbnb — Uma discreta parede branca de galeria com um único marcador de livros vermelho-coral.
- Peak Design — Parede da galeria, parcialmente iluminada
- 099 SUPPLY — Uma parede de galeria repleta de objetos em preto e branco.
- Apple (España) — vitrine branca para galeria
- Apple (España) — Uma janela de galeria na névoa da manhã
- Custo — Uma galeria em tons de cinza-chumbo com uma fonte monolítica. Um showroom em tons suaves de cinza-esverdeado, onde um único objeto escuro e uma fonte de 57px falam por si.
- Silencio — Uma sala branca com objetos flutuantes. Uma galeria de arte feita de papel em tons quentes, onde cada elemento ocupa seu lugar contra um fundo de volume negativo, e o silêncio é uma decisão de design intencional.
- Oakâme — Uma oficina provençal banhada de sol, esculpida em pedra quente.
- Nike — Uma galeria monocromática de conquistas esportivas – paredes brancas, o produto como obra de arte, o cromo dissolvido no fundo.
- Sociotype — Um exemplar típico de museu em papel branco.
- Arc — galeria industrial branca sobre água à meia-noite
- Rivian — Um monólito elétrico na parede de concreto da galeria. A Rivian apresenta cada veículo como uma escultura contra um vasto espaço branco, com uma tipografia tão grande que se torna um elemento arquitetônico, e um único amarelo quente que quebra a atmosfera monocromática, como a luz do sol em uma superfície fosca.