set
3
2021
por Isabela Sanchez & Cristiane Stefanini
0 comentários

O papel da cocriação na transformação digital

O papel da cocriação na transformação digital
por Isabela Sanchez & Cristiane Stefanini
0 comentários

O papel da cocriação na transformação digital é fundamental para que fatores externos impactem diretamente no entendimento das necessidades de um consumidor cada vez mais exigente.

Os desejos deste consumidor na atualidade são cada vez mais específicos e personalizados e entender essa demanda e utilizar a tecnologia a favor da melhoria da experiência do usuário faz parte de um processo que conhecemos como transformação digital.

E uma das principais estratégias para o sucesso dessa metodologia é entender o papel da cocriação dentro deste processo.

Com o apoio de agentes que não façam parte primordialmente da linha de produção, como fornecedores ou mesmo os clientes, é possível investir numa estratégia colaborativa de criação, trazendo melhores resultados e atendendo às demandas do mercado com maior assertividade.

Afinal, qual o papel da cocriação na transformação digital?

Durante um processo de criação, os colaboradores de uma organização precisam, em primeiro lugar, compreender o que o consumidor realmente procura. E não o que eles acham que o consumidor busca.

A cocriação na transformação digital é uma metodologia em que clientes, fornecedores e até mesmo concorrentes têm participação ativa na elaboração de soluções baratas e disruptivas, ajudando na criação desses processos internos da empresa.

É preciso considerar quatro pilares de fundamental importância para que a cocriação na transformação digital funcione:

  • Transparência nas ações;
  • Compreensão dos benefícios e dos riscos;
  • Acesso a recursos e informações (por todas as partes envolvidas);
  • Diálogo entre as partes para alcançar os objetivos.

Benefícios da estratégia

Dentre os benefícios que a estratégia de cocriação na transformação digital proporciona, pode-se destacar a satisfação plena do cliente com a sua marca, o que é praticamente fundamental para organizações que desejam e buscam pelo sucesso.

É evidente que uma boa experiência do usuário passa, diretamente, pelo investimento em inovação. A cocriação na transformação digital significa inovar. Essa estratégia aproxima o cliente da marca, fornecendo um resultado mais próximo àquele desejado.

Sem dúvidas, um diferencial competitivo, destacando positivamente sua empresa no mercado com relação à concorrência.

Como aplicar a cocriação na transformação digital

O passo a passopassa, diretamente, por definir um objetivo, com processos internos eficientes, e eleger a equipe que irá colaborar com a estratégia. Pesquisas, reuniões e testes fazem parte do processo.

Por fim, é hora de colocar as mãos na massa e executar a estratégia, garantindo entregas mais próximas da realidade dos clientes: experiência do usuário é, acima de tudo, entregar o que o consumidor deseja.

Além disso, estar sempre atento às mudanças que ocorrem no mercado, a empresa precisa ser flexível e estar pronta para o que o mercado exige. O foco deve ser sempre voltado para aquilo que é realmente importante para o cliente.

Ter em mente que inovar de forma colaborativa sempre permitirá a adoção ágil de soluções e garantirá o desenvolvimento do negócio de forma sustentável.

Quer saber mais? Entre em contato com nossa equipe! Vamos adorar ajudar você! 

Compartilhe
ago
13
2021
por Isabela Sanchez & Cristiane Stefanini
0 comentários

Planejamento Estratégico Ágil de Tecnologia

Planejamento Estratégico Ágil de Tecnologia
por Isabela Sanchez & Cristiane Stefanini
0 comentários

O Planejamento Estratégico Ágil de Tecnologia possibilita o levantamento das características tecnológicas de uma empresa e a identificação de pontos de melhorias essenciais aliado aos interesses do negócio de forma estruturada, priorizando entregas mais ágeis através de métodos inteligentes e eficientes, gerando impactos positivos em sua finalização, focado no sucesso e crescimento da empresa.

O que é o planejamento estratégico ágil?

Em um mercado extremamente competitivo, é preciso planejar cada vez melhor, de forma rápida e eficaz, e o planejamento estratégico ágil tem sido uma das ferramentas utilizadas pelas empresas para garantir o sucesso de toda a operação empresarial e proteger negócios em meio a crises e instabilidades para atuar de maneira prática e assertiva, centrada nos seus objetivos e meta de curto e longo prazo.

Nesse planejamento são avaliadas as condições internas e externas da organização e suas evoluções esperadas, auxiliando na tomada de decisão, identificação de oportunidades e redução da distância entre a condição atual da empresa e onde ela deseja chegar em determinado espaço de tempo.

A importância do planejamento estratégico ágil

Um planejamento estratégico ágil de tecnologia precisa estar próximo de todos os departamentos da corporação, atento ao perfil dos clientes, conhecer as tendências do mercado e ser consciente das ameaças da concorrência. Precisa promover processos mais eficientes, comunicação mais transparente e fluida, simplificar rotinas, automatizar tarefas e garantir o desenvolvimento de serviços inovadores e integrados. Envolve uma mudança no modelo de trabalho e até mesmo na cultura da empresa.

Trabalhando através da metodologia ágil, a empresa tem mais facilidade para atender às demandas do mercado, reduzir incertezas com ciclos de desenvolvimentos curtos e entregas bem definidas com foco na melhoria contínua dos processos e alinhamento da equipe, tornando muito mais simples identificar erros e falhas durante sua execução, onde os profissionais envolvidos ganham mais flexibilidade e facilidade para fazer adaptações, evitando que problemas afetem o resultado final com o objetivo de aprofundar o relacionamento com parceiros e incrementar as vendas.

Vantagens competitivas

Esse poderoso instrumento de gestão traz importantes vantagens competitivas atuando através de indicadores para acompanhar resultados com visões de longo prazo e também realizando cruzamentos com os objetivos, resultados e iniciativas de curto prazo, transformando as previsões em parâmetros mensuráveis de eficiência:

  • Facilita a realização dos objetivos de negócio de forma mais transparente e eficaz.
  • Otimiza a alocação de recursos através de adaptabilidade e flexibilidade.
  • Explicita riscos e propõe meios para mitigá-los no curto prazo, reduzindo custos, falhas e retrabalhos.
  • Simplifica fluxos e amplia a transparência da comunicação através da interação de toda a equipe.
  • Direciona recursos da organização para uma gestão mais efetiva por meio de entregas mais assertivas.
  • Auxilia o negócio a acomodar novas prioridades e exigências do mercado, tornando o trabalho mais eficiente.
  • Aumento da segurança com processos e responsáveis bem definidos, melhorando a credibilidade e confiabilidade da organização.
  • Aumenta a produtividade da equipe e a priorização de projetos através do maior alinhamento entre o time.
  • Contribui para a tomada de decisões mais assertivas, baseadas em informações atualizadas e confiáveis, mediante cenários bem avaliados e detalhados.
  • Traz mais vantagem competitiva ao negócio e maior rentabilidade baseado na eficácia e rapidez na obtenção de resultados.

As fases do planejamento estratégico ágil

Coleta de dados

  • Avaliação com todas as áreas de negócios da empresa.
  • Entrevistas com a equipe envolvida e clientes.
  • Sessões de Design Thinking.
  • Planos de estratégia atuais e projetos em andamento.
  • Padrões de tecnologias utilizados na empresa.

Processamento de dados

  • Tendências de mercado de tecnologia x cenário real da empresa.
  • Consolidação de capacidades de negócios.
  • Definição de objetivos e resultado-chave (OKRs).
  • Projetos x Estratégia Fit para definir se o produto ou serviço oferecido pela empresa é compatível com as necessidades do mercado e dos clientes.

Planejamento estratégico

  • Catálogo de serviços e padrões de tecnologia.
  • Políticas e arquitetura de tecnologia.
  • Organização e Governança.
  • Cronogramas e roteiro de projetos.
  • Transição para o modelo futuro.

Os elementos-chave

Para o sucesso do planejamento estratégico ágil de tecnologia , a missão da empresa deve ser clara desde o início, destacando os pontos que pretende entregar para sustentar as mudanças e o negócio como um todo.

É realizado um diagnóstico empresarial com a análise do ambiente interno, suas dores e seus pontos fortes. Com as informações obtidas, deverão ser listadas as Prioridades, os Objetivos e Resultados Chave (OKRs), definindo planos táticos e operacional a curto, médio e longo prazos.

Dentro do planejamento estratégico ágil de tecnologia , o sucesso depende do envolvimento de todos com os papéis e responsabilidades de quem irá executar e gerir cada atividade. A clareza das metas e de seus indicadores é fundamental para mensurar o alcance dos níveis desejados, tudo dentro dos planos de alocação de recursos.

Ter um planejamento estratégico ágil permite a criação de um roadmap e uma visão de longo prazo com um cruzamento dos objetivos, resultados e iniciativas de curto prazo. Através dos objetivos sendo acompanhados e, inclusive, revistos em períodos menores, permite um comportamento ágil para se adequar às mudanças, muito mais do que apenas seguir um plano.

Ficou alguma dúvida? Entre em contato com nossa equipe! Estamos prontos para entregar a melhor solução para você e guiar seus projetos rumo ao sucesso!

Compartilhe
jul
16
2021
por Deayra Bandim & Isabela Sanchez
0 comentários

Descubra os Doze Princípios do Manifesto Ágil

Descubra os Doze Princípios do Manifesto Ágil
por Deayra Bandim & Isabela Sanchez
0 comentários

No texto anterior, abordamos o Manifesto Ágil, seus valores e as vantagens de trabalhar com Metodologias Ágeis. Agora, chegou a hora de falarmos sobre os Doze Princípios do Manifesto Ágil e entender ainda mais como funcionam os times ágeis.

O que são esses princípios?

Eles correspondem a um conjunto de fundamentos que representam um complemento dos valores e reforçam a importância da comunicação e da satisfação dos envolvidos. Além disso, também destacam a entrega contínua em um ritmo saudável e a funcionalidade do software ou produto.

Tudo isso, sempre priorizando pessoas e soluções em detrimento dos processos burocráticos do modelo tradicional de gestão de projetos.

Os Doze Princípios do Manifesto Ágil

1 – Geração de valor:

“Nossa maior prioridade é satisfazer o cliente, através da entrega adiantada e contínua de software de valor.”

2- Flexibilidade:

“Aceitar mudanças de requisitos, mesmo no fim do desenvolvimento. Processos ágeis se adequam a mudanças, para que o cliente possa tirar vantagens competitivas.”

3- Frequência:

“Entregar o software em funcionamento com frequência, seja na escala de semanas ou meses, dando preferência a períodos mais curtos.”

4- União:

“Tanto pessoas relacionadas a negócios como desenvolvedores devem trabalhar em conjunto, diariamente, durante todo o curso do projeto”.

5: Motivação:

“Construir projetos em torno de indivíduos motivados, dando a eles o ambiente e o suporte necessário e confiando neles para fazer o trabalho.”

6: Comunicação:

“O método mais eficiente e eficaz de transmitir informações para e entre uma equipe de desenvolvimento é por meio de conversa face a face”

7- Funcionalidade:

“Software funcionando é a medida primária de progresso.”

8- Sustentabilidade:

“Os processos ágeis promovem desenvolvimento sustentável. Os patrocinadores, desenvolvedores e usuários devem ser capazes de manter um ritmo constante indefinidamente.”

9- Revisão:

“Contínua atenção à excelência técnica e bom design, aumenta a agilidade.”

10- Simplicidade:

“A arte de maximizar a quantidade de trabalho que não precisou ser feito.”

11- Organização:

“As melhores arquiteturas, requisitos e designs emergem de times auto-organizáveis.”

12- Autoavaliação:

“Em intervalos regulares, o time reflete em como ficar mais efetivo, então, se ajustam e otimizam seu comportamento de acordo”

O começo de uma nova era

Podemos dizer que o Manifesto representou um grito de liberdade, dando fim a práticas e burocracias que travavam o processo de desenvolvimento. Depois de sua criação, no final do mesmo ano (2001), surgiu a Agile Alliance, a organização sem fins lucrativos responsável por compartilhar esse conhecimento em todo o mundo.

As Metodologias Ágeis vieram para ficar e por isso não devem ficar em segredo. Por meio de debates, discussões e estudos todos podem propor novas ideias que sigam esses princípios e promover inovação com geração de valor.

Ficou claro para você por que trabalhamos com essas Metodologias? O uso de frameworks como o Scrum, Kanban, Lean e muitos outros, ajudam a tornar o sucesso de nossos clientes e parceiros possível.

Se tiver alguma dúvida, pode enviar. Nós ajudamos você a entender melhor!

Manifesto para Desenvolvimento Ágil de Software (agilemanifesto.org)

Compartilhe
jul
2
2021
por Deayra Bandim & Isabela Sanchez
0 comentários

Conheça o Manifesto Ágil

Conheça o Manifesto Ágil
por Deayra Bandim & Isabela Sanchez
0 comentários

Você já ouviu falar em Metodologias Ágeis, certo? Mas você sabe de onde surgiu a ideia de criá-las e como tudo começou? Nesse texto, faremos uma introdução no assunto e vamos apresentar para você o Manifesto Ágil, responsável por tanta evolução na realização de projetos. 

O começo de tudo 

Em 2001, 17 profissionais se reuniram para redefinir o modelo existente de elaboração de projetos e falar sobre as Metodologias ágeis, na época conhecidas como “Métodos leves”. Mesmo com práticas e teorias diferentes, eles concordaram com alguns requisitos necessários e criaram o Manifesto Ágil, que possui 4 valores e 12 princípios. 

Inicialmente, essas metodologias ágeis foram criadas com base no desenvolvimento de softwares, mas cada vez mais elas vêm sendo aplicadas em outras áreas, como o RH, o marketing e muito mais! 

Os valores do Manifesto Ágil  

– Indivíduos e interações mais que processos e ferramentas. 

– Entrega funcional mais que documentação abrangente. 

– Colaboração com o cliente mais que negociação de contratos. 

– Responder a mudanças mais que seguir um plano. 

Como funciona o Manifesto Ágil na prática? 

Esses valores não significam que processos, documentação, negociação ou planos sejam ruins, apenas que o principal a ser valorizado é o indivíduo, as relações que o envolvem e a flexibilidade para aceitar mudanças. 

De acordo com isso, o cliente vem sempre em primeiro lugar, então se ele mudar de ideia no meio do caminho ou não gostar de algo que foi produzido… tudo bem! Basta realinhar as expectativas e seguir em frente, sempre com foco em entregas de qualidade! 

É exatamente por isso que os métodos ágeis são baseados em ciclos curtos e comunicação, garantindo o alinhamento constante da equipe durante todo o projeto para que o sucesso seja garantido! 

E quais as vantagens de usar os Métodos Ágeis? 

Independentemente do Método escolhido, a agilidade otimiza o trabalho e reduz desperdícios, dando a direção para que toda entrega seja de valor. Além disso, você pode notar vantagens como: 

– Aumento da independência e produtividade da equipe. 

– Melhora na comunicação de todos envolvidos e do relacionamento com o cliente. 

– Definição mais clara dos objetivos, aumentando a assertividade. 

– O foco em pessoas aumenta a satisfação do cliente. 

Deu para entender quais são os valores do Manifesto Ágil e por que vale a pena conhecer essas metodologias? Na semana que vem, falaremos sobre os princípios do Manifesto e vamos explicar sobre o assunto! 

Enquanto espera, aproveite para mandar tirar suas dúvidas. Vamos adorar ajudar você! 

(agilemanifesto.org)

Compartilhe
jun
25
2021
por Andriana A. de S. Leite e Isabela Sanchez
0 comentários

Jira, a melhor ferramenta para equipes na metodologia ágil.

Jira, a melhor ferramenta para equipes na metodologia ágil.
por Andriana A. de S. Leite e Isabela Sanchez
0 comentários

O Jira Software é um produto da Atlassian criado para que cada membro de sua equipe planeje, acompanhe e lance excelentes softwares. A ferramenta é vastamente utilizada para acompanhamento e gerenciamento de projetos, mas oferece muito mais vantagens competitivas e funcionalidades.

São mais de 65 mil empresas no mundo que já aproveitam os benefícios desse software, como equipes de serviços financeiros, varejo, software, alta tecnologia, automotivo, sem fins lucrativos, governo, ciências da vida e de outros tipos e setores a ficarem organizadas e eficientes. E algumas empresas que já fazem parte dessa lista são: VISA, Domino’s, Pfizer, Coca-Cola e muitas outras, incluindo é claro a Performa_IT.

Saiba mais sobre o que você pode fazer com o Jira.

Otimize o tempo trabalhado

Com o Jira é possível fazer controle de apontamento de horas trabalhadas, planejadas e faturadas através de aplicativos como tempo e tempo planning. Também é possível criar equipes e gerenciar as horas trabalhadas e ausências da equipe auxiliando times ágeis na auto-organização da equipe.

Demonstrar e organizar esses dados de forma ágil é fundamental para otimizar o uso tempo e demonstra onde acontecem os gargalos, facilitando sua resolução.

Organize a ordem de atendimento facilmente no Jira

O Jira também tem uma plataforma de service desk para controle de tickets de suporte.

Através desta ferramenta, o cliente pode abrir um ticket no portal e entrar na fila de suporte da equipe para atendimento. É possível criar filtros personalizados e boards para apresentação e acompanhamento da fila.

Gráfico de status no Jira, do concluído ao aguardando solicitante ou fechado.
Gráfico de status no Jira, do concluído ao aguardando solicitante ou fechado.

Tenha mais transparência em seus projetos

Falando em board, há uma área de “Painéis de controle” onde vários gadgets podem ser inseridos para que os números dos projetos possam ser visíveis para todos, proporcionando uma “Gestão à vista”.

Isso proporciona a transparência em que se baseia o Scrum!

Tenha mais praticidade no gerenciamento

No gerenciamento de projetos é possível criar projetos com o estilo Kanban ou Scrum para facilitar a rotina de trabalho e a visibilidade das entregas da equipe.

O Jira possui também diversos plugins, e um dos mais interessantes e uteis é o Power BI Connector for Jira. É possível criar filtros personalizados e visualizar em boards no BI.

Visualização do Jira no PowerBI
Visualização do Jira no PowerBI

O melhor do Jira para equipes ágeis

Muito mais do que oferecer painéis Scrum e Kanban prontos para uso, o Jira ainda oferece suporte a qualquer metodologia ágil para desenvolvimento de software.

  1. Gráficos burn-up/down.
  2. Relatório de Sprint.
  3. Backlogs do projeto.
  4. Relatórios.
  5. Fluxos de trabalho personalizáveis.
  6. E muito mais.

Na Performa_IT usamos o Jira como uma ferramenta que auxilia em nossa rotina e permite que toda equipe fique sempre em dia com as entregas, trabalhando de forma ágil e entregando resultados incríveis, que atendem as necessidades de nossos clientes e parceiros.

Quer saber mais sobre como usamos essa ferramenta versátil e de fácil manipulação que auxilia no dia a dia do desenvolvimento de software e do gerenciamento de projetos?

Entre em contato e tire suas dúvidas! Vamos adorar explicar para você

Jira | Software para acompanhamento de itens e projetos (atlassian.com)

Compartilhe
mai
14
2021
por Isabela Sanchez e Raphael Calais
0 comentários

Acessibilidade no Design de Interfaces Episódio 3: o texto

Acessibilidade no Design de Interfaces Episódio 3: o texto
por Isabela Sanchez e Raphael Calais
0 comentários

Quando se fala em acessibilidade no design de interfaces, o texto obviamente é essencial! Mais do que pensar no contraste das cores e nas formas utilizadas, o tipo e tamanho de fonte também devem fazer parte de sua lista para ficar atento.

Recapitulando…

Nos últimos 2 textos do blog falamos sobre como as formas e cores que compõem sua criação podem ajudar ou atrapalhar a visualização por pessoas diferentes, nos diversos tipos de dispositivos.

Se você ainda não conferiu ou não absorveu todo conteúdo, corre lá antes de dar início ao último episódio da nossa série sobre Acessibilidade no Design de Interfaces com o Episódio 3: o texto.

Um fato importante a destacar é que, de acordo com pesquisa feita pelo Movimento Web para Todos e pela plataforma BigDataCorp, apenas 0,74% do conteúdo dos sites brasileiros são acessíveis, um número extremamente baixo e que precisamos mudar urgentemente! Continue a leitura e vamos mudar essa realidade juntos.

E como é que o texto entra nessa história?

Seu conteúdo é o que o seu cliente quer ver mas, de que adianta investir na produção, se as pessoas têm dificuldade na leitura? Letras pequenas são difíceis de serem lidas por qualquer pessoa com visão reduzida, como idosos ou míopes, por exemplo. O tipo de fonte também pode atrapalhar a leitura, causando confusão ao leitor ou impedindo sua compreensão, principalmente para quem tem dislexia, por exemplo.

Boas práticas no uso do texto

Tabela de Snellen. Uma tabela que mostra as letras para fazer testes de visão.
Tabela de Snellen

Em primeiro lugar, lembre-se do que já falamos sobre cor e forma, tudo aquilo vai ser aplicado aqui também! Agora, confira nossas dicas e continue fazendo testes com diversas pessoas.

  1. Tamanho da fonte: segundo a W3C, a principal organização de padronização da World Wide Web, devemos trabalhar com fontes em 3 níveis, A, AA e AAA, mas o mínimo recomendado é o tamanho AA.
  2. Use a fonte OpenDyslexic: faça o download gratuito no site https://opendyslexic.org/ e crie uma versão amigável para quem tem dislexia.
  3. Não esqueça do contraste: os textos no nível AA devem ter no mínimo 4.5:1 de taxa de contraste de cor e os AAA 7:1. Isso significa que a cor dos textos AA devem ter no mínimo 4,5 x mais luminosidade que o fundo e os textos AAA devem ser 7x mais luminosos.
    Importante: este cálculo é feito incluindo pessoas com visão moderada e que não precisam de assistente de contraste e também de pessoas que têm daltonismo. Pessoas que têm perda de visão acima de 20/80 (segundo a Tabela de Snellen) precisam de tecnologia assistiva para aumentar o contraste e ampliar o texto.
  4. Analise: o contraste vai variar de acordo com o tipo de família que estiver sendo usada, fontes Light ou Extra Light podem apresentar mais problemas.
  5. Destaque os links: pelo menos duas características gráficas que o diferenciem dos outros elementos.
  6. Foco no zoom: confira como seu site e os textos ficam com 200% de zoom.

Então, só devo pensar nas cores, formas e textos?

Não! Quando falamos de acessibilidade devemos pensar em todas pessoas e em responsividade do layout (fator indispensável em qualquer aplicação ou site).

  1. Função Alt Text: criar um texto alternativo nas imagens para adicionar sua descrição auxilia quem tem deficiência visual e utiliza ferramentas de leitura (de bônus, seu rankeamento no Google ainda aumenta).
  2. Audiodescrição: também ajudam a descrever as imagens.
  3. LIBRAS: disponibilizar uma tradução na Língua Brasileira de Sinais é importante e existem avatares capazes de fazer essa função nos sites, como por exemplo o VLibras, disponível em https://www.gov.br/governodigital/pt-br/vlibras/.
  4. Legenda: colocar a legenda nos vídeo auxiliam na compreensão do que é dito.

A acessibilidade não atrapalha o design!

Agora que você já viu várias dicas e está pronto para dar início às suas criações, tenha em mente que a acessibilidade não é inimiga da beleza (não vamos entrar nessa discussão, apenas tenha em mente que é possível seguir princípios estéticos e promover acessibilidade ao mesmo tempo).

Colocar estética acima da acessibilidade é uma maneira de criar barreiras sociais e excluir aqueles que têm deficiência, ao ponto que, interfaces minimalistas e acessíveis são estéticas e ainda abraçam a todos (além de ser uma tendência atual).

Ficou com alguma dúvida sobre acessibilidade no design de interfaces ou precisa de ajuda em seu projeto? Conte com a gente! Pensamos em tudo para facilitar sua criação!

https://performait.com/servicos/lean

Compartilhe
mai
7
2021
por Isabela Sanchez e Raphael Calais
0 comentários

Acessibilidade no Design de Interfaces – Episódio 2: as cores

Acessibilidade no Design de Interfaces – Episódio 2: as cores
por Isabela Sanchez e Raphael Calais
0 comentários

No segundo episódio da nossa série sobre Acessibilidade no Design de Interfaces, abordaremos as cores. Muito além da estética, elas desempenham um papel essencial no desenvolvimento de sites e aplicações e merecem nossa atenção.

Mas, o que é Acessibilidade no Design mesmo?

Antes de continuar com o assunto, vamos relembrar o que Acessibilidade significa e o porquê pensar nesse assunto é tão importante!

Quando vamos a um estabelecimento é comum vermos rampas ou elevadores que possibilitam o acesso de cadeirantes, certo? Isso é acessibilidade: desenvolver um projeto que inclui pessoas portadoras de deficiências ou com mobilidade reduzida.

No mundo digital o mesmo princípio é válido! Um site ou aplicação precisa ir além da estética para contemplar usuários com dislexia, idosos ou qualquer pessoa com dificuldade visual.

E onde as cores entram na Acessibilidade no Design de Interfaces?

Nem todos nós vemos as cores da mesma forma. Isso acontece por conta dos dispositivos que usamos e também devido a problemas como daltonismo, catarata ou baixa visão.

Vamos analisar o diagrama abaixo e pegar o daltonismo como exemplo.

Mapa de cores para daltônicos, aqui falamos da visão normal em comparação da Protanopia, deuteranopia, tritanopia.

Você consegue notar o quanto as cores “universais”, verde e vermelho, são difíceis de serem reconhecidas? Logo elas, que estão presentes em tantos formulários espalhados por aí!
Outro caso comum e que dificulta a leitura é o uso de um contraste baixo entre uma cor e outra, como por exemplo um fundo cinza com o texto em branco, que não só dificulta a leitura de quem tem baixa visão, como para quem usa monitores com pouco brilho e contraste ou está em um ambiente com iluminação intensa.

Boas práticas para cores mais acessíveis no design

Você não consegue olhar com os olhos de todos e pensar na escolha das cores parece uma tarefa impossível? Calma, resolver o problema das cores na acessibilidade é mais fácil do que parece, basta seguir alguns princípios básicos e testar seus designs em diferentes telas.

1- Não confie apenas na cor!
Sim, a cor é importante, mas não deve ser a única a guiar o usuário. Utilize também ícones, texto e texturas para tornar as informações mais claras.

2- O contraste é seu amigo!
Garanta sempre um bom contraste entre as cores e os outros elementos.

3- Às vezes, mais é mais!
Não tenha medo de usar mais brilho, mais saturação e mais matiz! Aumentar um pouco cada um deles pode ser a diferença na hora de proporcionar a experiência visual que você deseja para todos.

Como saber se estou no caminho certo?

Depois que escolher as cores desejadas, teste! Veja seu design em diferentes telas e peça para que outras pessoas dêem sua opinião (garanta que sejam de diferentes idades e que tenham dispositivos diferentes).

Além disso, conte com ferramentas gratuitas que mostram se suas cores e fontes estão legais! Confira alguns exemplos:

  1. Colour Contrast Analyser
  2. Contrast Ratio3
  3. Color Safe4
  4. Contrast Checker5
  5. CoblindorIamcal Color Vision

Você está quase lá!

Agora que você já refletiu a respeito das formas e das cores e estudou como usá-los a favor de todos, você está a um passo de criar um design que vai além da estética e da responsividade! No próximo episódio vamos finalizar falando sobre o texto e a tarefa de levar a acessibilidade às suas criações ficará ainda mais fácil!

Ah! Se você ficou com dúvidas, pode falar que nós ajudamos!

https://performait.com/#sobre

Compartilhe
abr
30
2021
por Raphael Calais e Isabela Sanchez
0 comentários

Acessibilidade no Design de Interfaces – Episódio 1: As Formas

Acessibilidade no Design de Interfaces – Episódio 1: As Formas
por Raphael Calais e Isabela Sanchez
0 comentários

A Acessibilidade no Design de interfaces é um assunto bem amplo e, para facilitar o entendimento, resolvemos dividir o assunto por elementos: as formas, as cores e os textos.

Esse é o primeiro episódio, dedicado as formas e elementos que, dependendo de suas proporções, podem causar frustração e mal uso da plataforma por usuários com deficiências visuais ou mecânicas e até mesmo pessoas sem deficiências, mas com aparelhos eletrônicos limitados. 

O conceito das formas

As formas no Design de Interface definem como as informações no site ou aplicativo serão demonstradas, por exemplo: na imagem abaixo conseguimos identificar claramente onde está o botão simplesmente pela sua forma.

Não importa a língua que o site seja escrito, é possível identificar onde devemos clicar e sabemos que, ao fazer isso, seremos direcionados para algum lugar, assim como, conseguimos nos localizar pelos ícones e encontramos facilmente o campo de busca e nem precisamos entender japonês, o idioma do site no exemplo abaixo. 

Home do site rakuten que mostrar que mesmo estando escrita em japonês, sabemos onde clicar e o que fazer pelos ícones e botões. Ótimo exemplo de acessibilidade no design de interfaces.
Home do site rakuten.co.jp em abril de 2021.

Ainda no mesmo exemplo, é possível distinguir as informações que aparecem imediatamente na home do site, pois a forma define os cartões de cada item, não deixando assim as informações dispersas na página.

O mal uso das formas: 

Como podemos ver, um simples retângulo possui uma enorme importância para o entendimento e funcionamento da plataforma, mas muitas vezes, a forma é mal usada, impossibilitando até mesmo uma pessoa sem deficiências visuais ou mecânicas de se conectar ou preencher as informações requeridas.  
 
Ao tentar buscar por um estilo que remete sofisticação e modernismo, os clientes acabam por optar por formas mais simples, esbeltas e delicadas, impossibilitando assim sua visualização e entendimento por parte dos usuários, tornando mais difícil entender as informações, que antes eram intuitivas.

Antiga home do site Evernote onde o botão está escondido pelo plano de fundo.
Antiga home do site Evernote. (evernote.com)

O botão call to action, o chamariz da capa, está escondido pelo plano de fundo, perdendo seu contraste e impossibilitando diversas pessoas de vê-lo ou associar a forma com um botão.  
 
Quando falamos de acessibilidade no design de interfaces, falamos inevitavelmente de um design mais robusto, maior, mais preenchido e claro. Falamos de botões com um bom tamanho e contraste, com sombreado para destacá-lo do plano achatado da tela e que não dependem somente do famoso “hover effect” para aparecerem. 
 
Aqui, precisamos que as formas conversem e sejam visíveis e entendíveis para todos e que não priorizem somente as telas em HD dos novos monitores.  

Algumas soluções para uma melhor acessibilidade no design de interfaces: 

Investir em Acessibilidade no Design de Interfaces e no estudo da dimensionalidade das formas, junto com a sua capacidade de responsividade na maioria das telas dos smartphones e dos desktops, não é uma questão de persona ou de um visual sofisticado e comprimido, é uma questão de empatia.  
 
Se levarmos em conta que ao menos 18,6% de toda a população brasileira possui uma deficiência visual (6,7% da população possui alguma deficiência física – IBGE), estamos falando de uma boa parcela de pessoas que podem estar tentando acessar o site, aplicativo ou sistema e se frustrando constantemente.  
 
Também não podemos ignorar as pessoas que estão acessando a plataforma por um celular menos tecnológico.  
 
Logo, o primeiro passo é aceitar e investir na acessibilidade do Design e o segundo , seguir algumas regras de acessibilidade nas formas como: 
       
⦁ Faça os botões visíveis e capriche no contraste; 
⦁ Deixe o botão bem localizado e tente copiar essa fórmula da sua localização para que o usuário não tenha que procurá-lo sempre. 
⦁ Crie os cards e campos visíveis. Não use cores claras para passar informação (caso o fundo seja branco) ou cores escuras (caso o fundo seja preto); 
⦁ Mantenha as formas bem marcadas e, caso não haja um bom contraste, acrescente contornos nela ou no hover effect da forma.  
⦁ Respeite a lei do “font size = 16px;” 
⦁ Não crie botões menores do que 48px de altura, evite que os campos de clique e interação estejam escondidos. Pense, se você está tentando escondê-los, seria melhor nem os mostrar, certo?  

Por fim, teste seu produto com a maior quantidade de pessoas possível para que cada uma, com sua particularidade, consiga ter acesso total à sua plataforma. 

Compartilhe
abr
8
2021
por Isabela Sanchez e Raphael Calais
0 comentários

O que é Matriz CSD e como utilizá-la em seus projetos.

O que é Matriz CSD e como utilizá-la em seus projetos.
por Isabela Sanchez e Raphael Calais
0 comentários

A Matriz CSD é uma ferramenta que, à primeira vista, pode parecer muito simples ou até mesmo ineficiente, mas esconde o poder de transformar seus projetos e otimizar sua entrega.  

O que é a Matriz CSD? 

Todo início de projeto vem acompanhado de dúvidas, certo? Às vezes o briefing não está tão completo quanto é o esperado ou existam divergências entre o que deve ser priorizado, entre outras questões que atrasam o início do desenvolvimento. 

Com a CSD, você exemplifica essas Certezas, Suposições e Dúvidas de uma forma prática e visual, facilitando assim o pontapé inicial. 

Como utilizar? 

A ferramenta, que pode ser usada em trabalhos individuais ou em grupo, consiste em criar três colunas em um papel, lousa ou parede, com post its de diferentes cores, fazendo anotações de qualquer aspecto do projeto para criar um retrato visual com tudo o que a equipe precisa saber. Ferramentas como o Trello, Mural ou Microsoft Planner também podem ser utilizadas. 

Certezas 

Nesse campo você irá preencher o que você realmente sabe sobre o projeto. Contudo, tome cuidado com verdades absolutas ou pré-conceitos sem fundamento e, caso você seja o facilitador, instigue os participantes a analisarem entre o que sabem e o que acham que sabem. 

Suposições 

É aqui que entram as hipóteses formuladas e o que achamos que sabemos. Se alguma informação ia ser colocada em certezas, mas não houve confirmação, mude para esse campo e considere-a como uma suposição. 

Dúvidas 

O que você gostaria de perguntar ao cliente? Quais dúvidas ficaram sem resposta durante suas reuniões? Até que essas perguntas não tenham respostas, pois é aqui que você vai colocá-las. 

É normal que no início do projeto esse campo tenha mais anotações. Entretanto, com o tempo e as descobertas (como em entrevistas e observações), as dúvidas passam para o campo de Certezas ou são excluídas. 

Quadro branco com post-its colados por setores: certezas, suposições e dúvidas

Exemplo de Matriz CSD:

Vamos supor que o cliente que vamos desenvolver uma solução é uma empresa que está crescendo no mercado dos fast-foods (vamos chamar a empresa de Burgão). O que sabemos, deduzimos ou precisamos saber sobre cliente?

CERTEZAS 

1- O Burgão vende lanches, porções e bebidas a mais de vinte anos. 

2- Existem lojas por todo o Brasil. 

3- Vendem lanches para todos os públicos, contando vegetarianos, intolerantes à laticínios e glúten e outros.   

SUPOSIÇÕES 

1- Foi o marketing que transformou a jornada do cliente. 

2- Cidades que possuem lojas apenas em shoppings estão sofrendo com a pandemia. 

3- Lojas com drive-thru aumentaram suas vendas nos períodos de quarentena. 

4- O público-alvo maior são jovens e jovens adultos. 

DÚVIDAS 

1- Utilizar um app já pré-existente para realizar nossas vendas por delivery? (iFood, Rappi, UberEats, outros…) 

2- Desenvolver um app exclusivo trará mais clientes? 

3- Os sistemas atuais das lojas comportam a quantidade de pedidos que têm recebido? 

Com esses exemplos conseguimos ter uma base de como funciona a Matriz no início. Após discussões entre a equipe e pesquisas, algumas afirmações ou dúvidas podem passar a outra categoria, por exemplo a suposição nº 3, na qual com uma busca na internet chegamos a conclusão que se trata de uma certeza. 

Nesse ponto, é muito importante salientar que a Matriz CSD é mutável! Conforme as pesquisas são feitas, o projeto é desenvolvido e o cliente responde as dúvidas, as afirmações mudam de categoria, são excluídas ou podem ser adicionadas. 

Por que usar Matriz CSD? 

A Matriz CSD é uma forma visual de organizar tudo o que se tem sobre o projeto, todavia é fundamental para dar o pontapé inicial em projetos, ampliando os horizontes da equipe e permitindo uma gestão mais eficiente com a centralização das informações. 

A imersão em cada aspecto analisado proporciona maior segurança ao time e otimiza o desenvolvimento, esclarecendo tudo o que é necessário para que as tarefas evoluam. 

Ainda está com dúvidas? Entre em contato com nossa equipe! Estamos prontos para entregar a melhor solução para você e guiar seus projetos rumo ao sucesso!

Compartilhe
mar
12
2021
por Isabela Sanchez e Raphael Calais
0 comentários

Hierarquia Visual e a Sua Importância em Aplicações

Hierarquia Visual e a Sua Importância em Aplicações
por Isabela Sanchez e Raphael Calais
0 comentários

Uma página ou aplicativo vai além das funcionalidades criadas. Ao pensar em desenvolvimento, devemos também pensar a respeito do layout utilizado, de forma que seja possível atrair o olhar dos usuários para o lugar que se deseja no momento certo, estimulando-os a agir conforme o esperado.

Hierarquia visual

A Hierarquia visual é o princípio de organizar os elementos para mostrar sua ordem de importância, distribuindo-os de forma lógica e estratégica para influenciar as percepções dos usuários e os orientar para as ações desejadas.

De modo geral, é a hierarquia visual que determina quais elementos receberão atenção do usuário, atraindo seus olhos diretamente para o foco desejado no momento correto.

Isso pode acontecer para incentivar inscrições em newsletters, promover algum conteúdo específico, destacar um produto novo ou até mesmo guiar uma sequência de ações em uma aplicação ou cliques em call to actions (CTAs).

Outro fator relevante é a experiência do usuário. Na construção de um layout responsivo, deve sempre ser levada em conta uma visita agradável e intuitiva, fazendo com que o usuário realmente goste de fazer o que é pedido.

“A hierarquia visual controla a entrega da experiência. Se você tiver dificuldade em descobrir onde olhar em uma página, é mais do que provável que seu layout não tenha uma hierarquia visual clara.” – Grupo Nielsen Norman.

Objetivos da hierarquia visual

Na prática, o cuidado com o design e o estudo da hierarquia visual tem 3 funções básicas que devem ser levadas em conta:

Orientação:

Construir um layout pensando em conduzir o usuário de ação em ação, sem que ele se sinta pressionado ou forçado a navegar.

Comunicação:

criar links na mente do usuário com o intuito de diminuir a carga cognitiva que ele recebe, diminuindo o seu esforço para achar informações e o caminho que deve trilhar.

Impacto emocional:

sua aplicação deve conter elementos que envolvam o usuário de forma que ele se conecte com o conteúdo e as ações, tornando sua experiência divertida e mais leve.

Os princípios da hierarquia visual

Para auxiliá-lo em seu design, existem algumas regras de ouro nas quais você deve ficar atento:

  1. Tamanho e escala: elementos maiores são mais importantes.
  2. Cor e contraste: cores vivas se destacam mais do que cores escuras.
  3. Tipografia: o tamanho e o tipo de fonte proporcionam diferenciações e destaques.
  4. Proximidade: separa os elementos uns dos outros e cria sub-hierarquias.
  5. Espaço em branco: torna mais fácil a visualização.
  6. Alinhamento: cria ordem entre os elementos.
  7. Repetição: atribui significado em relação aos elementos.
  8. Linha principais: guiam o olhar.
  9. Regra dos terços: imagine a tela dividida em 9 quadrados (como um jogo da velha) e descentralize o objeto, colocando-o na intersecção das linhas.

Estude cada um dos princípios e entenda que você não precisa (e às vezes não deve) utilizar todos eles ao mesmo tempo, mas sim, analisar o design de acordo com suas necessidades, aplicando o que cabe em cada caso.

Ao lado direito, post it mostrando uma má hierarquia visual, onde o texto do site não possui distinção de tamanho, fonte ou espaçamento. Já na imagem ao lado mostra uma boa hierarquia visual, seguindo um grid (regra dos terços) e diferenciando a fonte dos títulos para o restante do texto.

Para facilitar a compreensão e o seu trabalho, vamos abordar mais profundamente 3 dos aspectos mais importantes para que você dê o start que seus projetos precisam.

Hierarquia tipográfica

O texto está presente em grande parte das interfaces que se relacionam com o usuário e é por isso que ele desempenha um papel fundamental quando falamos de hierarquia.
Sabendo disso, talvez você pense “então é só colocar tudo grande e pronto, terminei o trabalho?” Bom, não funciona dessa forma. Para dar ênfase e importância precisamos trabalhar com várias características do texto além do tamanho. É uma mistura de tamanho, estilo, peso e cor que vão influenciar no resultado final.

Além disso, para definirmos isso da melhor maneira para o usuário, é preciso ter atenção nos diferentes tipos de elementos contidos em um texto, que vão desde o título, subtítulo, parágrafos, captions, citações, entre outros.


Crie uma ordem que faça sentido para o conteúdo, é aí que teremos os diferentes níveis de importância, fazendo o usuário compreender por onde ele começa a escanear os elementos.

Dessa forma garantimos a eficácia da transmissão da mensagem e isso reflete diretamente na experiência e relação do usuário com o produto.

Hierarquia com cores

A cor contribui bastante para a hierarquia como um todo. As cores possuem sua própria hierarquia, isso quer dizer que um preto ou um azul escuro chamarão menos atenção se comparados com tons claros, tal como amarelo e tons pastéis. Cada cor tem um peso diferente na interface e é o seu bom uso que irá garantir a hierarquia ideal.

Hierarquia com tamanhos

Ao trabalhar em uma interface com tamanhos, temos a necessidade de ter um cuidado para não exagerar ou achar que o fato de um elemento estar grande é o suficiente para uma boa hierarquia. É necessário haver harmonia na composição para que os elementos não sejam desproporcionais.


Tenha em mente que, embora o grande seja mais perceptível, isso nem sempre é o melhor. O título, por exemplo, não é mais importante que o texto, mas ele ser visto primeiro norteia o entendimento sobre o assunto abordado. Vale destacar que elementos maiores favorecem o clique e merecem cuidado dobrado, sobretudo em dispositivos mobile no quais as telas são menores e precisamos usar os dedos para completar as ações.

Essa hierarquia pode influenciar, nas formas, objetos e tipografias. Veja na Netflix, por exemplo, o tamanho define a relevância dos filmes, dando ênfase aos filmes originais do streaming.

Outro princípio importante relacionado a esse conceito é a escala, relacionada ao tamanho de um objeto em relação a outro. Um único objeto, não importa o quão grande ou pequeno seja, não tem escala até ser comparado a outro. Isso nos permite criar equilíbrio em um design e foco nos elementos dominantes. Quanto maior a escala de diferença, maior a ênfase.

Execução e testes

Destacamos 3 elementos que são os principais e mais recorrentes em interfaces, prestar atenção neles nos auxilia a ter uma boa hierarquia, mas é necessário que você leve em conta todos os aspectos na construção de seu site ou aplicativo.


Ao desenvolver soluções, faça testes A/B e use ferramentas que auxiliam na análise do comportamento, como o Hotjar, que representa visualmente como os usuários interagem com seu site. Não tenha medo de falhar e entenda como funciona a mente de seus clientes, cada situação é única e demanda estratégias personalizadas.

Definir uma hierarquia ideal auxilia no bom posicionamento da sua marca e de seu negócio. Vale lembrar que tudo em uma interface é importante e essa organização apenas fornece a importância que você precisa, no momento correto.

Não sabe por onde começar? Entre em contato com nossa equipe! Estamos prontos para entregar a melhor solução para você!

Saiba mais sobre nossa Torre de Lean
@performaitsolutions

Compartilhe