Criar nova proposta de visualização de algum dado do SALIC

lappis-unb / PromovaCultura

Plataforma Promova Cultura para divulgação do panorama cultural brasileiro

https://lappis-unb.github.io/PromovaCultura/

GNU General Public License v3.0

5 stars 0 forks source link

Criar nova proposta de visualização de algum dado do SALIC #155

Closed marcosronaldo closed 6 years ago

marcosronaldo commented 6 years ago

[x] Pensar em uma informação nova para ser visualizada, verificando o que já existe no banco/API;
[x] Prototipar alternativa de efeito visual;
[x] Testar biblioteca mais promissora;
[x] Implementar prova de conceito usando uma ou mais bibliotecas;
[x] Fazer ajustes na API para buscar dados reais, se necessário;
[x] Identificar filtros pertinentes, se aplicável;
[ ] Definir loader compatível com navegadores modernos para esperar carregamento de dados;

Critérios de aceitação

[x] Responsivo;
[x] Performance;
[x] A visualização precisa utilizar dados reais para mostrar de forma clara a proposta;
[x] A visualização precisa entregar valor para o MinC, não pode ser só "bonitinho".
[x] A equipe inteira deve estar consciente da proposta sendo implementada, ou seja, o que ela agrega de valor.
[x] O protótipo precisa estar apto a ser apresentado para o Lappis como produto e como processo de construção.

FranciscoSMM commented 6 years ago

Com a reunião de hoje 29/08, pesquisamos no banco algumas possibilidades de proposta de valor que poderiam ser uteis para mostrar. Ao observar que vários projetos possuíam a possibilidade de entregar acesso gratuito, como ingressos de graça entradas, volumes de livros etc. Vimos que isso poderia servir para incentivar mais a existência de tal benefício e deixá-lo mais visível seria algo pertinente.

FranciscoSMM commented 6 years ago

Ao procurar no Echarts, para manter a mesma biblioteca de javascript, encontramos algumas alternativas para começar a desenvolver em cima.

http://gallery.echartsjs.com/editor.html?c=xr1WrPou3b

https://ecomfe.github.io/echarts-examples/public/editor.html?c=scatter-single-axis

joaaogui commented 6 years ago

Segmentos com nome diferente no dicionário de área:

Formação/Pesquisa e informação
Formação/Pesquisa/informação
Produção de obras seriadas
Difusão
Produção televisiva
Preservação/Restauração da Memória Cinematográfica

OBS: nomes estão no formato das distribuições

FranciscoSMM commented 6 years ago

Começamos com duas possibilidades de mock up para as informações após termos verificados algumas porcentagens de taxa de gratuidade dos segmentos.

Essa primeira é a mais provavel devido a complexidade de execução.

Esse segundo mockup seria algo mais complicado, mas o mais desejável devido a mostra dos nomes das áreas serem independentes das cores, causando uma maior facilidade a pessoas condeficiência visual.

guilacerda commented 6 years ago

Existem segmentos com o mesmo nome que é um problema para definição dos links no echarts, pois ele faz a ligação com base nos nomes.

Nomes duplicados:

Construção de salas de teatro munic(< 100 mil hab)
Ações de capacitação e treinamento de pessoal
História
Multimídia

peterlima commented 6 years ago

Optamos por retirar as áreas culturais que não possuem projetos com distribuição gratuita. Motivo: a representação visual dessas áreas não era objetivo da issue.

AniaGomes commented 6 years ago

Para o resultado final, houveram algumas mudanças, maioria delas vinda das limitações da biblioteca. Primeiramente, houve a retirada dos círculos centrais, mas ainda deixando o título da área, isso se deu devido a falta de significado da existência do círculo que se não por sua estética. A legenda das áreas foi mantida, já que ela é necessária para poder desselecionar as indesejadas, mas foi colocada na parte superior do canvas, para que seja uma informação um pouco mais primaria. Além disso, uma legenda com uma pequena descrição e explanando o tamanho dos círculos em relação a porcentagem também foi criada. Por fim, a tooltip que mostra o valor exato das porcentagens e de qual segmento está selecionado, foi modificado para que ficasse com um visual parecido com a que existia no mapa.

joaaogui commented 6 years ago

Não se analisou a compatibilidade do loader por falta de tempo, foi utilizado o mesmo loader já utilizado no grafo de deslocamento. TODO

[ ] Definir loader compatível com navegadores modernos para esperar carregamento de dados;
[ ] Definir novas cores para o protótipos;
[ ] Mostrar na página que existem áreas que não possuem projetos gratuitos e consequentemente não são mostradas no gráfico.
[ ] Ajustar o estilo do texto dos cards para ficar mais parecido com o protótipo do mapa;
[ ] Trocar % de projetos gratuitos por % de acesso gratuito;
[ ] Testar utilização container fluido para utilizar melhor a área da página;