apeação

Plano Executivo
Mapeação: uma proposta de assistência social à população de
Quixadá a partir da conexão do Design e Arquitetura da Informação,
visando promover o desenvolvimento social do município.
 Equipe Agradecimentos Orientadores

Andrine Nascimento Agradecemos aos orientadores, José Neto de Faria

Jéssica Ávila colegas de curso, aos que Tânia Pinheiro
Kaique Jorge participaram das pesquisas e
Paulo Guilherme fotos do projeto. Agradecemos
Rute Cristina especialmente a Secretaria
Yonara Damasceno de Desenvolvimento Social
do município de Quixadá
por ser tão acessível para o
desenvolvimento do projeto.

Secretaria do
Desenvolvimento Social
 Sumário
Apresentação .................................................................................................................................................. 09
Problema .......................................................................................................................................................... 11
Objetivos .......................................................................................................................................................... 13
Público-alvo ..................................................................................................................................................... 15
Conceito de criação......................................................................................................................................... 17
Estratégia de Design ....................................................................................................................................... 18
Produto/serviço................................................................................................................................................ 19
Projeto................................................................................................................................................................ 20
Marca e Identidade Visual ............................................................................................................................. 21
Paleta de Cores/Harmonia Cromática......................................................................................................... 24
Elementos Visuais ........................................................................................................................................... 26
Tipografia ......................................................................................................................................................... 30
Projeto de Informação .................................................................................................................................... 32
Projeto de Navegação .................................................................................................................................... 36
Projeto de Interface ........................................................................................................................................ 40
Projeto de Interação ....................................................................................................................................... 47
Materiais e tecnologias................................................................................................................................... 48
Plano de divulgação ....................................................................................................................................... 50
 Apresentação
O sistema Mapeação, desenvolvido por alunos do 3º semestre do curso de Design Digital
da Universidade Federal do Ceará, utiliza a união do design à tecnologia para solucionar a falha no
sistema de assistência social do município de Quixadá através do levantamento e o gerenciamento de
dados da constituição das famílias, residências, infraestruturas das ruas e bairros, e estruturas gerais
do município, permitindo um melhor planejamento das ações de desenvolvimento humano e social.

9
 Problema
No município de Quixadá, o sistema de gerência dos dados da constituição das famílias
beneficiárias do Cadastro Único apresenta falhas. Os dados coletados para a realização do cadastro
são armazenados inicialmente em formulários físicos e depois repassados para um sistema digital,
o SIBEC (Sistema de Benefícios ao Cidadão). Entretanto, há uma falha técnica no SIBEC que impede
que sejam gerados relatórios atuais, mesmo quando os dados armazenados no sistema estão
devidamente atualizados. Assim, há a necessidade de tratamento manual sobre esses relatórios
para que se possa ter o mínimo de visualização informativa. Dessa forma, os relatórios gerados são
ineficientes para contribuir com o planejamento de ações sociais para o desenvolvimento do município.

11
 Objetivo
O Mapeação é um sistema gratuito de levantamento, gerenciamento e planejamento das
ações de desenvolvimento humano e social, baseado na integração de dados da constituição das
famílias e das estruturas gerais do município de Quixadá, que visa promover o desenvolvimento
social do município.

Objetivos específicos:

• Otimizar o tempo gasto na realização de tarefas;

• Tornar o trabalho dentro da Secretaria de Desenvolvimento Social (SDS) prático e eficaz;
• Disponibilizar a visualização de dados em mapa;
• Gerar relatórios eficientes;
• Dispor gráficos estatísticos;
• Prezar pela sustentabilidade ambiental com a realização de cadastros apenas por
formulários digitais.

13
 Público-alvo
O sistema destina-se aos beneficiários do Cadastro Único e funcionários da Secretaria de
Desenvolvimento Social (SDS) do município de Quixadá (gestores, assistentes sociais e entrevistadores).

A assistente social O gestor é responsável Os entrevistadores Os beneficiários

realiza visita às por coordenar as são responsáveis são pessoas de
casas dos benefici- atividades dos pela realização baixa renda que
ários para fazer um demais funcionários, e atualização de recebem benefícios
levantamento de avaliar as situações cadastros. Para de Programas Sociais
dados das condições de cadastro, resolver isso, coletam dados oferecidos através
de moradia e para problemas e irregu- dos candidatos aos do Cadastro Único
verificar a veracida- laridades, gerar benefícios através de e necessitam fazer
de das informações relatórios e planejar entrevistas. periódicas atuali-
prestadas por esses ações sociais. zações de cadastro
beneficiários na reali- para continuarem
zação do cadastro. sendo beneficiados.
15
 Conceito de Criação
O Mapeação é um sistema integrado de levantamento, gerenciamento e planejamento
das ações de desenvolvimento humano e social, baseado em dados da constituição das
famílias, residências, infraestruturas das ruas e bairros, e estruturas gerais do município de
Quixadá, que visa melhorar o levantamento de dados sobre a população e o atendimento aos
cidadãos, e, através da disponibilização da visualização de dados em mapa, funcionar como
ferramenta de planejamento de ações sociais, gerando o desenvolvimento social do município.

Estratégia de Design

17 18
Meu tempo Cliente Prefeitura Municipal / Secretaria de Desenvolvimento Social

Valores sócio-culturais: Valores estéticos: Objetivos e necessidades:

Acesso rápido à informação Acessibilidade
Inclusão social Otimização do trabalho
Livre comunicação
Assistência social Leiturabilidade das informações
Valores tecnológicos:
Gestão eficiente Segurança dos dados
Dados em nuvem
Melhorar a qualidade de vida das famílias Garantir renda
Conectividade
Garantir acesso a serviços públicos Confiabilidade
Mobile

Solução

Aplicação móvel Visualização de informações

Gerar relatórios detalhados Formulários digitais

Dados dispostos em mapa

Áreas de gestão e análise de desempenho
Disponível gratuitamente
Funcionamento online e offline
Área de acesso do beneficiário
Infográficos, gráficos e tabelas

Público-alvo Público-alvo
Gestor Valores sócio-culturais: Valores sócio-culturais:
Cidadão
Responsável pela gestão da SDS Maior grau de escolaridade Baixa renda
Renda média Pouco acesso a informações de
Coordena os funcionários, realiza Baixa escolaridade
desenvolvimento social do
desbloqueio de benefícios recebe Elevada taxa de desemprego
Valores estéticos: município
denúncias
Vocabulário assistivo Valores estéticos:
Organiza ações
Assistente social Vocabulário simplificado
Entrevistadores Valores tecnológicos:
Trabalha coletando dados
Responsáveis pelas entrevistas, Necessitam da tecnologia Valores tecnológicos:
para verificar a veracidade
atualizações de cadastros e para realizar suas tarefas Acesso a tecnologia limitado
das informações
cadastramentos. Acesso a dispositivos móveis Acesso a dispositivos móveis
 Produto/serviço
A partir da junção do design e arquitetura da informação, o sistema Mapeação melhora
o planejamento de ações sociais ao proporcionar uma visualização clara dos dados da
constituição das famílias e estruturas gerais do município de Quixadá, a partir da conexão,
organização e disponibilização desses dados em mapa, gráficos e relatórios. O sistema possui
quatro tipos de usuários: gestores, entrevistadores e assistentes sociais da Secretaria de
Desenvolvimento Social (SDS) e beneficiários do Cadastro Único. Articulando assim a integração
entre usuários do sistema, conferindo um maior suporte de assistência social aos beneficiários.

19
Projeto

20
 Marca/Identidade Visual
A representação simbólica do projeto é baseada em estudos da Semiótica de Peirce, a partir
da relação do signo com o objeto. A marca do sistema ‘Mapeação’ foi concebida a partir do uso de
elementos gráficos que representam pontos de conexão, que dão forma a um mapa, que, por sua vez,
forma a letra ‘M’, de ‘Mapeação’. Para a construção do mapa, utilizou-se linhas curvas objetivando
humanizar a figura de mapa e demonstrar irregularidades, característica do feito manual.
A utilização dos círculos indicando conexão representam a conexão de dados, e a conexão
existente entre as áreas de desenvolvimento social, saúde e educação, e entre os usuários do sistema.
O uso das Leis da Gestalt foi de suma importância para a elaboração da marca,
permitindo arquitetar uma leitura visual capaz de favorecer a articulação analítica
e interpretativa da forma da identidade visual, utilizando a segregação dos pontos
para destacar as unidades, proximidade e semelhança, para assegurar a coerência,
pregnância da forma e fechamento, com modo de harmonizar, e gerar um equilíbrio visual.

21
Mapeação
apeação
22
 149,344 mm
6.62 6.62

10,69 10,69

28,809 mm 6,865 mm

276,13 mm 19,636 mm

14,554 mm

32,384 mm

27,882 mm

20,874 mm

6,865 mm

25,037 mm
29,644 mm

29,673 mm
25,278 mm

12,639 mm

12,398 mm
6,865 mm

6,865 mm
17,261 mm
17,02 mm
23
 Paleta de Cores/Harmonia Cromática
A paleta de cores foi inspirada e concebida em uma breve escala de tons frios e quentes com
cores contrastantes, objetivando transmitir uma visualização dinamicamente clara ao olhar do leitor,
e incluindo os conceitos e valores presentes no serviço de assistência social. Partindo da correlação dos
funcionários e comunidade, as cores foram escolhidas e inseridas com intuito de transmitir sensações.

#64c2ef #54a5c6 #fab72d #dc9d2b #43b178 #3c875e

R: 93 C: 59% R: 84 C: 66% R: 250 C: 0% R: 211C: 13%
R: 220 R: 67 C: 71% R: 60 C: 77%
M: 4% M: 0%
G: 194 Y: 0% G: 165
M: 19%
Y: 15%
G: 183 M: 32%
Y: 87%
G: 157
G: 149M: 41%
Y: 90%
G: 177 Y: 66% G: 135
M: 25%
Y: 73%
B: 239 K: 0% B: 198 K: 1% B: 45 K: 0% B: 43B: 37K: 2% B: 120 K: 0% B: 94 K: 9%
Pantone 297C Pantone 7702 C Pantone 143C Pantone 7563C Pantone 7723C Pantone 7730C

Azul: cor utilizada na logomarca
com o intuito de promover
uma visualização mais sutil e
confortável.
Laranja: cor utilizada na
logomarca, busca destacar
a palavra ‘ação’ no nome da
marca, e, no projeto, representa
a produtividade.
Verde: presente no ícone que
indica a positividade em relação
ao desenvolvimento de uma
determinada área do município,
e, no projeto, é a cor que
representa o desenvolvimento
social.

24
 #f7e42f #cec145 #6968ad #515186 #e73b3d #c23034
R: 247 C: 7% R: 206 C: 24% R: 105 C: 68% R: 81 C: 79% R: 231 C: 0% R: 194 C: 17%
M: 3% M: 16% M: 61% M: 71% M: 87% M: 92%
G: 228 Y: 86% G: 193 Y: 82%
G: 104 Y: 0% G: 81 Y: 22%
G: 59 Y: 73% G: 48 Y: 78%
B: 47 K: 0% B: 69 K: 2% B: 173 K: 0% B: 134 K: 6% B: 61 K: 0% B: 52 K: 7%
Pantone 394C Pantone 7751C Pantone 2096C Pantone 7673C Pantone 179C Pantone 7620C

Amarelo: além de simbolizar Roxo: utilizada visando causar Vermelho: presente no ícone
a relevância da visualização e a boa leiturabilidade dos textos de alerta para chamar a
distribuição das informações na interface do sistema. atenção do gestor para as
sociais, é utilizada para zonas que necessitam de
representar uma área está em atenção urgente.
nível intermediário de cuidados
e que deve ser averiguada.

25
Elementos Visuais/Linguagem Gráfica

Padrões

26
Texturas

27
Formas

28
29
 Tipografia

No projeto foram utilizadas duas tipografias: uma para o sistema e outra para a
logomarca. Para o sistema, foi escolhida a tipografia Louis George Café, visando promover
a facilidade de leitura, devido a inexistência de serifa e a leveza do traço da fonte, para
que, durante o processo de cadastramento, tanto o entrevistador quando o beneficiá-
rio consiga ler e compreender, sem dificuldades, as informações dispostas no sistema.
Nos hiperlinks e títulos a fonte é usada no estilo Bold, e no corpo é usada no estilo Regular.
•
»» Regular
Nome da face de tipos: Louis George Café
Versão: Version 1.00 November 3, 2017, initial release
TrueType Contornos
_________________________________________________________
abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWYZ
1234567890.:,;’”(!?)+-*/=

30
 »» Bold
Nome da face de tipos: Louis George Café
Versão: Version 1.00 November 3, 2017, initial release
TrueType Contornos
____________________________________________________________
Projeto de
abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWYZ
1234567890.:,;’”(!?)+-*/=

Para a logomarca, foi selecionada a tipografia manuscri-

ta Rochester, objetivando tornar a identidade da marca mais humanizada, carac-
terizando o projeto ‘Mapeação’, que lida com o desenvolvimento humano e social.

»» Regular

Nome da face de tipos: Rochester

Versão: Version 1.005
TrueType Contornos
_________________________________________________________
abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWYZ
1234567890.:,;’”(!?)+-*/=

31 32
Informação

33
 Projeto de

36
Assistente Social Gestor
Entrevistador / Digitador Beneficiário
Navegação

37
 Projeto de

40
 Beneficiário

A escolha do background remete à

população de Quixadá. Quando logado, o usuário
que não possuir Cadastro Único poderá fazer sua
solicitação na sua área. Caso contrário, ele poderá
visualizar seus dados tendo a opção de edição. En-
tretanto, toda a população poderá visualizar dados
gerais sobre o desenvolvimento do município.

Funcionário Entrevistador

O background do Funcionário remete aos aparatos tecnológicos que ele utiliza

para realizar seu trabalho. A partir da tela inicial é possível cadastrar uma nova família ou
atualizar seus dados, visualizar a agenda de ações e a equipe de funcionários da secreta-
ria. Para visualizar os dados gerais do município é necessário realizar login como beneficiário.
 Tela da Assistente Social

O background do Assistente Social remete ao público-alvo para quem ele trabalha diaria-
mente. A partir da tela inicial é possível visualizar a agenda de ações e a equipe de funcionários da
secretaria. O mapa disponibilizado tem o intuito de mostrar áreas críticas para que seja possível
planejar ações em conjunto com o gestor.

Gestor

O background do Gestor é utilizado para

causar aproximação do sistema com seu ambiente de
trabalho. A interface é voltada para as atividades que
ele realiza diariamente, contendo funções a mais que a
dos outros usuários. Através dela é possível visualizar
e direcionar atividades dentro da Agenda de Ações, e
adicionar ou remover integrantes da equipe. Na parte
da População ele pode visualizar dados pessoais dos
beneficiários em forma de mapa ou planilha, acessar
dados das famílias pendentes, ocorrências, e realizar
acompanhamento operacional geral e financeiro.
 Agenda de Açoes

Dentro da Agenda de Ações, é possível ao gestor criar uma nova ação e direcioná-la para
um membro da equipe. Além disso, o gestor pode visualizar as atividades pendentes, concluídas e
sugeridas pelos funcionários da secretaria.

Equipe

Dentro do segmento equipe é possível adicionar um integrante, visualizar informações e o

rendimento pessoal de cada membro, autuar uma atividade direcionada (caso a realização desta
não tenha sido concluída ou realizada sem êxito), direcionar um membro à uma ação ou removê-lo
da equipe.
 População

Dentro da População é possível pesquisar cadastros familiares, bloqueados e

pendentes. Além de visualizar ocorrências no sistema ou atendimento. A utilização do mapa
e planilha em conjunto com o acompanhamento operacional geral e financeiro contribui
para a visualização de informações de forma prática e eficiente, e aproxima-se do real.
Interface

43
 Projeto de

45
 Materiais e Tecnologias
Interação Para a construção do projeto foram utilizados os programas: Adobe Illustrator, na
construção dos protótipos das telas do sistema e estratégia de design, Adobe Photoshop CC,
para a edição das fotografias utilizadas no projeto, Adobe InDesign, para a diagramação
da Proposta de Desenvolvimento Projetual e do Plano Executivo, e a plataforma online
Lucidchart para a construção dos diagramas de projeto de informação e projeto de navegação.

47 48
 Projeto de
O sistema constitui-se de um portal e uma aplicação para dispositivos móveis. O
sistema é construído a partir da utilização dos recursos de HTML5, CSS3. Além disso, o sistema
faz uso de uma API (Application Programming Interface) do Google Maps que permite
a inserção de dados, criação de mapas com locais definidos, geração de rotas e pesquisa.

49 50
 Para a divulgação do sistema Mapeação foi construído um panfleto para ser distribuído em grande
quantidade nos órgãos públicos do município de Quixadá, objetivando dar visibilidade de forma simples e direta,
trabalhando uma linguagem que visa causar identificação e aproximação da população com o projeto sistema.
Outra rede social será o Instagram , a qual foi elabora um post para o stories da rede.
 O projeto será divulgado também através da rede social Facebook, a qual grande parte do nosso público-alvo possui acesso. Essa
divulgação será feita a partir da publicação de banners em uma página criada exclusivamente para divulgação do sistema e para dispor
as demais informações sobre a Secretaria de Desenvolvimento Social (SDS). Para a identidade visual da página foi construído um banner.
Uma forma simples para trazer
o seu Desenvolvimento
51
Divulgação