O acrônimo UI refere-se a qualquer interface entre um humano e uma máquina, seja baseada em texto, voz ou gestos. A GUI, por sua vez, é apenas uma forma particular: aquela que passa por elementos gráficos exibidos na tela. Compreender a diferença entre GUI e UI permite fazer as escolhas de design corretas desde o início de um projeto digital, em vez de confundir tudo com uma de suas partes.
GUI, CLI, VUI: as três famílias de interfaces de usuário na prática
Falar de UI sem especificar de que tipo se refere é como falar de veículo sem distinguir uma bicicleta de um caminhão. A interface do usuário (UI) é um termo genérico que abrange várias famílias técnicas, cada uma com suas restrições de design e casos de uso.
| Tipo de interface | Abreviação | Modo de interação | Exemplo concreto |
|---|---|---|---|
| Interface gráfica | GUI | Clique, toque, arraste em elementos visuais (botões, ícones, menus) | Aplicativo móvel, software de desktop, site web |
| Interface de linha de comando | CLI | Entrada de comandos textuais em um terminal | Terminal Linux, PowerShell, Git Bash |
| Interface vocal | VUI | Comandos orais, retorno sonoro ou vocal | Assistentes vocais (Alexa, Siri), totens vocais |
| Interface natural | NUI | Gestos, movimentos corporais, olhar | Headsets de realidade mista, Kinect |
A GUI é um subconjunto da UI, não um sinônimo. Um projeto pode combinar vários tipos de interfaces: um aplicativo de navegação automotiva associa uma GUI (mapa na tela) e uma VUI (instruções vocais). Ambas pertencem à UI, mas suas restrições de design divergem totalmente.
Para aprofundar a definição da interface GUI e suas especificidades em relação às outras formas de UI, é necessário examinar o que a distingue do ponto de vista técnico: a camada gráfica intermediária entre o sistema e o usuário.
Design de uma interface gráfica (GUI): os elementos que a diferenciam de uma UI não visual
Uma GUI baseia-se em um vocabulário visual estruturado. Cada elemento exibido na tela desempenha um papel preciso na interação, e é essa camada gráfica que a separa das outras formas de UI.
Os componentes típicos de uma GUI incluem:
- Janelas, painéis e abas que organizam o espaço de trabalho e segmentam as tarefas
- Botões, caixas de seleção e listas suspensas que acionam ações ou configuram escolhas
- Retornos visuais (barras de progresso, animações de carregamento, mudanças de cor ao passar o mouse) que confirmam ao usuário que seu comando foi levado em conta
- Uma tipografia, uma paleta de cores e uma grade de layout que definem a hierarquia da informação
Uma CLI, por outro lado, não possui nenhum desses elementos. O usuário digita um comando, o sistema retorna texto. A carga cognitiva recai inteiramente sobre a memorização da sintaxe. A GUI transfere essa carga para o reconhecimento visual, o que a torna mais acessível para usuários não técnicos, mas mais pesada de projetar e manter.
Uma VUI apresenta outro problema de design: a ausência total de tela. O designer deve estruturar um diálogo, antecipar ambiguidades vocais, gerenciar o ruído ambiente. As ferramentas, as habilidades e os entregáveis não têm nada em comum com os de um designer de GUI.
Acessibilidade e normas: como a regulamentação europeia redefine a relação entre UI e GUI
A distinção entre UI e GUI ganha uma dimensão concreta com as obrigações legais de acessibilidade na Europa. Desde o 28 de junho de 2025, a Lei Europeia de Acessibilidade (Diretiva (UE) 2019/882) é aplicável nos 27 países da UE para uma ampla gama de produtos e serviços digitais de consumo: e-commerce, serviços bancários, transporte, telecomunicações, livros digitais.
Essa diretiva se baseia tecnicamente na norma europeia EN 301 549, que incorpora os critérios WCAG 2.1 nível AA para conteúdo digital. Na prática, toda interface gráfica destinada ao público em geral na Europa deve respeitar requisitos detalhados de contraste, navegação por teclado, legibilidade e compatibilidade com leitores de tela.
Impacto no design das GUIs
Um botão que não atende à proporção de contraste exigida pela WCAG 2.1 AA não é mais apenas uma má escolha estética: é uma falha de conformidade legal. Os totens de autoatendimento (quiosques) também devem seguir a EN 301 549 e a WCAG 2.1 AA, com a obrigação de publicar uma declaração de acessibilidade.
A WCAG 2.2, publicada em dezembro de 2024, introduz novos critérios que modificam o design das GUIs sem ainda serem plenamente exigidos pela regulamentação. Os designers de GUI devem, portanto, antecipar dois níveis de conformidade simultâneos.
E as interfaces não gráficas?
A norma EN 301 549 não se limita às GUIs. Ela também abrange interfaces vocais e interfaces de linha de comando, mas com critérios diferentes. A conformidade de uma UI depende do tipo de interface implementada. Um assistente vocal deve atender a requisitos de clareza e fluência, não de contraste visual. Essa é uma ilustração muito direta do motivo pelo qual confundir UI e GUI leva a erros de especificação em um caderno de encargos.
Escolher entre GUI e outras formas de UI de acordo com o contexto do produto
A escolha do tipo de interface não é uma questão de preferência, mas de uma análise do contexto de uso. Um operador em sala de servidores que executa comandos repetitivos será mais rápido com uma CLI do que com uma GUI. Um cliente que consulta um catálogo de produtos em seu telefone precisa de uma GUI tátil otimizada.
A questão a ser feita não é “GUI ou não GUI”, mas “que tipo de UI corresponde às restrições do usuário, do ambiente e da regulamentação”. Em um veículo em movimento, uma VUI reduz a distração visual. Em um totem público, a GUI deve integrar áreas táteis suficientemente grandes para respeitar as normas de acessibilidade.
O tipo de UI dita as habilidades da equipe de design. Um projeto de GUI mobiliza designers de UI, desenvolvedores front-end e especialistas em acessibilidade visual. Um projeto de VUI requer linguistas computacionais e designers conversacionais. Confundir esses perímetros desde a fase de definição gera atrasos e custos adicionais durante o desenvolvimento.
A distinção entre GUI e UI, portanto, não é um debate de vocabulário. Ela estrutura as decisões técnicas, orçamentárias e regulatórias de um projeto digital desde suas primeiras fases.
