70
Design e Visualização de Dados para QlikView AVISO LEGAL: O conteúdo desta apresentação bem como as imagens nela contidas não podem, em nenhuma hipótese, ser utilizado ou divulgado sem prévia autorização.

Qmeeting SP - Design para Business Intelligence

Embed Size (px)

DESCRIPTION

Design para Business Intelligence

Citation preview

Page 1: Qmeeting SP - Design para Business Intelligence

Design e Visualização

de Dados para QlikView

AVISO LEGAL:

O conteúdo desta apresentação bem como as imagens nela contidas não podem, em nenhuma hipótese, ser

utilizado ou divulgado sem prévia autorização.

Page 2: Qmeeting SP - Design para Business Intelligence

Introdução

As imagens abaixo são de capturas de tela de "splash" de alguns softwares hoje em dia:

Isso te surpreende?

Page 3: Qmeeting SP - Design para Business Intelligence

Introdução

As imagens abaixo são de capturas de tela de "splash" de alguns softwares hoje em dia:

Isso te surpreende?

Page 4: Qmeeting SP - Design para Business Intelligence

Introdução

As imagens abaixo são de capturas de tela de "splash" de alguns softwares hoje em dia:

Isso te surpreende?

Page 5: Qmeeting SP - Design para Business Intelligence

Introdução

As imagens abaixo são de capturas de tela de "splash" de alguns softwares hoje em dia:

Isso te surpreende!!!

Page 6: Qmeeting SP - Design para Business Intelligence

Design para QlikView:

Erros mais comuns

Page 7: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CONTRASTESe tudo o que é exibido na tela é primordialmente importante e tratado

visualmente da mesma maneira, nada será destacado.

Ajude o usuário a focar seus olhos naquilo que é mais importante em uma

aplicação QlikView: os dados

Defina manchas de contraste…

1

Page 8: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CONTRASTEDefina manchas de contraste…1

Header

Filtros 1

Filtros 2

Dados

Page 9: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CONTRASTEPor onde começar?1

Page 10: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CONTRASTEUm ajuste simples e o usuário já sabe para onde olhar:1

Page 11: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CORCores devem ser utilizadas para “etiquetar” e não para deixar os objetos “bonitos”.

Defina categorias de informação:

Filtros e Informações de contexto(grid, eixos, labels, etc.) devem ter cores neutras (usualmente cinza);

Botõesdevem possuir cor distinta dos demais objetos;

Dadosdevem ter cores mais vibrantes ou com maior contraste;

2

Page 12: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CORCom relação ao uso de cores, o que pode ser melhorado?2

Page 13: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

CORCom relação ao uso de cores, o que pode ser melhorado?2

Page 14: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

DECORAÇÕES INÚTEISUma ferramenta analítica não é um site institucional e não tem como principal

objetivo demonstrar o quão atraente é a sua identidade visual.

Não se preocupe em deixar

a Aplicação com a cara do

site do cliente!

3

Page 15: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

DECORAÇÕES INÚTEISQuais objetos ou efeitos visuais podem ser eliminados?3

Page 16: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

DECORAÇÕES INÚTEISQuais objetos ou efeitos visuais podem ser eliminados?3

Page 17: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

VARIEDADE DE OBJETOSPizza, Bloco, Mekko, Radar, Linha, Barras...

Evite usar todo o tipo de gráfico no QlikView apenas para deixar a aplicação “bonita”.

Se a mensagem é a mesma, use o

mesmo tipo de gráfico ou objeto.

4

Page 18: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

VARIEDADE DE OBJETOSPizza, Bloco, Mekko, Radar, Linha, Barras...

Evite usar todo o tipo de gráfico no QlikView apenas para deixar a aplicação “bonita”.

4

Page 19: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

INTERFACEQuando uma interface de análise não é atraente, o usuário é colocado em um

estado de espírito que não é propício para seu uso efetivo.

Inconscientemente ele gera uma barreira ao uso da ferramenta.

Não assuste os usuários com

interfaces pouco atraentes.

5

Page 20: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

INTERFACE5

Page 21: Qmeeting SP - Design para Business Intelligence

Design para QlikView: Erros mais comuns

INTERFACE5

Page 22: Qmeeting SP - Design para Business Intelligence

Design pra quem?

Defina o público

Page 23: Qmeeting SP - Design para Business Intelligence

Defina o Público

Antes de iniciar o projeto de desenvolvimento de uma aplicação QlikView, é

fundamental entender o que e para quem estamos desenvolvendo.

Normalmente, da parte do cliente, há

inúmeras pessoas envolvidas:

• equipe de TI

• equipe de negócios

• diretores e gestores

• responsável pelo projeto

Page 24: Qmeeting SP - Design para Business Intelligence

Defina o Público

Para ajudar a identificar estas questões, é

recomendável fazer um briefing com o cliente.

Para qual destes públicos

estamos desenvolvendo mesmo?

Page 25: Qmeeting SP - Design para Business Intelligence

Defina o Público

Possíveis perguntas para elaboração do briefing:

Qual é o perfil do público?(cargo, faixa etária, familiaridade com softwares de gestão, etc)

Como o público lê as informações atualmente?(se utilizam outro softwares, planilhas, etc.)

O público tem familiaridade com o QlikView?

Qual a resolução de tela mais utilizada?

Quais os dispositivos a serem considerados?(smartphones, tablets, etc.)

Existe identidade visual da marca do cliente?

Quais as principais perguntas que os usuários farão?(pelo menos de 3 a 4 perguntas por aba)

Page 26: Qmeeting SP - Design para Business Intelligence

Defina o Público

Importante:Diferentemente do levantamento de métricas e KPI's (geralmente

descritas no anteprojeto) que é um documento técnico, o briefing

tem um caráter informal e visa qualificar as informações

levantadas no anteprojeto.

Page 27: Qmeeting SP - Design para Business Intelligence

Data Art x Visualização de Dados

Page 28: Qmeeting SP - Design para Business Intelligence

Data Art x Visualização de Dados

Visualização de dados, Data art, Infografia...

São conceitos distintos mas com um objetivo em

comum: transmitir informação de forma visual

Page 29: Qmeeting SP - Design para Business Intelligence

Data Art x Visualização de Dados

Data Art / Infografia:

Tem como principal objetivo chamar a atenção para o gráfico

Page 30: Qmeeting SP - Design para Business Intelligence

Data Art x Visualização de Dados

Visualização de Dados:

Tem como principal objetivo passar a informação de forma

rápida

Page 31: Qmeeting SP - Design para Business Intelligence

Data Art x Visualização de Dados

A imagem abaixo foi retirada da edição de 25/11/2013 da revista Época.

Data Art ou Visualização de dados?

Page 32: Qmeeting SP - Design para Business Intelligence
Page 33: Qmeeting SP - Design para Business Intelligence

Data-Ink Ratio

Page 34: Qmeeting SP - Design para Business Intelligence

Data-Ink Ratio

Imagine um relatório impresso num papel A4...

Page 35: Qmeeting SP - Design para Business Intelligence

Data-Ink Ratio

Segundo Edward Tufte, um pouco de tinta gasto na folha é para imprimir

dados, e outro tanto de tinta não é de dados (cabeçalho, notas de rodapé, etc.)

Ele chamou esta proporção de "data-ink ratio"

Segundo este conceito, o total de tinta gasto numa folha

de relatório deveria ser igual total de tinta de dados.

Page 36: Qmeeting SP - Design para Business Intelligence

Data-Ink Ratio

Este princípio aplica-se perfeitamente ao desenho de painéis, o que

chamou-se de "Data-Pixel Ratio" (Stephen Few)

O gráfico abaixo tem baixo "data-ink ratio" (ou seja, "tinta" sobrando)

Page 37: Qmeeting SP - Design para Business Intelligence

Data-Ink Ratio

Os mesmos dados, mas agora com alto "data-ink ratio" (ou seja, quase não

há "tinta" sobrando - ou ainda, tudo o que é desnecessário no gráfico foi

eliminado)

Page 38: Qmeeting SP - Design para Business Intelligence

Data-Ink Ratio

x

Page 39: Qmeeting SP - Design para Business Intelligence

QlikView para Smartphones

Page 40: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

Small Devices Version?

Page 41: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

Qual device? Para qual tamanho de tela estamos desenvolvendo?

Page 42: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

Identifique o menor tamanho de tela dos celulares dos usuários.

Acesse, a partir do aparelho do usuário, o site http://screenresolution.org/

Page 43: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

Para descobrir a área útil de

tela a ser utilizada no QlikView:Descontar a barra de sistema do smartphone e a barra de topo do browser

80 px

Page 44: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

Para descobrir a área útil de

tela a ser utilizada no QlikView:Descontar a barra de sistema do smartphone e a barra de topo do browser

Área útil final do SAMSUNG Galaxy Note 2:

360 x 640 560 pixels

Page 45: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

No QlikView, as abas para smartphones devem ser

exibidas com a seguinte condicional:

=if(ClientPlatform() like '*mobile*',1,0)

Page 46: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

O tamanho de gráficos e fontes deve ser pelo menos o dobro do

tamanho da versão “Desktop”:

Page 47: Qmeeting SP - Design para Business Intelligence

QlikVew para Smartphones

Page 48: Qmeeting SP - Design para Business Intelligence
Page 49: Qmeeting SP - Design para Business Intelligence

SOBRE A CLUSTER

Nascemos para ajudar usuários de QlikView

a enxergar melhor seus dados de negócio.

A empresa oferece uma abordagem de design ao mundo do Business

Intelligence, atuando exclusivamente com a solução QlikView.

Page 50: Qmeeting SP - Design para Business Intelligence

SOBRE A CLUSTER

O que fazemos?

Page 51: Qmeeting SP - Design para Business Intelligence

Redesign de Aplicações

Page 52: Qmeeting SP - Design para Business Intelligence

REDESIGN (ANTES)

Page 53: Qmeeting SP - Design para Business Intelligence

REDESIGN (DEPOIS)

Page 54: Qmeeting SP - Design para Business Intelligence

REDESIGN (ANTES)

Page 55: Qmeeting SP - Design para Business Intelligence

REDESIGN (DEPOIS)

Page 56: Qmeeting SP - Design para Business Intelligence

Prototipação de novas aplicações

Page 57: Qmeeting SP - Design para Business Intelligence

PROTOTIPAÇÃODefinição das áreas de conteúdo, navegação…

Page 58: Qmeeting SP - Design para Business Intelligence

PROTOTIPAÇÃOEstudo da melhor visualização/gráfico para cada análise desejada…

Page 59: Qmeeting SP - Design para Business Intelligence

PROTOTIPAÇÃODistribuição dos gráficos na tela, aba por aba…

Page 60: Qmeeting SP - Design para Business Intelligence

PROTOTIPAÇÃOEntrega de wireframes e template QVT do design final

Page 61: Qmeeting SP - Design para Business Intelligence

Interfaces para Smartphones e Tablets

Page 62: Qmeeting SP - Design para Business Intelligence

INTERFACE MOBILEVersões desktop e mobile no mesmo QVW, com interfaces independentes

Page 63: Qmeeting SP - Design para Business Intelligence

Quality Assurance de Design e Visualização de Dados

Page 64: Qmeeting SP - Design para Business Intelligence

Q.A. de Design e Visualização de DadosDocumentação detalhada apontando melhorias em aplicações existentes

Page 65: Qmeeting SP - Design para Business Intelligence

Design de família de aplicações

Page 66: Qmeeting SP - Design para Business Intelligence

Design de família de aplicaçõesDefinição de modelo de layout a ser adotado em todas as aplicações da empresa

Page 67: Qmeeting SP - Design para Business Intelligence

Relatórios personalizados em PDF

Page 68: Qmeeting SP - Design para Business Intelligence

Design de relatórios em PDF

Page 69: Qmeeting SP - Design para Business Intelligence

NOSSOS CLIENTES

Já atuamos em clientes como:

• Grupo Brookfield (RJ)

• Grupo JBS (SP)

• Grupo Technos (RJ)

• Ministério do Planejamento (DF)

• Ministério Público RS / PR / SC

• Presidência da República (DF)

• Red Bull (SP)

• TCE-RS (RS)

• TCU (DF)

• Terra Networks (RS)

• TV Globo (RJ)

Page 70: Qmeeting SP - Design para Business Intelligence

CONTATO

Thiago Pessatotwitter: @[email protected]

(48) 8453-9882 / (48) 3206-5665