Retalho · SaaS
Um sistema de ponto de venda que reúne vendas, inventário e talões no terminal, no tablet e no telemóvel.
Captura de ecrã, 1908 × 944
Serviços de design UX/UI para apps web e móveis
Investigação UX, fluxos, interfaces e sistemas de design, testados com utilizadores reais antes de construir.
Serviços de design que oferecemos
Sete serviços, da primeira entrevista ao sistema com que os seus programadores desenvolvem. Escolha um ou os sete.
Investigação UX
Entrevistas, analítica e um olhar sobre a concorrência, para que o design parta do que os utilizadores fazem e não de suposições.
Design UX
Fluxos de utilizador, wireframes e protótipos navegáveis que decidem como o produto funciona antes de o desenhar ao pormenor.
Design UI
Cada ecrã em cada estado — vazio, a carregar, com erro e cheio — numa linguagem visual que é sua.
Sistemas de design
Componentes e tokens no Figma, alinhados com os do código, para que os novos ecrãs se montem em vez de se redesenharem.
Testes de usabilidade
Pessoas como os seus utilizadores experimentam o protótipo; onde ficam presas, o fluxo muda antes de alguém o construir.
Acessibilidade
Contraste, tamanho do texto, ordem do foco, etiquetas e uso com teclado, verificados face às WCAG ao desenhar cada ecrã.
Auditoria UX e redesenho
Uma revisão dos fluxos, dos ecrãs e das desistências do seu produto no ar, e um redesenho do que falha, em passos que a sua equipa pode publicar.
O nosso processo de design UX/UI
Cinco passos, do que os seus utilizadores fazem de facto a um design que os seus programadores podem construir.
01Âmbito
Utilizadores, objetivos, analítica e concorrência estudados, com uma auditoria UX se já estiver em produção.
02Wireframes
Fluxos de utilizador, arquitetura de informação e wireframes de cada ecrã-chave.
03Design UI
Cada ecrã e cada estado desenhados, com o sistema de design construído ao mesmo tempo.
04Protótipo e testes
Um protótipo navegável testado com utilizadores reais, corrigido e testado de novo.
05Entrega
Especificações, tokens e a biblioteca Figma, com as dúvidas dos seus programadores respondidas durante o desenvolvimento.
01Âmbito
Utilizadores, objetivos, analítica e concorrência estudados, com uma auditoria UX se já estiver em produção.
02Wireframes
Fluxos de utilizador, arquitetura de informação e wireframes de cada ecrã-chave.
03Design UI
Cada ecrã e cada estado desenhados, com o sistema de design construído ao mesmo tempo.
04Protótipo e testes
Um protótipo navegável testado com utilizadores reais, corrigido e testado de novo.
05Entrega
Especificações, tokens e a biblioteca Figma, com as dúvidas dos seus programadores respondidas durante o desenvolvimento.
Desenhado para ser construído
Quer o desenvolvamos nós quer os seus programadores, o design chega ao código sem perder nada: os mesmos componentes, os mesmos nomes, cada estado.
Os mesmos nomes
Componentes, variantes e tokens são nomeados no ficheiro como o código os nomeia, para que nada se traduza pelo caminho.
Cada estado desenhado
Vazio, a carregar, com erro e desativado, desenhados antes de alguém perguntar, para que nenhum estado fique por adivinhar.
Desenvolvido por nós ou pela sua equipa
A mesma equipa desenvolve-o, ou os seus programadores recebem os ficheiros e o sistema para o desenvolverem eles mesmos.
Setores para os quais desenvolvemos software
Desenvolvimento de software à medida para cada setor: web, móvel e IA, construído e auditado em segurança pela mesma equipa.
Também desenvolvemos software para seguros (insurtech), administração pública (govtech), energia e media. Se o seu setor não estiver na lista, também podemos desenvolver software para ele.
Porquê a SafeBlockLab
Um estúdio que investiga, desenha e testa o seu produto, e que também o pode construir.
Desenhado por quem o constrói.
Designers e engenheiros são uma só equipa, por isso não se desenha nenhum ecrã que o código não consiga suportar.
Testado com utilizadores antes de ser construído.
Pessoas como os seus utilizadores experimentam os fluxos quando mudá-los ainda custa um desenho, não uma reprogramação.
Um só sistema, no ficheiro e no código.
Componentes e tokens têm os mesmos nomes no Figma e no código, para que o produto se mantenha coerente ao crescer.
Acessível desde o primeiro ecrã.
O contraste, o foco e as etiquetas são verificados ao desenhar cada ecrã, não remendados depois do lançamento.
Só design, se lhe convier.
Entregue o trabalho aos seus programadores com cada estado desenhado, ou deixe a mesma equipa construí-lo.
Primeiro, um orçamento por escrito.
Âmbito, preço e datas por escrito após uma primeira chamada, antes de começar o design.
Tecnologias e ferramentas para design UX/UI
Onde os designs são feitos e o que os leva ao desenvolvimento.
Software que temos em produção
Três produtos próprios, desenhados, desenvolvidos e testados pela mesma equipa que faz o trabalho para clientes.
Viagens
Uma app de reservas de viagem cujo assistente de IA encontra voos, hotéis e ideias de viagem, até à reserva confirmada.
IA
Silvia AI
Um assistente de IA para apoio ao cliente e vendas, que responde a dúvidas e orienta os compradores.
Captura de ecrã, 1908 × 944
Perguntas sobre design UX/UI
As que as equipas fazem antes de começar um, respondidas sem rodeios.
Quanto custa o design de um produto?
Depende do âmbito: alguns fluxos-chave, uma app inteira ou um sistema de design. Após uma primeira chamada recebe um orçamento por escrito com o âmbito, o preço e as datas, antes de começar o design.
Quanto tempo demora o design?
Depende do âmbito: alguns fluxos demoram menos do que um produto inteiro e o seu sistema de design. O orçamento fixa as datas, e vê o trabalho em cada etapa, não só no fim.
Podem fazer só o design, para os nossos programadores?
Sim. Desenhamos e desenvolvemos juntos, ou desenhamos por nossa conta e entregamos o trabalho aos seus programadores, o que melhor servir a sua equipa.
Podem trabalhar com os nossos designs ou o nosso sistema de design?
Sim. Podemos alargar o seu sistema de design, redesenhar o que não funciona ou construir a partir dos ficheiros Figma dos seus designers.
O que recebemos no fim?
Os ficheiros de design, um protótipo navegável dos fluxos-chave e o sistema de design com que os ecrãs são construídos. O que está incluído fica fixado no orçamento.
Como testam os designs com utilizadores?
Colocamos um protótipo navegável à frente de pessoas como os seus utilizadores e vemo-las tentar as tarefas-chave. Onde ficam presas, o fluxo é redesenhado e testado de novo antes de se construir nada.
Podem redesenhar um produto que já está no ar?
Sim. Uma auditoria UX revê o produto no ar — os seus fluxos, os seus ecrãs e onde os utilizadores desistem — e o redesenho corrige o que ela encontra, em passos que a sua equipa pode publicar.
Desenham a pensar na acessibilidade?
Sim. O contraste, o tamanho do texto, a ordem do foco, as etiquetas e o uso com teclado são verificados face às WCAG enquanto os ecrãs são desenhados, não depois de construídos.
Também constroem o sistema de design em código?
Sim, quando desenvolvemos o produto: os mesmos componentes e tokens existem no ficheiro de design e no código, com os mesmos nomes.
Desenham sites além de apps?
Sim. Apps web, apps móveis e sites, com o mesmo processo: da investigação aos ecrãs e ao sistema que está por trás.