PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e...

85
UNIVERSIDADE DO VALE DO ITAJAÍ CENTRO EDUCACIONAL SUPERIOR DE BALNEÁRIO CAMBORIÚ CURSO DE DESIGN GRÁFICO PROJETO CONSTRUTORA MATTIELLO BRUNO MATTIELLO BALNEÁRIO CAMBORIÚ – SC 2009 I

Transcript of PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e...

Page 1: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

UNIVERSIDADE DO VALE DO ITAJAÍ

CENTRO EDUCACIONAL SUPERIOR DE BALNEÁRIO CAMBORIÚ

CURSO DE DESIGN GRÁFICO

PROJETO CONSTRUTORA MATTIELLO

BRUNO MATTIELLO

BALNEÁRIO CAMBORIÚ – SC 2009 I

Page 2: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

BRUNO MATTIELLO

PROJETO CONSTRUTORA MATTIELLO

Trabalho de Graduação Interdisciplinar

apresentado ao Curso de Design da

Universidade do Vale do Itajaí para

obtenção do Título de BACHAREL em

DESIGN GRÁFICO, sob a orientação da

Prof.ª Lisandra Andrade

BALNEÁRIO CAMBORIÚ – SC 2009 I

Page 3: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

LISTA DE FIGURAS

Figura 1.1: Total de m² ................................................................................................................ 10

Figura 1.2: Número de obras ...................................................................................................... 11

Figura 1.3: PIB da construção civil ............................................................................................... 12

Figura 1.4: Marca ........................................................................................................................ 13

Figura 1.5: Cronograma............................................................................................................... 15

Figura 1.6: Metodologia de projeto ............................................................................................ 26

Figura 1.7: Rotesma..................................................................................................................... 32

Figura 1.8: Nostra Casa ............................................................................................................... 32

Figura 1.9: Santa Maria ............................................................................................................... 33

Figura 2.0: Catarinense ............................................................................................................... 33

Figura 2.1: Web site Rotesma – página inicial ............................................................................ 34

Figura 2.2: Web site Nostracasa – página inicial ........................................................................ 35

Figura 2.3: Web site Santa Maria – página inicial ....................................................................... 36

Figura 2.4: Web site Catarinense – página inicial ....................................................................... 37

Figura 2.5: Painel semântico do público alvo .............................................................................. 38

Figura 2.6: Painel semântico da expressão do produto .............................................................. 39

Figura 2.7: Alternativa 01 ............................................................................................................ 40

Figura 2.8: Alternativa 02 ............................................................................................................ 41

Figura 2.9: Alternativa 03 ............................................................................................................ 41

Figura 3.0: Alternativa 04 ............................................................................................................ 42

Figura 3.1: Alternativa escolhida e redução ................................................................................ 42

Figura 3.2: Adequação da alternativa escolhida ......................................................................... 43

Figura 3.3: Marca atual ............................................................................................................... 43

Figura 3.4: Wireframe padrão das seções .................................................................................. 44

Figura 3.5: Alternativa 01 - Home ............................................................................................... 45

Figura 3.6: Alternativa 01 - Obras por segmento ........................................................................ 46

Figura 3.7: Alternativa 01- Produtos ........................................................................................... 46

Figura 3.8: Alternativa 01 - Página de produtos ......................................................................... 47

Figura 3.9: Alternativa 01 - Quem somos .................................................................................... 48

Figura 4.0: Alternativa 01 - Detalhe home .................................................................................. 48

Figura 4.1: Alternativa 01 - Detalhe produtos ............................................................................. 49

Figura 4.2: Alternativa 01 - Detalhe quem somos ....................................................................... 49

Page 4: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

Figura 4.3: Alternativa 02 - home ................................................................................................ 50

Figura 4.4: Casal .......................................................................................................................... 51

Figura 4.5: Projeto....................................................................................................................... 51

Figura 4.6: Alternativa 02 - Produtos .......................................................................................... 52

Figura 4.7: Alternativa 02 - Quem somos .................................................................................... 53

Figura 4.8: Alternativa 02 - Edifícios ............................................................................................ 54

Figura 4.9: Alternativa 02 - Segmento escolhido ........................................................................ 55

Figura 5.0: Alternativa 03 - Home ............................................................................................... 56

Figura 5.1: Alternativa 03 - Textura de fundo ............................................................................. 56

Figura 5.2: Alternativa 03 - Obras por segmento ........................................................................ 57

Figura 5.3: Alternativa 03 - Detalhes ........................................................................................... 58

Figura 5.4: Alternativa 03 - Segmento escolhido ........................................................................ 59

Figura 5.5: Marca ........................................................................................................................ 60

Figura 5.6: Cor do símbolo .......................................................................................................... 60

Figura 5.7: Cor da fonte ............................................................................................................... 61

Figura 5.8: Fonte Helvetica ......................................................................................................... 62

Figura 5.9: Fonte Florencesans ................................................................................................... 62

Figura 6.0: Fonte Tunga ............................................................................................................... 62

Figura 6.1: Ilusão de ótica ........................................................................................................... 63

Figura 6.2: Limites da marca ....................................................................................................... 64

Figura 6.3: Aplicação em P&B ..................................................................................................... 66

Figura 6.4: Malha construtiva ..................................................................................................... 66

Figura 6.5: Redução ..................................................................................................................... 67

Figura 6.6: Dimensionamento ..................................................................................................... 67

Figura 6.7: Fundos coloridos ....................................................................................................... 68

Figura 6.8: Uso incorreto ............................................................................................................. 68

Figura 6.9: Monocromia .............................................................................................................. 69

Figura 7.0: Escala de cinza ........................................................................................................... 69

Figura 7.1: Principais cores utilizadas.......................................................................................... 70

Figura 7.2: Subtítulos .................................................................................................................. 71

Figura 7.3: Fonte Corbel .............................................................................................................. 71

Figura 7.4: Topo........................................................................................................................... 71

Figura7.5: Setas ........................................................................................................................... 72

Figura 7.6: Empresas do grupo .................................................................................................... 72

Figura 7.7: Função simbólica do topo ......................................................................................... 73

Page 5: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

Figura 7.8: Contraste ................................................................................................................... 75

Figura 7.9: Setas .......................................................................................................................... 75

Figura 8.0: Contornos .................................................................................................................. 75

Figura 8.1: Separação das imagens ............................................................................................. 76

Figura8.2: Título do conteúdo ..................................................................................................... 77

Figura 8.3: Breve texto ................................................................................................................ 78

Figura 8.4: Empresas do grupo .................................................................................................... 79

Page 6: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

LISTA DE GRÁFICOS

Gráfico 01 – Conhecimento da construtora ................................................................................ 20

Gráfico 02 – Conhecimento dos concorrentes ........................................................................... 21

Gráfico 03 – Freqüência de acesso .............................................................................................. 21

Gráfico 04 – Objetivos ................................................................................................................ 22

Gráfico 05 – .............................................................................................Busca de informações 22

Gráfico 06 – Interesse ................................................................................................................ 23

Gráfico 07 – Motivos ................................................................................................................... 23

Page 7: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

SUMÁRIO 1. INTRODUÇÃO .................................................................................................................... 9

1.1 Contextualização ............................................................................................................... 10

1.2 Problemática ..................................................................................................................... 13

1.3 Objetivos ........................................................................................................................... 14

1.3.1 Objetivo geral ............................................................................................................ 14

1.3.2 Objetivos específicos ................................................................................................. 14

1.4 Cronograma ...................................................................................................................... 15

1.5 Delimitação da pesquisa ................................................................................................... 16

1.6 Justificativa do tema ......................................................................................................... 16

1.7 Procedimentos metodológicos ......................................................................................... 16

1.7.1 Metodologia científica ............................................................................................... 16

1.7.2 Hipótese .................................................................................................................... 17

1.7.3 Briefing ...................................................................................................................... 17

1.7.4 Questionário .............................................................................................................. 20

1.7.5 Metodologia Projetual .............................................................................................. 25

1.8 Estrutura do trabalho ........................................................................................................ 26

2. FUNDAMENTAÇÃO TEÓRICA ............................................................................................ 27

2.1 Mercado imobiliário a nível nacional ................................................................................ 27

2.1.2 Efeitos do boom imobiliário ...................................................................................... 28

2.1.3 Crise econômica mundial .......................................................................................... 29

2.1.4 Mercado imobiliário a nível regional ......................................................................... 29

2.2 Design Gráfico ................................................................................................................... 30

2.3 Identidade Visual .............................................................................................................. 30

2.4 Marca ................................................................................................................................ 31

2.5 Marca dos principais concorrentes ................................................................................... 32

2.6 Internet ............................................................................................................................. 33

2.7 Web sites........................................................................................................................... 34

2.8 Web sites dos principais concorrentes ............................................................................. 34

2.9 Painéis semânticos ............................................................................................................ 38

2.9.1 Público Alvo ............................................................................................................... 38

2.9.2 Expressão do produto ............................................................................................... 39

3. CONCEPÇÃO .................................................................................................................... 40

Page 8: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

3.1 Geração de alternativas para o redesign da marca .......................................................... 40

3.1.2 Alternativa 01 ............................................................................................................ 40

3.1.3 Alternativa 02 ............................................................................................................ 41

3.1.4 Alternativa 03 ............................................................................................................ 41

3.1.5 Alternativa 04 ............................................................................................................ 42

3.1.6 Alternativa 05 - escolhida .......................................................................................... 42

3.1.7 Justificativa da alternativa escolhida e adequação ................................................... 42

3.2 Geração de alternativas para o web site da construtora ................................................. 44

3.2.1 Alternativa 01 ............................................................................................................ 45

3.2.2 Alternativa 02 - escolhida .......................................................................................... 51

3.2.3 Justificativa da alternativa escolhida ......................................................................... 51

3.2.4 Páginas internas ........................................................................................................ 52

3.2.5 Alternativa 03 ............................................................................................................ 56

3.2.6 Páginas internas ........................................................................................................ 57

4. MEMORIAL DESCRITIVO DO PROJETO .............................................................................. 60

4.1 Função estético formal do projeto de redesign da marca ................................................ 60

4.1.2 Cor ............................................................................................................................. 60

4.1.3 Tipografia ................................................................................................................... 61

4.1.4 Tipografia padrão ...................................................................................................... 62

4.1.5 Gestalt ....................................................................................................................... 63

4.1.6 Função simbólica ....................................................................................................... 64

4.1.7 Função Técnica .......................................................................................................... 65

4.2 Função estético formal do projeto web site ..................................................................... 70

4.2.1 Cores .......................................................................................................................... 70

4.2.2 Formas ....................................................................................................................... 71

4.2.3 Tipografia ................................................................................................................... 73

4.2.4 Gestalt ....................................................................................................................... 73

4.2.5 Função Simbólica ....................................................................................................... 74

4.2.6 Ergonomia ................................................................................................................. 75

4.2.7 Usabilidade ................................................................................................................ 76

4.2.8 Tecnologias ................................................................................................................ 78

4.2.9 Marketing .................................................................................................................. 79

5. CONSIDERAÇÕES FINAIS .................................................................................................. 80

6. REFERÊNCIAS ................................................................................................................... 81

Page 9: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

7

RESUMO

O presente relatório aborda a descrição do desenvolvimento do projeto de redesign da marca e criação de um web site corporativo para construtora Mattiello localizada em Chapecó, Santa Catarina. Há mais de 25 anos no mercado a construtora vem realizando serviços de qualidade. Este projeto é extrema importância, pois a construtora além de possuir uma marca que aparenta ser antiga, não possui web site, ficando em desvantagem em relação aos principais concorrentes. No andamento deste relatório será possível observar as etapas para o desenvolvimento do projeto, partindo de pesquisas, elaboração de conceitos, geração de alternativas e chegando a solução.

Palavra-chave: Redesign, web site, projeto

Page 10: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

8

ABSTRACT

The following text speaks about the description of the project development of a brand redesign and the creation of a corporation website to the Mattiello builder located on Chapecó, Santa Catarina. Twenty five years on the market, the builder have done many high quality jobs. This project is extremely important, because the builder, beyond having a brand that appears to be old, don’t have a website, been disadvantaged when compared to the competitors. In the progress of this report will be possible observe the steps to the development of the project, coming from searches, development of concepts, creation of alternatives and reaching the solution.

Key words: Redesign, web site, project

Page 11: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

9

1. INTRODUÇÃO

O mercado de construção civil brasileiro vivia uma situação de crescimento sem precedentes até agosto de 2008, ou seja, até o início da crise financeira mundial. As construtoras agora estão entre dois caminhos investir ou cortar custos?

Este projeto mostra o melhor caminho para construtora Mattiello, que é o investimento em sua imagem e divulgação, ou seja, no fortalecimento da marca.

A marca é a imagem da construtora, ela transmite a sua personalidade e os valores que são oferecidos ao público. A atual marca aparenta ser antiga, não expressando visualmente o valor de qualidade da empresa que se preocupa com todos os detalhes no desempenho dos seus trabalhos.

Investimentos em divulgação é uma forma eficiente para fortalecer a marca, a internet mostra-se o meio ideal, pois é uma mídia de fácil acesso no Brasil, de acordo com o Ibope/Net Ratings o país ainda lidera em tempo de navegação em relação ao mundo. Um web site oferece a oportunidade de mostrar o portfólio da construtora e atrair futuros clientes de diferentes perfis.

Portanto, este trabalho mostra que é necessário para a construtora, agregar novas percepções na sua imagem, induzir que ela está investindo e projetar seu nome no futuro, pois, são novos atributos visuais que demonstram a sua integridade e capacidade de reinventar-se apesar das dificuldades enfrentadas neste momento de crise.

Page 12: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

10

1.1 Contextualização

O mercado de construção civil no Brasil esteve em sua melhor fase, segundo o IBGE apresentou crescimento consistente em 25 meses e, fechou 2008 com um crescimento de 8%, impulsionado pelo boom do mercado imobiliário que a partir de 2007 esteve em um momento único devido à abundância de crédito, juros em queda e prazo de financiamento em alta.

Segundo o Sinduscon-RS (Sindicato da Indústria da Construção Civil do Estado do Rio Grande do Sul na região sul) o setor também cresceu. O Índice de Atividade da Construção Civil Gaúcha (IAC/RS) registrou crescimento de 7,28% no primeiro semestre de 2008 em relação a igual período de 2007.

Já no Paraná, o crescimento no número de lançamentos de empreendimentos residenciais acima de quatro andares foi de 90% de janeiro a abril de 2008 em relação ao mesmo período de 2007. O aumento do volume de alvarás, para novas construções, verificado foi de 52 % de janeiro a abril de 2008 em relação ao mesmo período de 2007 no Estado. (Revista CREA PR, 2008, n°58, p. 24).

Em Santa Catarina o setor estava desacelerando, mas também voltou a crescer em 2007 devido ao boom imobiliário, segundo dados do web site do CREA-SC, neste ano, o número edifícios de alvenaria residenciais e comerciais bateram recorde, totalizando 31.424 novas obras. Como mostra a figura 1.1 e 1.2, somando todos os tipos de construções, 2007 fechou com o melhor resultado em 17 anos, 40.549 novas obras e um total de 13.981.031,33 metros quadrados construídos.

Figura 1.1 Total de m². Fonte: www.crea-sc.org.br

0,00

2.000.000,00

4.000.000,00

6.000.000,00

8.000.000,00

10.000.000,00

12.000.000,00

14.000.000,00

1990

19

91

1992

19

93

1994

19

95

1996

19

97

1998

19

99

1999

20

00

2001

20

02

2003

20

04

2005

20

06

2007

Total de m²

TOTAL

Page 13: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

11

Figura 1.2 Número de obras Fonte: www.crea-sc.org.br

Porém a construção desacelera e deve crescer menos em 2009 devido a crise financeira mundial. Segundo a Fundação Getulio Vargas Projetos e Sinduscon-SP (Sindicato da Indústria da Construção Civil do Estado de São Paulo) consolidaram sua estimativa de incremento do PIB (Produto Interno Bruto) da construção civil de 2009 em 3,5%.

Esta previsão é baseada nos mais recentes dados do IBGE (Instituto Brasileiro de Geografia e Estatística) divulgados no site www.ibge.gov.br que indicou queda de 3,6% no PIB da economia no quarto trimestre de 2008 e especificamente o setor de construção civil como mostra a figura 1.3 o PIB que chegou a ser de 11,7% no terceiro trimestre de 2008, restringiu-se a 2,1% no período seguinte.

0

5.000

10.000

15.000

20.000

25.000

30.000

35.000

40.000

45.000

1990

1991

1992

1993

1994

1995

1996

1997

1998

1999

2000

2001

2002

2003

2004

2005

2006

2007

Número de obras

TOTAL

Page 14: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

12

Figura 1.3 PIB da construção civil Fonte: IBGE

Segundo Thiago Oliveira, 2000 em uma matéria feita no Portal especializado no mercado da construção civil brasileira o PINIWEB que

“Em reunião com empresários na sede do SindusCon-SP, a economista Ana Maria Castelo, consultora da FGV Projetos, afirmou que as atividades do setor permanecerão aquecidas no primeiro semestre, resultado de negócios fechados antes do início da crise global. ‘Mas o efeito do carregamento perderá força no segundo semestre, pois desde o início da crise, poucos lançamentos estão sendo realizados", observou Ana Maria. Apesar das perspectivas de um 2009 historicamente difícil para o setor - há quem arrisque crescimento nulo da economia, este ano, o que certamente acarretaria consequências danosas à construção -, não faltam aspectos positivos em vista. Um deles foi mencionado, nesta mesma reunião no SindusCon-SP, pelo professor da Escola de Economia de São Paulo da FGV, Paulo Gala: "Até a metade do ano, certamente teremos a Selic (taxa básica de juros) abaixo dos 10%, o que nunca aconteceu desde que ela foi criada, em 1986". Por essa e por outras razões (como os aguardados investimentos maciços do Governo Federal em habitação), Gala se diz otimista para a volta do crescimento sustentado do setor a partir de 2010. "A recessão no Brasil será curta, não vai desmontar as estruturas criadas na economia do País ao longo dos últimos anos", assegurou o professor.

Page 15: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

13

1.2 Problemática

A marca da construtora Mattiello usa um símbolo simplificado ajudando na memorização, porém possui dois erros, o primeiro é uma baixa pregnância na letra “E” dificultando a compreensão e rapidez de leitura ou interpretação, o segundo é uma má composição da tipografia com o símbolo e os elementos gráficos.

A marca é capaz de transmitir e agregar valor, ou seja, uma marca bem feita projeta uma imagem boa da empresa, destacando da concorrência. Muitas vezes isso já é o suficiente para a decisão de compra do cliente.

É importante que esta marca siga uma identidade visual, ou seja, deve prevalecer, por exemplo, o uso de uma cor, elemento gráfico ou tipografia padrão na papelaria, fachada e web site. Deste modo cria-se uma identificação por parte do usuário ao entrar em contato com esses diferentes tipos de mídias, ou simplesmente, observando a marca presente na fachada ou em algum produto. Essa relação reforça a imagem da empresa, tornando-se assim mais conhecida e valorizada.

Figura 1.4 Marca Fonte: arquivo pessoal

Fazendo uma breve análise sobre os web sites dos concorrentes, existe uma falta de preocupação e planejamento com a composição do layout e conteúdo, nenhum deles apresenta uma estrutura adequada aos conceitos de design atuais. A análise detalhada está inserida no item 2.6, página 31.

Um web site pode ser um grande diferencial competitivo, é um meio no qual o cliente em qualquer lugar do mundo tem a facilidade de obter informações, o conteúdo da empresa, analisar e ter uma experiência sobre a construtora.

Page 16: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

14

1.3 Objetivos

1.3.1 Objetivo geral

Redesign da identidade visual, criação de um manual de aplicação da Marca e website coorporativo para construtora Mattiello.

1.3.2 Objetivos específicos

Criação de um manual de aplicabilidade do tipo restrito, que consistem em apresentar apenas as regras de aplicação da Marca

Criação do Site e suas seções (página inicial, quem somos, obras por segmento, segmento escolhido e produtos).

Page 17: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

15

1.4 Cronograma

Figura 1.5 Cronograma Fonte: Arquivo pessoal

Page 18: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

16

1.5 Delimitação da pesquisa

O manual de identidade visual da marca estará restrito apenas aos aspectos relacionados à aplicação da marca (regras de uso, preferências, restrições etc.) não haverá aplicações em papelarias, uniformes, brindes e etc.

Serão criados apenas os layouts para o site, não haverá programação nem publicação online.

1.6 Justificativa do tema

Neste momento de crise financeira o fortalecimento da marca é fundamental para dar segurança aos compradores. Redesenhar a marca e criar um web site é uma grande ferramenta promocional. A união destes dois fatores juntamente com o potencial da internet, onde no Brasil segundo pesquisa realizada em janeiro de 2009 pelo Ibope/Net Ratings empresa que mede a internet brasileira desde setembro de 2000, existem 43,1 milhões de usuários e o país lidera com um tempo de navegação de 24 horas e 49 minutos em média por mês em relação ao mundo, faz com que públicos de diferentes perfis tenham a oportunidade de conhecer a construtora. É um habito comum que antes de sair de casa as pessoas interessadas em conhecer os empreendimentos visitem um web site em busca de mais informações.

1.7 Procedimentos metodológicos

1.7.1 Metodologia Científica

Segundo Trujillo (1974, p.171), a pesquisa tem como objetivo “tentar conhecer e explicar os fenômenos que ocorrem no mundo existencial”, ou seja, como esses fenômenos operam, qual a sua função e estrutura, quais as mudanças efetuadas, porque e como se realizam, e até que ponto podem sofrer influências ou ser controlados.

Pesquisas em periódicos

Antes de iniciar qualquer pesquisa de campo, o primeiro passo é a análise minuciosa de todas as fontes documentais que sirvam de suporte a investigação projetada. A tradicional biblioteca possui um grande conteúdo de informações atuais e relevantes relacionados com o tema. Serão realizadas pesquisas tanto em livros, como em revistas.

Pesquisa de Campo

Para entender a situação do problema a ser resolvido, será realizada uma pesquisa em forma de questionário com os clientes da construtora em Chapecó, buscando informações relevantes para o desenvolvimento do redesign da marca e web site.

Pesquisa na internet

Devido ao tema do projeto, é de fundamental importância a pesquisa na internet, buscando artigos publicados em portais do segmento de construção civil e principalmente analisar os sites de concorrentes e também de outras áreas de mercado, com o objetivo de compreender o estado de design.

Page 19: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

17

Construção de hipóteses

É a formulação da solução provisória do problema, segundo Lakatos (1999 p.30) hipótese é uma preposição que se faz na tentativa de verificar a validade de resposta existente para um problema. É uma suposição que antecede a constatação dos fatos e tem como características uma formulação provisória; deve ser testada para determinar sua validade.

1.7.2 Hipótese

Com uma identidade visual reformulada, a construtora pode transmitir uma nova mensagem de qualidade e segurança aos seus clientes. Adicionando para a empresa um novo diferencial competitivo.

Durante o período de visita ao web site, o cliente deve ser impressionado não apenas pelo conteúdo, más também pela sofisticação dos elementos gráficos e facilidade de uso.

Um web site moderno aliado com uma identidade visual reformulada podem colaborar para redefinir o valor da marca da construtora.

1.7.3 Briefing

Este briefing tem como objetivo obter respostas para algumas questões fundamentais para realização deste projeto.

1. Nome do projeto

Projeto construtora Mattiello

2. Objetivo/problema a ser resolvido

Fazer o redesign da marca e criar um Web site corporativo

3. Conteúdo

Contar a história da construtora Mostrar as principais obras realizadas e as que estão sendo construídas Mostrar as obras que estão sendo construídas, com detalhes como: Planta. 4. “Imagem” que o cliente quer passar para os visitantes. Equipe completa para construção, ou seja, a empresa realiza desde o projeto arquitetônico e estrutural até a os serviços de pré-moldados. Durante os mais de 20 anos na área, a construtora nunca realizou uma obra mal feita, ou seja, com problemas em sua estrutura. Se compromete a realizar serviços com segurança, qualidade e confiança. A matéria prima é sempre de qualidade, não se submetem a reduzir preço a qualquer custo. 5. Principal diferencial a ser explorado Interatividade.

Page 20: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

18

6. Público alvo O público alvo da construtora é formado por usuários de três diferentes perfis. O primeiro perfil é formado por usuários primários, ou seja, compõem a maioria dos clientes da construtora que são empresários com mais de 35 anos de idade, possuindo uma renda acima de 30 salários mínimos e possuem três características observadas, são elas: Empresários investidores do mercado imobiliário, que desejam construir edifícios de médio porte, ou seja, com média de quatorze andares. Empresários que desejam construir ou ampliar as instalações físicas de suas empresas através de estruturas pré-moldadas, chamadas de barracões. Estas estruturas são construídas para empresas de todos os tipos de ramos.

Empresários da indústria de alimentos, que necessitam construir barracões para estocar seus produtos e também aviários e chiqueiros para estruturar a sua rede de fazendas. Os usuários secundários constituem o segundo perfil, são famílias e pessoas de ambos os sexos com renda entre 5 a 20 salários mínimos que desejam construir ou reformar a sua casa própria. O último perfil, formado por usuários terciários são donos de fazendas e agricultores que buscam construir ou ampliar os seus aviários e chiqueiros. Sexo

Ambos.

Classe social

Classe média e alta.

Faixa etária

25 à 60 anos.

Hábitos e atitudes dos clientes

Grande parte dos clientes localiza-se na região oeste de Santa Catarina, noroeste do Rio Grande do Sul, centro sul e sudoeste do Paraná. As obras realizadas para estes clientes são construções de aviários e chiqueiros.

6. Construtora Mattiello

A construtora iniciou suas atividades na construção civil em 01 de Agosto de 1981, com o nome Empreiteira Mattiello. Situada na rua Vicente Rech em Seara Santa Catarina a empresa somente oferecia serviços de mão-de-obra para casa e edifícios comerciais e industriais.

No mesmo endereço em 02 de janeiro de 1993, foi incorporada uma nova empresa de fabricação de estruturas pré-moldadas e concreto armado e o nome passou a se chamar construtora Mattiello.

Page 21: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

19

Muitos trabalhos da construtora eram realizados na cidade de Chapecó-sc, motivo pelo qual a construtora em 1995 mudou as suas instalações para a maior cidade do oeste. Em 19 de abril de 2000 foi transferida a fábrica de pré-moldados para um novo endereço na Rodovia SC 283 Km 31,5 entre Seara e Chapecó com uma área bem ampla permitindo um crescimento em novos produtos e quantidade de obras, possuindo capacidade para atender as regiões oeste do Paraná, noroeste do Rio Grande do Sul e toda Santa Catarina tornando a construtora uma das mais conhecidas da região. 7. Concorrência direta.

NOSTRA CASA

A construtora Nostra Casa é uma das mais antigas da cidade de Chapecó, segundo o site da empresa, ela atua no mercado desde 22 de agosto de 1980 e constrói os maiores e mais bonitos edifícios da cidade.

A construtora compromete-se a realizar obras de médio a alto padrão com alto nível de qualidade e por ser uma empresa sólida, oferece garantia da conclusão dos empreendimentos aos investidores.

Possui uma equipe própria de mão-de-obra e um setor de engenharia sempre buscando a conquista de maior qualidade e aprimoramento das técnicas construtivas.

Portanto, por ser uma construtora completa, a Nostracasa é uma das mais conhecidas da cidade.

ROTESMA Focada para construções pré-moldadas a Rotesma de acordo o seu web site está classificada entre as 25 prémoldadeiras do país, sempre buscando inovações tecnológicas e soluções criativas que possam contribuir para otimizar os empreendimentos dos clientes, portando caracteriza-se como a principal concorrente em pré-moldados da construtora Mattiello. A Rotesma atua nos três estados do sul e destaca-se pelas construções em pré-moldados de grande porte, por exemplo, estádios de futebol, supermercados e instalações físicas de grandes indústrias. CATARINENSE O conceito da construtora catarinense, de acordo com o seu site é que construir é mais que um ofício, é uma paixão passada de geração em geração através da família ao qual pertence a empresa. Fundada há mais de 100 anos, a Catarinense já possui tradição no mercado, agregando deste modo, confiança em seus serviços.

A construtora realiza obras de pequeno porte, como a construção de casas e reformas em geral e também empreendimentos de médio porte, como a construção de edifícios de até quatorze andares e salas comerciais.

Page 22: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

20

SANTA MARIA A empresa mais recente das concorrentes, porém umas das que mais crescem na cidade, a construtora Santa Maria foi fundada em 1994 com foco no segmento de incorporação e construção de imóveis de pequeno porte, por exemplo, construções de casas e prédios e condomínios de médio porte. Possui uma equipe de funcionários eficientes, pois na maioria das vezes finalizou seus empreendimentos antes do prazo final. A visão da empresa segundo o seu web site, é “tornar-se uma empresa referência, pela qualidade de seus produtos e pelo atendimento a seus clientes.” 1.7.4 Questionário

O questionário foi aplicado na cidade de Chapecó, entre os dias 25 a 30 de abril de 2009, na forma de um web site, que a própria construtora enviou aos seus clientes, com o objetivo de obter informações para ajudar no desenvolvimento do projeto. Participaram deste questionário um total de 18 clientes.

1 – Como você conheceu a construtora Mattiello?

A) Rádio B) Indicação C) Placas colocadas nas obras D) Outros, quais?

Gráfico 01 – Conhecimento da construtora Fonte: Arquivo pessoal

Os resultados demonstram que as pessoas conhecem a construtora apenas de duas maneiras, por indicação ou placas colocadas nas obras. Outro meio de divulgação da construtora são propagandas em rádio, mas como ela é feita em uma estação AM onde sua audiência é pequena, mostrou-se ineficaz. Conhecer mais sobre a construtora restringe as pessoas a fazer uma visita na empresa.

Page 23: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

21

2 – A respeito das outras construtoras presentes na cidade, como você conheceu elas?

A) Propaganda em rádio ou TV B) Na internet, visitando o seu web site C) Placas colocadas nas obras D) Indicação E) Outros quais?

Gráfico 02 – Conhecimento dos concorrentes Fonte: Arquivo pessoal

Placas colocadas nas obras das construtoras também é o meio mais eficaz de divulgação da concorrência, porém elas investem em propagandas em radio, TV e internet, ou seja, as pessoas tem melhores oportunidades de conhecer as construtoras concorrentes.

3 – Com que freqüência você costuma acessar a internet?

A) Uma vez por semana B) De duas a quatro vezes por semana C) Só nos finais de semana D) Todos os dias E) Não acesso a internet

Gráfico 03 – Freqüência de acesso Fonte: Arquivo pessoal

Page 24: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

22

A maioria usa a internet todos os dias, comprovando que o web site é um importante meio para divulgação da construtora, onde os usuários podem deste modo conhecer outras obras, não apenas aquelas que estão sendo divulgadas por placas nas obras, ou visitando a empresa.

4 - Com quais objetivos você usa a internet?

A) e-commerce B) e-mail C) pesquisas D) sites de convivência E) outros, quais?

Gráfico 04 – Objetivos Fonte: Arquivo pessoal

O principal objetivo no uso da internet é a pesquisa e como mostra os resultados da pergunta a seguir os clientes buscariam informações sobre uma construtora.

5 - Você buscaria informações sobre uma construtora pela internet?

A) Sim B) Não

Gráfico 05 – Busca de informações Fonte: Arquivo pessoal

Page 25: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

23

Como a maioria dos clientes utiliza a internet como ferramenta de pesquisa, buscar informações sobre uma construtora apontou ser uma intenção favorável, justificando deste modo a necessidade da construtora em possuir um web site.

6 – Você teria interesse em acompanhar o andamento de sua obra na internet?

A) Sim B) Não

Gráfico 06 – Interesse Fonte: Arquivo pessoal

Essa questão esclarece a necessidade de ter uma seção no web site onde o cliente pode acompanhar o andamento de sua obra. 7 - Por quais motivos você escolheu realizar sua obra com a construtora Mattiello?

A) Qualidade B) Acabamento C) Confiança D) Preço E) outros, quais?

Gráfico 07 – Motivos Fonte: Arquivo pessoal

Page 26: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

24

O grande diferencial da construtora é realizar serviços com qualidade e os clientes também confiam nos serviços prestados, sendo assim o preço não se torna o principal motivo na decisão de escolha da construtora diante da concorrência. Portanto, conceitos como qualidade e confiança devem ser traduzidos para a marca e web site. Indicação foi um motivo obtido na alternativa E As questões 8,9 e 10 apresentam respostas opcionais que estão no questionário, ou seja, apenas os clientes que quiseram expressar a sua opinião. As frases ao final de cada pergunta são as respostas originais dos clientes. 8 – O que você acha da marca da Construtora Mattiello?

Em geral as pessoas gostaram da marca, porém apontaram a necessidade de um redesign ao afirmarem que ela parece antiga. Também contém excesso de vermelho, não transmitindo segurança e qualidade como conceitos.

- Gostei é interessante mas usaria a cor a azul pela questão do azul transmitir segurança e qualidade. o vermelho ta muito fast food só falta o amarelo (hahaha) e vc se encontra no mcdonald matiello fast food (hahaha).

- parece antiga.. e sem um sentido, conceito

- símbolo simples

9 -O símbolo faz lembrar a letra M? Parece um pouco com a letra M, porém o que mais fica explicito são os espaços em branco, remetendo mais para a letra V.

- Lembrar até que lembra, o que possa a vir a interferir o espaço em branco remete ao um V.

- lembra mais a letra V que fica explícita.

- Muito pouco

10 -A tipografia está legível?

Está legível, mas a letra E parece perdida no meio ao resto da palavra. - O E parece perdido em meio ao resto da palavra... não vejo significado especial

Page 27: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

25

1.7.5 Metodologia Projetual

Francisco Homem de Melo redigiu um texto apresentado sua metodologia para o livro O valor do design da Associação dos Designers Gráficos do Brasil, lançado em 2003.

Método generalista para o desenvolvimento de projetos de design gráfico.

Segundo Melo (2003) o primeiro passo para o desenvolvimento de um projeto é estar a par das necessidades e deficiências da sociedade, ou da parcela da população em questão. A atividade profissional do designer gráfico é uma intervenção cotidiana na vida das pessoas. Ter consciência da origem dos problemas para os quais somos chamados a apresentar soluções é um ponto de partida necessário e fundamental.

Este primeiro passo antecede qualquer contato com o suposto problema a ser resolvido, é um conhecimento que deve fazer parte do próprio designer gráfico.

Em uma síntese a fim de explicar resumidamente cada passo do método de Francisco, Janaina Fuentes Panizza (2004, p.147) em sua dissertação de mestrado pela Escola de Comunicação e Artes de São Paulo – ECA/USP explica abaixo as diversas etapas para o desenvolvimento de um projeto.

Briefing – É a parte onde reúnem todas as informações necessárias para entender o problema, porém nem sempre, o problema está de acordo com o seu ponto de vista, portanto nestes casos é necessário redefinir o problema.

Levantamento de dados – Após o briefing é necessário compreender sobre o mercado onde está envolvido o projeto.

Conceituação do projeto – Uma linguagem visual é adota de acordo com o problema observado e tem o objetivo de servir como base para o desenvolvimento do projeto.

Elaboração da proposta preliminar de projeto – Após a conceituação são geradas as primeiras alternativas de solução para o problema.

Apresentação da proposta ao cliente – As alternativas geradas devem ser apresentadas ao cliente para possíveis alterações e aprovação.

Avaliação da proposta - Momento em que a proposta sofre avaliações do cliente, de pessoas em quem o cliente confia e nas pesquisas com o público-alvo.

Ajustes realizados na proposta – Nesta etapa são feitos os ajustes finais tanto na conceituação como nos estudos preliminares.

Desenvolvimento do projeto - Dependendo da complexidade do projeto é necessária a contratação de profissionais específicos para auxiliar na execução do produto final. Nesta parte é importante fazer uma revisão nos processos de pré-produção e produção para assegurar que as intenções do designer ganhem forma material.

Implantação e/ou distribuição – Esta parte é um componente do problema e deve fazer parte do briefing inicial, mesmo que não seja o designer gráfico responsável por este tarefa.

Page 28: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

26

Figura 1.6 Metodologia de projeto Fonte: Guia ADG Brasil

1.8 Estrutura do trabalho

Capítulo 1 – Contextualização

É a coleta de informações necessárias sobre o tema específico do trabalho. Tem o objetivo de compreender o problema a ser resolvido, estabelecer objetivos, hipóteses, métodos de pesquisa e projeto e organizar um cronograma.

Capítulo 2 – Fundamentação teórica (pesquisas, estudo de caso, definição e análise, conceituação)

Nesta parte, a partir da compreensão do problema, realizam-se pesquisas de mercado, concorrência e estado de design a fim de elaborar conceitos para servir de linguagem visual do trabalho.

Capítulo 3 – Concepção (geração de alternativas, seleção, adequação, justificativa da escolha)

É o momento no qual surgem diversas soluções para a problemática do projeto, seleciona-se uma das alternativas e por fim realiza-se as adequações necessárias.

Capítulo 4 – Memorial descritivo do projeto (função estético formal, ergonomia, usabilidade, tecnologias, processos de produção, marketing, informacional). Neste capitulo reúnem-se todas as análises técnicas envolvidas no projeto.

Page 29: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

27

Capítulo 5 – Considerações finais

Conclusão do projeto - verificar se objetivo foi atingido e analisar os desdobramentos futuros, ou seja, quais outros projetos podem ser desenvolvidos a partir desta pesquisa.

2. FUNDAMENTAÇÃO TEÓRICA

2.1 Mercado imobiliário a nível nacional

O mercado imobiliário brasileiro a partir do ano de 2007 estava passando por um dos melhores momentos de sua historia, grande parte devido à retomada do crédito pelos agentes que integram o SBPE (Sistema Brasileiro de Poupança e Empréstimo) e seu principal instrumento de captação de recursos são as contas de poupança. Na prática, antes de 2007, era mais barato alugar um imóvel, porém, devido à retomada de credito pelo SBPE, estabilidade econômica e pela constante baixa nos juros, a opção de financiar a própria casa tornou-se cada vez mais interessante.

Segundo Gonçalves (2008) o número de unidades financiadas nos 12 meses terminados em maio de 2007 superou 227,6 mil. Ele afirma que

“Com mais segurança, os agentes financeiros passaram a oferecer melhores condições de prazo, juros e valor financiado em relação ao imóvel, que aumentaram de forma significativa o potencial de tomadores de créditos. Com isso, além das famílias não necessitarem dispor de níveis elevados de poupança, na medida em que os agentes financeiros passaram a oferecer crédito correspondente a cerca de 80% do valor do imóvel, também houve aumento dos prazos e redução das taxas de juros, colocando a prestação no “bolso” de um número mais expressivo de famílias, habitando-as a tomar crédito. Além da disponibilização de crédito às famílias que vinha sendo alijadas do mercado, a retomada das operações também possibilitou que o crédito chegasse aos quatro cantos do país, em contraposição à centralização nas principais cidades quando o crédito era escasso. Ou seja: o crédito foi democratizado.”

Esta nova fase do mercado não foi percebida apenas pelos agentes financeiros que disponibilizam o crédito. Os investidores nacionais e também os estrangeiros identificaram este novo ciclo de crescimento no país, eles observaram que duas dezenas de incorporadoras e construtoras tiveram a abertura de seus capitais na bolsa de valores, obtendo assim elevados volumes de recursos no lançamento de ações.

Este sucesso obtido pelas empresas que abriram seus capitais, fez com que o nível de confiabilidade, transparência e profissionalismo dos fornecedores de crédito e dos clientes aumentassem, Gonçalves (2008) afirma que

“A nova fase do mercado imobiliário aumentou a confiança dos agentes do SBPE, que pode ser medida pela ampliação do volume de recursos destinados a produção. Em 2002, apenas 33,6% dos recursos alocados pelos agentes financeiros foram destinados à construção de novas unidades. Em

Page 30: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

28

2007 esse percentual chegou a 50,7% do total de recursos, indicando que o setor da construção recebeu mais de R$ 9,2 bilhões em apenas um ano, mais do que o valor total nos quatro anos anteriores.”

2.1.2 Efeitos do Boom imobiliário.

O crescimento da construção civil brasileira de 2007 até agosto de 2008 foi um dos maiores já vistos em sua historia, apresentou crescimento consecutivo em mais de 25 meses, muitos investimentos foram anunciados. Construtoras, escritórios de projeto, ou seja, todos que integram a cadeia produtiva tiveram trabalho de sobra e a indústria de materiais investiu pesado para manter a demanda do mercado.

De acordo com Oliveira (2008), ele afirma que:

“O recorde foi noticiado com alarde por toda a imprensa brasileira: no último mês de maio, o financiamento imobiliário com recursos da caderneta de poupança atingiu o montante de R$ 2,27 bilhões (mais de 22 mil unidades), valor 35,6% superior ao mesmo período de 2007 - e simplesmente a maior marca em 20 anos. Foi apenas mais uma prova do momento favorável que vive o mercado. Há vários outros números. Ainda no campo do crédito para habitação, somente nos cinco primeiros meses do ano, o volume de empréstimos (R$ 9,340 bilhões) foi 75,9% superior ao contratado no mesmo período de 2007 - e superou em 4,3% todos os financiamentos concedidos ao longo de 2006. Até dezembro, o SindusCon-SP (Sindicato da Indústria da Construção Civil do Estado de São Paulo) calcula que sejam financiados 220 mil imóveis com recursos da poupança - que representa, sozinha, 65% do crédito imobiliário -, número 12% maior em relação a 2007. Em valores, isso equivale a um total de R$ 25 bilhões emprestados, contra R$ 18,2 bilhões concedidos no ano passado.”

Os fabricantes de materiais só se convenceram da solidez do aquecimento da construção civil no segundo semestre de 2007 e com tanta demanda no mercado a indústria do setor investiu pesado para aumentar a produção e junto com a alta dos preços no mercado chegou a preocupar com riscos de desabastecimento.

No momento do boom antes da crise econômica mundial as indústrias esperavam um crescimento de 10,2% em 2008, eram raros os fabricantes de materiais que não estavam operando perto do limite e havia dificuldade, da própria indústria em obter uma precisão do volume da demanda na construção civil. Em junho de 2008, em uma matéria realizada por Mirian Blanco na revista Construção e Mercado o diretor da Votorantim cimentos, Marcio Chamma, empresa presente em vinte estados e mais de 100 municípios brasileiros e possui operações em 14 países, fez uma observação interessante. “ Se viéssemos de um ciclo de crescimento baseado no passado, conseguiríamos fazer uma projeção da demanda mais acertada, mas estamos vivenciando uma situação sem precedentes”.

Page 31: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

29

2.1.3 Crise econômica mundial.

A partir da falência do banco de investimentos americano Lehman Brothers, o colapso no mercado financeiro espalhou tensão pelo mundo. O grande ciclo de crescimento expirou, houve queda acentuada no PIB da construção de 11,7% no segundo trimestre para 2,1% no terceiro trimestre do ano de 2008, a construção civil brasileira agora está em uma nova realidade.

O principal fator da retomada do crescimento da construção civil brasileira foi a queda de juros e principalmente o crédito abundante através do SBPE (Sistema Brasileiro de Poupança e Empréstimo), mas um dos abalos instantâneos que a crise promove é na dinâmica do crédito, elevando a sua taxa de juros, fazendo com que as empresas revisem planejamentos e estratégias.

As construtoras e incorporadoras tiveram que realizar mudanças drásticas para manter a sobrevivência. Segundo Oliveira (2009) afirma que, diante da imprevisibilidade do mercado, fomentar reservas e fortalecer o capital tem sido práticas comuns, de acordo com ele

“O modo como buscam essa segurança é que varia. A Inpar, presente em 17 Estados, optou por vender três de seus edifícios comerciais, localizados no Morumbi e Itaim Bibi, bairros de alto padrão em São Paulo. Com isso, acrescentou R$ 100 milhões ao caixa. Outra incorporadora presente em todo o País, a Abyara seguiu um viés mais delicado: cortou 40% da folha de pagamento - segundo estimativas, o equivalente a cerca de 100 funcionários e R$ 1,5 bilhão em redução de custos. Além disso, vendeu projetos em parcerias com outras empresas (oito, ao todo, o que rendeu R$ 40 milhões) e se desfez de aproximadamente R$ 150 milhões em terrenos. Para completar, a companhia fechou regionais no Rio de Janeiro e no Nordeste (transferidas para São Paulo) e suspendeu lançamentos "até que a demanda por novos produtos imobiliários e a disponibilidade de linhas de crédito sejam restabelecidas", conforme assinalado em comunicado oficial. Foi um dos conjuntos de atitudes mais drásticos a que o mercado assistiu - explicado também pelo endividamento operacional negativo anterior à turbulência na economia.”

Segundo Mendes (2009) Em momentos de desaceleração do mercado, as empresas costumam

escolher, em geral, entre dois caminhos. O primeiro é radical: parar tudo, promover profundos

cortes de custos, reduzir pessoal e adiar projetos. O segundo caminho, menos pessimista, é

olhar para dentro da organização, melhorar processos de gestão, aprimorar áreas estratégicas

e investir.

Page 32: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

30

2.1.4 Mercado imobiliário a nível regional

O Brasil inteiro vinha experimentando um período de crescimento antes da crise mundial, Santa Catarina obteve em 2007 o melhor resultado em 17 anos na construção civil, foram realizadas 40.549 novas obras e um total de 13.981.031,33 metros quadrados construídos.

Em Chapecó SC também foi alto o desempenho da construção civil e apresentou crescimento significativo desde 2005, segundo o site Bela Santa Catarina Noticias, até novembro de 2007, foram emitidos alvarás de licença para construção de 354.526,82 metros e o ano fechou com 841 alvarás para residências, 175 para comércio e 145 diversas, comparando com outras cidades de Santa Catarina no ano de 2007 a cidade foi a que obteve melhor desempenho do estado, segundo o site da prefeitura de Chapecó a construção civil cresceu 27,04%.

2.2 Design Gráfico

O design gráfico atualmente contribui ativamente para a sociedade, solucionando problemas de comunicação visual presentes nos mais variados tipos de mídias. Diferentemente da publicidade que busca promoção de bens de consumo, o design gráfico cria uma linguagem visual baseadas em conceitos sempre buscando imaginar soluções de forma lógica e criativa.

Alves (2002 p.22), afirma que o design gráfico aponta para diversos caminhos, ele define:

“A mais óbvia delas é a do design gráfico – responsável pelas marcas e logotipos -, hoje cada vez mais sofisticado e complexo, e que se relaciona com a estratégia de construção da imagem de uma empresa. Já o design institucional lida com a identidade corporativa, gerando catálogos ou outros materiais impressos que devem estar em sintonia com essa imagem sem se tornar uma mera reprodução dos padrões estabelecidos. A seu lado encontra-se o design editorial, que projeta livro, revistas e jornais. Peça-chave num mercado altamente competitivo, o design de embalagem precisa levar em consideração as pesquisas de opinião dos consumidores na hora de “vestir” o produto, destacando-o dos demais concorrentes. Ele está intrinsecamente ligado ao design de material promocional, a quem cabe desenhar do cartaz de um filme ao brinde de fim de ano de uma empresa. Um projeto de sinalização, por sua vez, tem por objetivo otimizar ou viabilizar o funcionamento de shopping centers, supermercados, museus e hospitais. No âmbito do design ambiental, mantém um estreito relacionamento com a arquitetura do espaço que o contém.”

Page 33: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

31

2.3 Identidade Visual

É o meio de planejar estrategicamente a construção da imagem, quando ela adquire uma forma, podemos afirmar que ela possui uma identidade visual. Strunck (2001 p.57) afirma:

“A identidade visual é o conjunto de elementos gráficos que irão formalizar a personalidade visual de um nome, idéia, produto ou serviço. Esses elementos agem mais ou menos como as roupas e as formas de as pessoas se comportarem. Devem informar, substancialmente à primeira vista. Estabelecer como que os vê um nível ideal de construção.”

2.4 Marca

Segundo Aaker (1998, p.07), ele define marca como:

“[...] É um nome diferenciado e/ou símbolo (tal como um logotipo, marca registrada, ou desenho de embalagem) destinado a identificar os bens ou serviços de um vendedor ou de um grupo de vendedores e a diferenciar esses bens e serviços daqueles dos concorrentes. Assim, uma marca sinaliza ao consumidor a origem, do produto e protege, tanto o consumidor quanto o fabricante, dos concorrentes que oferecem produtos que pareçam idênticos.”

Uma marca, também tem função de identificar a promessa de benefícios, associada a bens ou serviços, que aumenta o valor de um produto além de seu propósito funcional. Outro aspecto importante de acordo com Strunck (2001) é que as marcas devem agregar benefícios emocionais a fim de serem memorizadas com mais facilidade ajudando nas escolhas que fazemos no dia-a-dia. Strunck (2001) também relaciona a marca a três tipos de classificações, elas pode ser do tipo:

• Figurativas: uma combinação de figuras, símbolos e sinais gráficos ou a forma particular para uma escrita composta por letras ou números.

• Nominativa: combinação de letras e números que possa ser identificada e compreendida, ou seja, a composição da marca é definida apenas de um nome.

• Mistas: junção das marcas nominativas e figurativas, formando deste modo uma composição com um logotipo e símbolo.

Page 34: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

32

2.5 Marcas dos principais concorrentes

Abaixo estão as marcas relacionadas ao mercado de construção civil da cidade de Chapecó que são concorrentes diretos da construtora Mattiello. Neste item são analisadas as formas, cores e gestalt das marcas de acordo com Gomes filho (2004) e suas características definidas por Strunck (2001) descritas no item 2.4.

1. Rotesma pré-fabricados

Figura 1.7 Rotesma Fonte: www.rotesma.com.br

Rotesma é uma marca do tipo nominativa, possui boa legibilidade, pois apresenta um bom contraste de cor com o fundo branco, simplicidade e unificação, pois as duas fontes estão dispostas de forma que transmitem equilíbrio. Sua fonte de corpo grande remete a uma marca de construtora, pois transmite segurança. 2. Construtora Nostra Casa

Figura 1.8 Nostra Casa Fonte: www.nostracasa.com.br

Do tipo figurativa, a marca da construtora Nostra Casa apresenta baixa leiturabilidade devido ao movimento que constitui o formato da fonte. Este movimento da tipografia não remete para uma marca de construtora, pois não transmite conceitos relacionados a construção civil.

Page 35: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

33

3. Santa Maria imóveis

Figura 1.9 Santa Maria Fonte: www.stmaria.com.br

Marca do tipo mista (logotipo e símbolo), apresenta problema de equilibrio em sua forma devido ao símbolo ser desproporcional, ocasionando em uma baixa pregnância, pois os elementos que formam a composição não estão organizados.

4. Construtora catarinense

Figura 2.0 Catarinense Fonte: www.construtoracatarinense.com.br

Ao observar a marca do tipo figurativa da construtora catarinense devido ao excesso de elementos gráficos e cores ela apresenta uma complicação visual, ocasionando em uma baixa legibilidade, leiturabilidade e pregnância.

2.6 Internet

Segundo Pereira (1999) em 1969 o Departamento de Defesa dos Estados Unidos da América (ARPANET) desenvolveu um sistema de rede capaz de trocar informações através de pacotes de dados entre computadores de bases militares do governo americano. Devido ao grande potencial de aplicações deste sistema de redes, a ARPANET rapidamente cresceu e se tornou a internet.

A internet a partir daí cresceu rapidamente em todo o mundo. Hoje milhões de usuários acessam a internet, trazendo deste modo, novas perspectivas para o comércio mundial e introduzindo ao design gráfico uma grande oportunidade de adequar estas perspectivas na forma de um web site.

Page 36: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

34

2.7 Websites

O website é uma mídia recente, mas pela facilidade de acesso a internet em todo o planeta fez que se tornasse um dos principais meios de marketing. Criou-se hábitos, por exemplo, é comum realizarmos algumas pesquisas na internet, antes de finalizarmos a compra de algum produto, ou simplesmente, conhecer determinadas empresas.

Percebe-se que há falta de interesse das empresas em usar essa mídia como um diferencial, na prática, elas apenas possuem um endereço na web onde estão dispostas algumas fotos e informações sobre a empresa. Enfim elas não se preocupam em manter um design atual e moderno para atrair novos clientes.

2.8 Web sites dos principais concorrentes Neste item serão apresentados e analisados os web sites dos principais concorrentes. 1. Rotesma pré-fabricados

Figura 2.1 Web site Rotesma – página inicial Fonte: www.rotesma.com.br

Page 37: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

35

O site segue as mesmas características da cor da marca, ou seja, são utilizados principalmente tons azuis na composição característica. O layout possui uma barra de navegação global no topo com as suas seções bem visíveis, abaixo localiza-se um banner demonstrando alguns conceitos da empresa com imagens em 3D de produtos . O conteúdo abaixo do banner apesar de haver uma separação através de um cercamento está mal diagramado e equilibrado. Algumas pequenas imagens de obras são apresentadas nesta parte no canto direito, porém, por não haver uma separação adequada dos conteúdos a usabilidade não é eficiente, pois não parece que estas pequenas imagens servem de thumbnails1

para a imagem maior do centro.

As tecnologias utilizadas no desenvolvimento do site são: Adobe Flash2 para a animação no topo e HTML3

.

2. Construtora Nostracasa

Figura 2.2 Web site Nostracasa – página inicial Fonte: www.nostracasa.com.br

1 Thumbnails são versões de imagens reduzidas que servem para ajudar na procura e reconhecimento da original. 2 Adobe Flash é um programa utilizado para produzir animações interativas para web sites. 3 HTML (HyperText Markup Language) é uma linguagem utilizada para produzir páginas na web.

Page 38: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

36

A primeira impressão ao acessar o site da empresa devido as formas utilizadas é que ele não remete ao site de uma construtora. O seu conteúdo, assim como a composição é bastante simples e apresenta algumas características apresentadas na marca, onde a parte do menu contém uma animação em flash simulando a mesma sensação de movimento. A tecnologia envolvida no site da construtora é Adobe Flash. 3. Santa Maria imóveis

Figura 2.3 Web site Santa Maria – página inicial Fonte: www.stmaria.com.br O principal problema observado no site da construtora Santa Maria é que o conteúdo do site está em desarmonia possuindo uma falta de alinhamento entre as imagens, mas o seu sistema de navegação segue um wireframe4

4 Wireframe segundo Memória (2005, p.36) “são um rascunho de uma tela específica que posiciona as informações e a navegação, incluindo-se aí agrupamento, ordem e hierarquia do conteúdo. É um esqueleto que organiza os elementos de interface, sem a interferência do projeto visual”.

padrão, contribuindo para uma boa navegação, porém

Page 39: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

37

está muito simples, as imagens estão apenas colocadas na página, observa-se portanto que não há preocupação com o seu design de diagramação. As tecnologias utilizadas são: Adobe Flash para o banner no topo e php5

4. Construtora Catarinense

.

Figura 2.4 Web site Catarinense – página inicial Fonte: www.construtoracatarinense.com.br

No site da construtora Catarinense observamos o mesmo problema da marca onde temos um excesso de elementos gráficos e informações acarretando em uma poluição visual e dificultando a navegação. A marca também está localizada no canto superior direito, lugar pouco comum e que pode prejudicar na rapidez de reconhecimento do site.

5 PHP é uma linguagem de programação utilizada para gerar conteúdo dinâmico

Page 40: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

38

As tecnologias utilizadas são Adobe Flash para as pequenas imagens do topo e a linguagem de programação é HTML.

2.9 Painéis semânticos

2.9.1 Público Alvo

De acordo com o briefing as imagens do painel semântico remetem a um público alvo com as seguintes características:

• Empresários da faixa etária entre 35 aos 60 anos.

• Famílias formadas por casais acima de 25 anos.

• Pessoas de ambos os sexos acima de 25 anos.

• Donos de fazendas com idades entre 30 aos 60 anos.

Figura 2.5 Painel semântico do público alvo Fonte: arquivo pessoal

Page 41: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

39

2.9.2 Expressão do produto

O conceito de qualidade busca interpretar a história da construtora Mattiello, que sempre se preocupou em construir as suas obras com um rigoroso controle de qualidade, desde a elaboração do projeto, supervisão da qualidade dos materiais, acompanhamento de engenheiros durante a fase de desenvolvimento até os mínimos detalhes de acabamento.

O conceito de simplicidade remete basicamente para o web site, com o objetivo de introduzir elementos gráficos simples.

O conceito de modernidade busca adequar o projeto nas tendências observadas em produtos quem são referências de design atuais.

Figura 2.6 Painel semântico da expressão do produto Fonte: Arquivo pessoal

Page 42: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

40

3. CONCEPÇÃO

A concepção é o momento em que todo o conhecimento adquirido nas etapas anteriores é colocado em prática. A partir daqui o projeto segue através de alternativas de solução do problema, para ao final se concretizar na escolha de uma alternativa. Seguem em ordem primeiramente as alternativas e escolha do redesign da marca e posteriormente as alternativas e escolha para o web site corporativo. Restrições impostas pelo cliente são respeitadas, estas que são: utilização de elementos gráficos da forma triangular e cor vermelha.

3.1 Geração de alternativas para o redesign da marca.

3.1.2 Alternativa 01

Figura 2.7 Alternativa 01 Fonte: Arquivo pessoal

Para esta alternativa, foram trabalhados os conceitos de qualidade e modernidade. A qualidade é fruto de um trabalho dando ênfase aos detalhes que estão representados no símbolo através das duas linhas vermelhas na diagonal, ou seja, é o detalhe que da a forma aos triângulos ao qual representam a letra M. A modernidade está presente na tipografia sem serifa e no uso do símbolo em perspectiva ambientado, ou seja, possuindo reflexos e sombras.

Page 43: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

41

3.1.3 Alternativa 02

Figura 2.8 Alternativa 02 Fonte: Arquivo pessoal

Basicamente os mesmos conceitos da alternativa anterior foram trabalhados nesta alternativa, más dando ênfase no conceito de simplicidade. O detalhe está presente no símbolo no triângulo do meio em vermelho, a modernidade na tipografia sem serifa e a simplicidade nos triângulos do símbolo também dando forma a letra M.

3.1.4 Alternativa 03

Figura 2.9 Alternativa 03 Fonte: Arquivo pessoal

Seguindo o conceito de simplicidade de forma mais direta, mantendo agora o início do sobrenome Mattiello como forma de triângulos e detalhado com a cor vermelha, conceitos de modernidade seguem com a tipografia, mas agora em caixa baixa e por um box de cor neutra cinza.

Page 44: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

42

3.1.5 Alternativa 04

Figura 3.0 Alternativa 04 Fonte: Arquivo pessoal

Para esta alternativa os conceitos de modernidade estão representados pela fonte sem serifa e com a letra “A”de forma simples, limpa e também como detalhe de cor vermelha.

3.1.6 Alternativa 05 – escolhida.

Figura 3.1 Alternativa escolhida e redução Fonte: Arquivo pessoal

3.1.7 Justificativa da alternativa escolhida e adequação

Tendo como objetivo a realização de apenas o redesign e não a criação de uma nova marca, esta foi a alternativa escolhida.

Com relação ao problema identificado na pesquisa de campo, em que o símbolo não remete a letra M, ficou estabelecido que embora o problema não foi resolvido, o símbolo da atual marca está de acordo com o conceito de simplicidade do projeto, e também é de fácil memorização, possui alta pregnância e remete para marca de uma construtora. Portanto a quantidade de atributos positivos justifica a permanência do atual símbolo no redesign.

Page 45: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

43

O redesign consistiu em mudar a tipografia para uma fonte também com caixa alta de corpo grande, sem serifas e com cor neutra cinza para atribuir modernidade. Ajustes de espaçamentos foram realizados retirando o aspecto antigo que a marca atual tem.

1. Adequação

Figura 3.2 Adequação da alternativa escolhida Fonte: Arquivo pessoal

Devido a baixa legibilidade na redução da alternativa escolhida a adequação consistiu em aumentar o tamanho da fonte da escrita “Pré – moldados – construtora” e modificar a porcentagem de black de 60 % para 70%.

Figura 3.3 marca atual Fonte: Arquivo pessoal

Fazendo uma breve comparação com a atual marca da construtora, fica evidente a mudança positiva que esta recebeu. Exceto o símbolo, os conceitos estabelecidos durante a pesquisa não são percebidos nessa marca, principalmente em sua tipografia, que, junto com os excessos de espaçamentos parecem antigos.

Page 46: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

44

3.2 Geração de alternativas para o web site da construtora.

Foram gerados 3 alternativas para o web site. Um wireframe padrão com barra de navegação global e local foi seguido em todas as alternativas das seções (quem somos, produtos e obras por segmento). O wireframe segue a mesma linha do conceito de simplicidade, ou seja, a navegação é bastante favorável para todos os públicos, pois é de fácil utilização. Este wireframe também é ideal para o público-alvo do projeto, que consiste na maioria sendo empresários acima de 30 anos.

A home segue um padrão distinto de wireframe entre as 3 alternativas, principalmente na alternativa 01.

Figura 3.4 Wireframe padrão das seções Fonte: Arquivo pessoal

Page 47: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

45

3.2.1 Alternativa 01.

Figura 3.5 Alternativa 01 - Home Fonte: Arquivo pessoal

Esta alternativa foi baseada principalmente no conceito de modernidade, pelo fato de possuir uma navegação diferenciada e um plano em perspectiva, utilizando de elementos gráficos em 3D que servem como botões.

A ambientação do cenário em 3D remete a simplicidade pelas poucas cores e pelos elementos gráficos representados (casa, prédio, barracão e estrutura pré-moldada), ao qual não possuem detalhes, por exemplo, os prédios sem janelas, a fim de apenas simular a realidade e não retratar de forma real.

Seguindo as mesmas características de cor da marca, as cores do layout também são em tons de cinza e vermelho.

Page 48: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

46

Abaixo estão duas imagens que mostram como a animação da página inicial funciona.

Figura 3.6 Alternativa 01 - Obras por segmento Fonte: Arquivo pessoal

Figura 3.7 Alternativa 01- Produtos Fonte: Arquivo pessoal

Page 49: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

47

Como mostram as figuras 3.6 e 3.7, a interface da página inicial é animada em flash e programada como botões, de modo que, quando o mouse passa por cima da imagem desejada ela se move para o primeiro plano, alterando também o nome da seção selecionada logo abaixo.

Figura 3.8 Alternativa 01 - página de produtos Fonte: Arquivo pessoal

De modo simples, ao escolher a seção desejada, uma barra de navegação local surge com todos os itens disponíveis na página, o conteúdo é carregado ao lado desta barra, fazendo com que o usuário não se “perca” e tenha um rápido aprendizado sobre o sistema do web site durante o uso.

A alternativa possui fundo branco para que as fotos e os textos fiquem em destaque e um simples triângulo indica qual é o item selecionado.

Page 50: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

48

Figura 3.9 Alternativa 01 - Quem somos Fonte: Arquivo pessoal

Utilizando da comparação em que qualidade é detalhe, como mostram as figuras abaixo, em cada seção a cor que mais se destaca na foto principal é também inserida na pequena barra localizada abaixo do menu.

Figura 4.0 Alternativa 01 - Detalhe home Fonte: Arquivo pessoal

Page 51: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

49

Figura 4.1 Alternativa 01 - Detalhe produtos Fonte: Arquivo pessoal

Figura 4.2 Alternativa 01 - Detalhe quem somos Fonte: Arquivo pessoal

Page 52: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

50

3.2.2 Alternativa 02 – escolhida.

Figura 4.3 Alternativa 02 - home Fonte: Arquivo pessoal

Nesta alternativa foi agregada uma maior ênfase nas obras em destaque da construtora, sejam elas em construção, concluída e também em um produto dos pré-moldados. A marca segue alinhada no topo e ao centro, entre duas imagens, ficando em um espaço de destaque. Para facilitar a usabilidade, a barra de navegação global também está no topo e ao centro.

Seguindo a linha da simplicidade, para separar o conteúdo do site, utilizam-se linhas básicas e apenas um triângulo seguido pelo texto. As cores seguem o padrão cromático da marca, que são vermelho e cinza.

Aproveitando a página inicial como propaganda, mas com menos destaque, está no rodapé uma pequena seção onde o usuário ao passar o mouse por cima a imagem da marca ganha cor e ao clicar, será aberta uma nova página direcionando para os sites das respectivas marcas.

Page 53: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

51

3.2.3 Justificativa da alternativa escolhida.

Figura 4.4 Casal Fonte: http://www.shutterstock.com

Definido nas pesquisas que os clientes conhecem a construtora através de indicação, esta imagem remete para a satisfação do cliente ao ver a sua obra concluída com qualidade e a partir daí ele indica esta experiência para os amigos, parentes, colegas de trabalho etc.

Figura 4.5 Projeto Fonte: http://www.sxc.hu

A imagem do projeto remete para planejamento da obra antes começar a construí-la, passo fundamental para realizar serviços com qualidade.

Através dos significados da imagem, uso do conceito de simplicidade representado através de elementos gráficos simples e cores que remetem a modernidade e são similares a da marca, esta alternativa se identifica melhor com o conceito do projeto e atende ao público-alvo por utilizar de uma navegação simples através de um wireframe padrão.

Page 54: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

52

3.2.4 Páginas internas.

As páginas internas são compostas pelo mesmo wireframe padrão, onde a barra de navegação local está ao canto direito precedida pelo mesmo item selecionado na barra de navegação global, seguidos por todos os itens de cada seção. O conteúdo do item selecionado é carregado ao lado.

1. Produtos

De modo simples o usuário pode conferir algumas fotos dos produtos e também uma descrição. Os dados técnicos são mostrados para que o usuário saiba qual é a medida do produto etc.

Figura 4.6 Alternativa 02 - Produtos Fonte: Arquivo pessoal

Page 55: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

53

2. Quem somos

Nesta seção o conteúdo é o resumo da história da construtora. Seguindo com o conceito de simplicidade, o conteúdo segue o padrão da home, ou seja, é separado pelos triângulos vermelhos seguido pela frase de titulo .

Figura 4.7 Alternativa 02 - Quem somos Fonte: Arquivo pessoal

Page 56: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

54

3. Obras por segmento

Esta página apresenta o segmento de edifícios em andamento e os concluídos pela construtora, segue o mesmo padrão das outras páginas. Foi utilizada uma moldura para separar as fotos de cada obra para ajudar na visualização e navegação e de maneira simples seguindo o padrão da home, as legendas das fotos estão apresentadas apenas por textos.

Figura 4.8 Alternativa 02 - Obras por segmento Fonte: Arquivo pessoal

Page 57: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

55

4. Edifício escolhido

Ao clicar na obra desejada o usuário pode conferir varias fotos do empreendimento, além de visualizar a planta e consultar as informações de localização e dados técnicos. Um botão de voltar foi inserido ao canto superior direito, para que o usuário possa escolher outro edifício na página anterior.

Figura 4.9 Alternativa 02 – Segmento escolhido Fonte: Arquivo pessoal

Page 58: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

56

3.2.5 Alternativa 03

Na terceira alternativa, foram trabalhados conceitos de modernidade pelo projeto dos prédios em 3D ao fundo e simplicidade pelo fato de o design ser limpo. Esta alternativa tem dimensões menores com que as outras, possui 930 pixels de largura e segue um alinhamento central quando vistas com uma resolução a partir de 1024 x 768 pixels. Este alinhamento é para que a textura ao fundo também seja vista dando aspecto moderno.

Figura 5.0 alternativa 03 - Home Fonte: Arquivo pessoal

Figura 5.1 Alternativa 03 – Textura de fundo Fonte: Arquivo pessoal

Page 59: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

57

3.2.6 Páginas internas

As páginas internas seguem o padrão de wireframe das alternativas anteriores, mas também trabalhando com o conceito de simplicidade dando ênfase nas fotos e conteúdo.

1. Obras por segmento.

Com design limpo e simples para que o usuário consiga se localizar e navegar facilmente, os itens estão separados por apenas textos.

Figura 5.2 Alternativa 03 – Obras por segmento Fonte: Arquivo pessoal

Page 60: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

58

Como mostra a figura abaixo para separar os conteúdos cada foto, titulo e seções são compostas por caixas e alinhadas de modo em que fiquem separadas por pequenas distâncias, formando linhas que ficam em evidência pela imagem abaixo.

Figura 5.3 Alternativa 03 – Detalhes Fonte: Arquivo pessoal

Page 61: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

59

2. Segmento escolhido – edifício

Esta página segue o padrao das anteriores, dando enfase para as imagens e conteúdo sendo de facil navegação.

Figura 5.4 Alternativa 03 – Segmento escolhido Fonte: Arquivo pessoal

Page 62: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

60

4.0 MEMORIAL DESCRITIVO DO PROJETO

Neste capítulo reúnem-se todas as análises técnicas envolvidas no projeto.

4.1 Função estético formal do projeto de redesign da marca

Figura 5.5 Marca Fonte: Arquivo pessoal

4.1.2 Cor

A escolha da cor foi fundamental para o redesign da marca da Construtora Mattiello.

Segundo Farina (2000, p.27):

(...) a cor é uma linguagem individual. O homem reage a ela subordinado às suas condições físicas e às suas influencias culturais. Não obstante, ela possui uma sintaxe que pode ser transmitida, ensinada. Seu domínio abre imensas possibilidades aos que se dedicam ao estudo dos inúmeros processos de comunicação visual.

A cor vermelha do símbolo foi mantida, pois é uma das restrições do cliente. Porém, apesar da restrição, vermelho é uma cor que chama a atenção, justificando a sua permanência de acordo com Pedrosa (1999, p. 107), a cor vermelha possui alto grau de cromaticidade e é a mais saturada das cores, decorrendo daí sua maior visibilidade em comparação as demais.

A figura abaixo mostra as especificações sobre a cor vermelha utilizada no símbolo:

Figura 5.6 Cor do símbolo Fonte: Arquivo pessoal

Page 63: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

61

De acordo com Guimarães (2000, p.76) a utilização do vermelho com o cinza cria uma harmonia cromática, ele afirma:

Uma construção harmoniosa está sempre em equilíbrio, embora uma composição equilibrada nem sempre siga as regras de harmonização. Podemos afirmar que harmonia é um sistema de regras coerente e lógico cujas partes componentes formam um todo uniforme e no qual todas as tensões obtidas nas relações e proporções da composição contribuem para o resultado pretendido: que todas as cores possam ser identificadas sem que o todo se desfaça.

Portanto, a mudança das cores da fonte ocorreu no sentido de retirar os excessos de vermelho presente na marca como um todo, mudando a cor para cinza, remetendo a uma tonalidade neutra, adquirindo um bom contraste, harmonia e equilíbrio entre as duas cores do símbolo e da fonte.

As figuras abaixo mostram as especificações sobre a cor cinza da fonte:

Figura 5.7 Cor da fonte Fonte: Arquivo pessoal

4.1.3 Tipografia

Florencesans Black é a fonte do nome Mattiello, possui corpo grande remetendo ao conceito de segurança e qualidade, que é fundamental para marca da construtora e não possui serifa para atribuir modernidade na composição.

Helvetica é a fonte utilizada nas duas palavras Pré-moldados e construtora, estão dispostas como legendas em segundo plano e servem para identificar os serviços da empresa, possuem um tamanho menor e um corpo mais fino para não interferir na legibilidade do nome Mattiello.

Page 64: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

62

Figura 5.8 Fonte Helvetica Fonte: Arquivo pessoal

Figura 5.9 Fonte Florencesans Fonte: Arquivo pessoal

4.1.4 Tipografia padrão

Tunga deve ser utilizada para padronizar o uso de uma única fonte em materiais gráficos (flyer, cartão, etc.), a escolha desta fonte é justificada devido a boa legibilidade que possui e por não possuir serifa atribuindo modernidade nas composições.

Figura 6.0 Tipografia padrão Fonte: Arquivo pessoal

Page 65: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

63

4.1.5 Gestalt

A Gestalt é um fenômeno da percepção que acontece através da excitação cerebral ao visualizar alguma forma, porém, este processo não acontece de forma isolada, mas em relações, ou seja, uma parte depende de outra parte (Gomes, 2004).

Pode-se perceber isso ao observar a imagem abaixo, vemos uma ilusão de ótica, isso acontece, pois o cérebro processa a informação como um todo e não em partes, se o processo ocorresse em partes veríamos que as linhas horizontais não são curvas como aparentam ser.

Figura 6.1 Ilusão de ótica Fonte: www.hipescience.com

Estes fenômenos da percepção de acordo com Gomes Filho (2004) são compostos por forças na maneira em como se estruturam as formas que são: unidade, segregação, unificação, fechamento, continuidade, proximidade, semelhança e pregnância da forma, podemos observar estas forças na marca em que:

• Unidade: Conjunto de mais de um elemento formando um “todo”, ou seja, o próprio objeto está presente na marca de modo que os três triângulos formam o todo, ou seja, constituindo o símbolo em uma unidade.

• Segregação: Capacidade perceptiva de separar, identificar, evidenciar ou destacar unidades formais em um todo compositivo ou em partes deste todo. É perceptível na marca uma unidade segregada através dos três triângulos, nas letras da fonte e na linha que separa Mattiello de Pré-moldados.

• Unificação: Consiste na igualdade ou semelhança dos estímulos produzidos pelo campo visual, pelo objeto. Fica evidente ao observarmos o símbolo ao qual a unificação está presente devido aos triângulos serem idênticos e atribuindo equilíbrio de forma organizada devido a disposição quem eles se encontram.

• Fechamento: Fator importante para formação de unidades. Está presente no símbolo, pois os três triângulos estão em ordem estrutural definida, portanto vistos como uma unidade.

Page 66: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

64

• Continuidade: organização perceptiva na forma de modo coerente. Como o significado do símbolo é que os três triângulos representam peças em uma construção, o modo em que eles estão dispostos apresenta continuidade, uma variação dentro de um padrão é seguida, portanto com continuação.

• Proximidade: elementos ópticos próximos uns dos outros tendem a ser vistos juntos. Novamente no símbolo através dos triângulos que estão próximos eles tendem a serem vistos juntos.

• Semelhança: dois agrupamentos de partes semelhantes são observados, nos três triângulos do símbolo e nas letras da fonte. São semelhantes devido a cor e forma.

• Pregnância da forma: a marca apresenta boa pregnância devido a um equilíbrio central e um mínimo de complicação visual através de uma fonte legível e um símbolo simples.

4.1.6 Função simbólica

Os espaços em branco do símbolo representam a letra M da primeira letra do próprio nome da construtora Mattiello. Os três triângulos estão dispostos de modo que se encaixem como peças representando uma construção.

Analisando através da semiótica, que é ciência que estuda os processos de interpretação dos signos e de acordo com Santaella (1998), ela afirma que semiótica divide os signos em modalidades que são ícone, índice e símbolo:

• Ícone: quando o objeto referido aparece como simples qualidade, ou seja, quando o signo deixa livre as possibilidades de sua interpretação.

• Índice: quando o signo representa um indicativo do objeto, por exemplo, pegadas na areia indicando que houve uma caminhada pela mesma.

• Símbolo: um símbolo compõe-se quando representa por convenção seu objeto, por exemplo, a convenção geral de que o semáforo vermelho indica pare, e verde indica siga.

Ainda segundo Santaella (1998) os níveis de leitura que são responsáveis por relatar o modo como os fenômenos aparecem à consciência são:

• Primeiridade: refere-se à primeira impressão, primeira leitura de um signo, desprovida de qualquer raciocínio lógico sobre o mesmo.

• Secundidade: diz respeito à sensação provocada pelo signo.

• Terceiridade: diz respeito à interpretação lógica dos signos, à ligação entre o signo e sua representação.

Page 67: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

65

Após rever esses conceitos básicos de semiótica, pode-se fazer uma análise da marca desenvolvida:

• Logotipo: a denominação “Mattiello”, encontra-se na terceiridade, pois, semioticamente é um signo que o indivíduo entende diretamente seu significado devido a influência cultural adquirida.

• Símbolo: os três triângulos se classificam na secundidade, pois apresenta apenas uma sensação e não uma interpretação lógica e é um ícone, pois deixa livre as possibilidades de sua interpretação.

4.1.7 Função Técnica

Neste capítulo serão tratadas algumas especificações técnicas com relação a marca.

Para criação da marca e as suas especificações que estão no manual de aplicação foi utilizado Corel Draw. Programa de criação de imagens em forma de vetor.

O Manual tem como finalidade informar e servir de base para a consolidação dos padrões de utilização da marca Mattiello. Desta forma, o uso coerente e sistemático das definições contidas no manual ajudarão a reforçar a uniformidade visual e a imagem da construtora. Limites da marca Deve ser respeitada uma margem de segurança da marca (área de não interferência de outros elementos) demonstrando pelo quadrado da mesma altura da letra “O” que circunda a marca, para não haver invasão de outros elementos gráficos.

Figura 6.2 Limites da marca

Fonte: Arquivo pessoal

Page 68: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

66

Aplicação em P&B Esta aplicação é usada em situações em que a marca não possa ou não deva ser impressa em cores (por questões de redução de custos, por exemplo).

Figura 6.3 Aplicação em P&B

Fonte: Arquivo pessoal

Malha construtiva A malha construtiva apresenta a disposição dos elementos que integram a marca, de modo a facilitar a sua reprodução e aplicação em grandes proporções.

Figura 6.4 Malha construtiva

Fonte: Arquivo pessoal

Page 69: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

67

Redução A marca poderá ser reduzida de acordo com a necessidade, observado o limite máximo de redução de 2,6cm de largura por 1,0cm de altura.

Figura 6.5 Redução

Fonte: Arquivo pessoal

Dimensionamento São estabelecidas as relações de proporção através da maior medida neste caso sendo 100,00 mm, para fins de ampliação ou redução.

Figura 6.6 Dimensionamento

Fonte: Arquivo pessoal

Page 70: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

68

Aplicação em fundo colorido Em casos de fundo colorido, a marca e o texto devem ser aplicadas em branco. O importante nessa situação é que o nome continue legível.

Figura 6.7 Fundos coloridos

Fonte: Arquivo pessoal

Uso incorreto da assinatura visual Com o objetivo de manter a integridade visual da marca e da empresa, apresentamos aqui algumas formas que não devem ser utilizadas para apresentação da marca.

Figura 6.8 Uso incorreto Fonte: Arquivo pessoal

Page 71: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

69

Aplicação em monocromia Para impressões em uma única cor (por questão de redução de custo ou limitação técnica). É aconselhável evitar cores diferentes do cinza, preto e vermelho nesse tipo de aplicação, afim de preservar a integridade da marca.

Figura 6.9 monocromia Fonte: Arquivo pessoal

Aplicação em escala de cinza Adequada para publicações impressas integralmente em tons de cinza (graduação do preto ao branco). Esta versão deve ser utilizada sempre na cor preta e será aplicada naquelas situações em que as limitações de reprodução impeçam outra opção. Admite-se, excepcionalmente, a utilização de outra cor se essa for a única cor no processo de impressão.

Figura 7.0 Escala de cinza

Fonte: Arquivo pessoal

Page 72: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

70

4.2 Função estético formal do projeto web site.

A estética é uma parte fundamental do web site, são princípios de design que são aplicados de forma apropriada para as características do usuário, neste capítulo serão analisadas as formas que constituem o web site, e também as tecnologias envolvidas e a sua função de marketing. 4.2.1 Cores Para ajudar na identificação e memorização do web site, as cores utilizadas são padrões cromáticos semelhantes a da marca, ou seja, igual para vermelho e variações de cinza sobre fundo branco, são cores boas para serem trabalhadas e de acordo com Gomes Filho (2004) elas funcionam como um elemento de peso e são empregadas para expressar e reforçar a informação visual. Podemos observar o uso das cores no web site com o objetivo de:

• Manter contraste entre as cores do fundo com a dos textos, facilitando a legibilidade.

• Contraste entre cores claras-escuras e quentes-frias, através de elementos gráficos para separar os conteúdos das seções e em molduras nas fotos, funcionando como elementos do peso para equilibrar a composição do layout.

• Contraste de proporção e escala em que um maior peso visual está concentrado na parte do conteúdo do site, contrastando com o topo de forma clara, com o objetivo de separar as seções e facilitar a navegação.

• Manter uma identidade visual em relação a marca.

Figura 7.1 Principais cores utilizadas Fonte: Arquivo pessoal

Page 73: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

71

Aproveitando das características do símbolo, e tendo em vista uma melhor separação e identificação dos conteúdos das páginas internas, a cor vermelha foi utilizada nos triângulos que separam o conteúdo (figura 7.2). A cor vermelha, como foi dito anteriormente, segundo Pedrosa (2000) é a cor que mais se destaca visualmente e a mais rapidamente distinguida pelos olhos, ajudando, portanto na localização de cada subtítulo.

Figura 7.2 Subtítulos Fonte: Arquivo pessoal

4.2.2 Formas

Como as páginas internas do web site seguem um mesmo padrão, as formas analisadas são apenas de uma seção, a de produtos. Observando a composição de modo geral de acordo com Gomes Filho (2004), a simplicidade das formas atribuem clareza, ele afirma que:

“Manifestações visuais bem organizadas, unificadas e, portanto, harmoniosas e equilibradas, apresentam uma tal ordem que se traduz em clareza, do ponto de vista de decodificação e compreensão imediata do todo. A clareza pode se manifestar, independentemente de o objeto apresentar uma estrutura formal simples – com poucas unidades -, ou complexa – com muitas unidades compositivas. É uma técnica muito funcional, sobretudo onde se exige facilidade de leitura e rapidez na decodificação e/ou compreensão imediata do objeto”.

A clareza também é atribuída pela ordem da estrutura simples do seu wireframe ao qual segrega-se em duas unidades principais retangulares, a primeira sendo o topo e a segundo a parte do conteúdo.

Page 74: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

72

A composição do topo é equilibrada, com boa distribuição dos pesos visuais. Nesta parte segrega-se em cinco unidades principais: as duas imagens de fundo, a marca ao meio, a barra de navegação global e a linha composta por um triângulo que serve para separar o conteúdo.

Figura 7.3 Topo Fonte: Arquivo pessoal

A parte do conteúdo segrega-se em três unidades principais: os textos, os elementos gráficos simples formados por triângulos e linhas e as molduras retangulares e fotos. As formas estão dispostas em equilíbrio e bem separadas atribuindo clareza na composição, além de contribuir para o fator funcional da navegação.

Figura 7.4 Conteúdo Fonte: Arquivo pessoal

Page 75: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

73

4.2.3 Tipografia

Os layouts receberam 2 tipos de fontes, uma para os textos e outra para números.

Para os textos foi utilizada a fonte Corbel, esta foi definida após estudos e se adequou com a proposta do projeto, pois não possui serifa atribuindo modernidade e é de fácil legibilidade. Para os números a fonte escolhida foi Helvética, seguindo o padrão da marca, que também possui esta fonte.

Figura 7.5 Fonte Helvetica para números Fonte: Arquivo pessoal

Figura 7.6 Fonte Corbel Fonte: Arquivo pessoal

4.2.4 Gestalt Podemos verificar de acordo com Gomes Filho (2004) que o projeto apresenta os seguintes princípios da Gestalt:

• Unidade - o web site da construtora é uma unidade dentro da conceituação mais ampla.

• Segregação - o web site segrega-se em três unidades principais: o fundo, topo e conteúdo.

• A unificação - é observada uma coerência da linguagem visual ou estilo formal das partes no: wireframe padrão em todas as seções com exceção da página inicial que possui uma modificação na parte do conteúdo e elementos gráficos triangulares semelhantes em todas as seções, estes elementos também mantém uma relação de unificação com o símbolo da marca.

• Fechamento - através da ordem estrutural do wireframe em todas as seções, o web site possui fechamento visual.

• Continuidade - não há quebra de fluidez na usabilidade, ou seja, o uso de uma barra de navegação global localizada no topo de forma fixa evita interrupções, por exemplo, os elementos textuais que identificam as seções acompanham uns aos outros devido a

Page 76: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

74

sua forma, cor e separação, portanto, atribuindo continuidade na forma de todo web site.

• Proximidade - formas triangulares próximas e semelhantes constituem uma unidade que significa separação do conteúdo. A proximidade está relacionada também através das molduras das fotos constituindo uma unidade característica do site.

• Semelhança - é utilizada a semelhança de cores e formas do símbolo da marca no web site contribuindo para uma boa unificação do objeto, ou seja, mantendo uma identidade visual.

4.2.5 Função simbólica Os símbolos estão relacionados com o usuário para a representação do elemento. Baxter (1998, p.150) afirma que “descrever o simbolismo do produto significa descrever os valores pessoais e sociais incorporados à aparência do produto”.

Figura 7.7 Função simbólica do topo

Fonte: Arquivo pessoal

Portanto, como a maioria das pessoas que conhecem a construtora através de indicação, os valores simbólicos estão agregados principalmente nas duas imagens do topo criando desta forma uma relação de familiaridade com o usuário e de acordo com Santaella (1998) analisando através da semiótica, esta relação denomina-se na secundidade, pois as imagens apresentam uma sensação, que são as relações pessoais e sociais da construtora. Também a relação está empregada através dos elementos gráficos triangulares semelhantes ao da marca, uma relação de simbolismo onde por convenção estas formas servem como setas indicando os itens das duas barras de navegação e também de forma a separar os conteúdos do site.

Page 77: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

75

4.2.6 Ergonomia Os aspectos ergonômicos do web site estão de acordo com as recomendações descritas por Lida (1990) ela afirma que os tamanhos, proporções e cores usados em letras, números e símbolos influem na legibilidade da forma. Podem-se observar as seguintes características:

• Legibilidade - são utilizadas fontes de traços simples e uniformes contrastando entre cinza escuro com cinza claro permitindo boa legibilidade.

Figura 7.8 Contraste

Fonte: Arquivo pessoal

• Símbolos - através de processos cognitivos de identificação e interpretação a interface apresenta símbolos em forma de setas simples com o objetivo de percepção, separação, facilidade de aprendizado, memorização e organização dos itens do menu e conteúdo. Memória (2005, p.107), ele afirma que representações que utilizam setas tem maiores chances de serem compreendidas com rapidez.

Figura 7.9 Setas

Fonte: Arquivo pessoal

• Contornos fortes - as imagens do site possuem contornos bem definidos atraindo a atenção do usuário.

Figura 8.0 Contornos

Fonte: Arquivo pessoal

• Simplicidade - o layout do web site possui uma estrutura e elementos gráficos simples para serem mais facilmente percebidos.

Page 78: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

76

• Estabilidade da forma - as imagens, elementos gráficos e o fundo do web site não permitem interpretações dúbias, ou seja, não acontece confusão entre estas imagens, pois estão bem separadas.

Figura 8.1 Separação das imagens

Fonte: Arquivo pessoal

Portanto, o relacionamento do usuário com a interface é interpretado no projeto através da facilidade de navegação em uma estrutura simples, de acordo com Vidal (2002, p.54) o sistema apresenta boa orientabilidade, ou seja, o uso de um wireframe padrão e elementos gráficos na forma de setas orienta o usuário a encontrar facilmente as informações que procura e também devido aos textos legíveis e bem diagramados com o objetivo de melhorar o entendimento do conteúdo o sistema minimiza possíveis erros de navegação. 4.2.7 Usabilidade O formato do layout foi desenvolvido com o objetivo de possuir uma arquitetura de informação simples e funcional para todo perfil de usuário.

Com base nos critérios de Nielsen (2000), ele afirma que a usabilidade pode ser dividida em cinco critérios básicos que são a Intuitividade: o sistema deve ser de simples aprendizado para que o usuário comece a trabalhar rapidamente, Eficiência: o usuário deve atingir alto nível de produtividade, Memorização: o usuário não pode aprender a utilizar a interface novamente, Erro: taxas de erros devem ser baixas para que os usuários cometam poucos erros durante a utilização e Satisfação: o sistema deve ser agradável de ser usado para que os usuários fiquem satisfeitos ao utilizá-lo.

Observam-se os critérios na interface do projeto que possui as seguintes características:

• Eficiência - as informações do conteúdo estão separadas e orientadas por elementos gráficos básicos da forma triangular que funcionam como setas e cada título das seções possui fonte de tamanho maior, deste modo, apresentando o conteúdo de forma eficiente. Nielsen (2000, p.100) afirma que:

Page 79: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

77

“Os estudos de usabilidade indicam um violento foco no conteúdo por parte dos usuários. Quando chegam a uma nova página, olham imediatamente para a principal área de conteúdo da página e buscam títulos e outras indicações do teor da página”.

Figura 8.2 Título do conteúdo

Fonte: Arquivo pessoal

• Memorização - o uso de um wireframe padrão é bastante conhecido, ou seja, o seu sistema de navegação já está na memória de grande parte dos usuários. Molduras para separar as fotos, seguidas por legendas criam uma característica no site, fazendo com que usuários mesmo após um intervalo de tempo consigam utilizá-lo.

• Intuitividade - a utilização de uma barra de navegação global de forma horizontal localizada no topo da página segundo Memória (2005, p.68) facilita e torna intuitiva a utilização da navegação local que por sua vez está localizada da esquerda para direita, um modo tradicional, portanto facilitando a usabilidade e adequando o projeto a um público com pouca experiência.

• Erro - a simplicidade e a estrutura bastante utilizada de um wireframe padrão do projeto contribui para minimizar os erros de usabilidade evitando transtornos, Memória (2005, p.58) também afirma que:

“A solução usada pela maioria está diretamente relacionada a conceitos de psicologia cognitiva, como facilidade de aprendizado e memorização. Quando utilizamos soluções consagradas, diminuímos as chances de dúvida e, conseqüentemente, de erro por parte das pessoas que estão utilizando o produto”.

• Satisfação - o site atende a todo perfil de usuários, que podem ser novatos, intermediários ou experientes, pois apresenta uma estrutura simples, uma navegação fácil e conteúdo bem separado, permitindo um maior índice de satisfação.

Page 80: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

78

A simplicidade do projeto está agregada também ao conteúdo, por exemplo, para descrever o produto torre para caixa d’água, foi utilizado um breve texto com as especificações que são necessárias ao cliente e também na seção quem somos que relata a história da construtora, o texto está retratado de forma resumida, pois, Nielsen (2000, p.101), afirma que ler na tela do computador é cerca de 25 por cento mais lento do que ler no papel, segundo ele:

“Mesmo os usuários que desconhecem essas pesquisas sobre fatores humanos geralmente dizem que sentem desconforto ao lerem texto on-line. Portanto deve-se escrever 50 por cento menos texto não apenas 25 por cento menos, pois não se trata apenas da velocidade de leitura, mas de uma questão de conforto. Sabemos que os usuários não gostam de rolar a tela: mais uma razão para manter a brevidade das páginas”.

Figura 8.3 Breve texto

Fonte: Arquivo pessoal

As estruturas das interfaces do projeto, de modo geral, estão de acordo com o conceito de simplicidade, contribuindo para uma usabilidade intuitiva e permitindo a navegação de usuários com pouca experiência, portanto é adequada ao público alvo da construtora. 4.2.8 Tecnologias Adobe Fireworks foi a tecnologia utilizada para a diagramação e alinhamento das imagens e também na criação das formas vetoriais que estruturam o site e na criação de elementos gráficos componentes (formas triangulares, linhas e moldura para as fotos). Adobe Photoshop foi utilizado para tratamentos das imagens. Para as interfaces poderem atuar como foram planejadas, elas devem ser programadas em PHP, pois o sistema necessita ser atualizado freqüentemente. As vantagens do PHP ainda permitem que através de um sistema de intranet programado para ser fácil de usar, o cliente não precisa possuir conhecimentos avançados para atualizar o site, mostrando-se ideal para que qualquer pessoa da empresa possa atualizar o site. As páginas podem ser visualizadas a partir da resolução 800 x 600 pixels, mas com perda de informações, portanto, para uma melhor visualização é aconselhada uma resolução de 1024 x 768 pixels.

Page 81: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

79

4.2.9 Marketing Em si a criação do web site serve como uma ação de marketing, pois a construtora Mattiello ao publicar os seus produtos e obras na internet adota uma nova tecnologia de fácil acesso com o objetivo de transmitir confiança através do seu portfólio. De acordo com Gracioso (2002, p.65) esta é uma estratégia de marketing de relacionamento do modo produtivo, ou seja, o cliente adquire convicção de que a construtora será capaz de atender as suas necessidades atuais e futuras. O web site é uma maneira de comunicação massiva, atinge milhares de pessoas em todo o mundo, aproveitando e percebendo esta oportunidade a página inicial apresenta estratégias de marketing que consiste na divulgação de duas empresas pertencentes ao grupo Mattiello.

Figura 8.4 Empresas do grupo

Fonte: Arquivo pessoal

Segundo Gracioso (2002, p.87) a estratégia de marketing do site é através de uma comunicação dirigida, ou seja, são formas de comunicação para alvos específicos, ele cita alguns exemplos deste tipo de comunicação:

Por exemplo, os sócios de um clube esportivo ( que podem ser atingidos por meio de anúncios ou encartes no noticioso mensal), ou os alunos de uma escola. Uma revendedora de máquinas agrícolas, por exemplo, pode preparar folhetos destinados especificamente às cooperativas agrícolas de sua região. E assim por diante.

Portanto, a estratégia consiste numa propaganda do site ao qual é destinada a um público que tem relação com a construtora, pois são empresas do mesmo dono e de áreas semelhantes a da construção devido ao forro de PVC e a caixa d’água serem produtos componentes de uma obra, ela tem como objetivo atrair usuários a conhecerem as outras empresas do grupo e seus produtos.

Page 82: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

80

5. CONSIDERAÇÕES FINAIS

As pesquisas realizadas durante a fase de contextualização, o questionário aplicados aos clientes da construtora em Chapecó e os conceitos levantados para inspiração, foram aspectos de grande valor para criação do projeto.

Ambos os objetivos foram atingidos tanto do redesign da marca como a criação do web site e a sua estrutura ficaram dentro das necessidades do público-alvo da construtora, porém faltou tempo para um melhor aprimoramento da interface em 3D, presente na primeira alternativa.

Outros projetos podem ser desenvolvidos a partir desta pesquisa, um deles é a criação de um sistema na seção de obras por segmento, onde o cliente pode visualizar o andamento de sua obra em 3d e também além de fotos, utilizar vídeos para visualizar como anda sua obra com maior riqueza de detalhes. Outro projeto é criar toda identidade corporativa da empresa, principalmente dando ênfase em um fator levantado nas pesquisas que é o principal meio de divulgação da empresa, a indicação e as placas colocado nas obras.

Por fim, cabe ressaltar que a implantação deste projeto será de fundamental importância para redefinir o valor da marca da construtora, pois, alem de destacar a empresa diante de seus concorrentes, novos públicos poderão conhecer a construtora através do web site de modo mais fácil e prático, podendo assim tornar-se futuros clientes da construtora Mattiello.

Page 83: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

81

6. REFERÊNCIAS

Bibliográficas:

ALVES, Marcus Vinicius Barili. Campos de trabalho do designer gráfico. In: ______. O valor do design : guia ADG Brasil de prática profissional do designer gráfico. 3. ed. São Paulo: Senac, 2004. p.27-30. BAXTER, M. - Projeto de Produto - Guia Prático para o Desenvolvimento de Novos Produtos - São Paulo, Editora Edgar Blücher, 1998 FARINA, Modesto. Psicodinâmica das cores em comunicação. São Paulo: Ed. Edgard Blucher

LTDA, 1994.

GOMES Filho, João. Gestalt do Objeto: Sistema de leitura visual da forma. São Paulo: Escrituras, 2004.

GRACIOSO, Francisco. Propaganda: engorda e faz crescer a pequena empresa. São Paulo:

Atlas, 2002.

GUIMARÃES, Luciano. A cor como informação: a construção biofísica, lingüística e cultural da simbologia das cores. São Paulo: Editora Annablume, 2004

IIDA, Itiro. Ergonomia: projeto e produção. São Paulo: Editora Edgar Blücher, 2002.

MARCONI, Marina de Andrade / LAKATOS, Eva Maria. Técnicas de pesquisa. 4.ed. São Paulo : Atlas, 1999.

MEMÓRIA, Felipe. Design para Internet: projetando a experiência perfeita. 3ª tiragem, Rio de Janeiro: Elsevier, 2005.

NIELSEN, Jakob. Projetando websites. Rio de Janeiro: Campus, 2000.

PEDROSA, Israel. Da Cor à Cor Inexistente. 7. ed. Rio de Janeiro: Léo Christiano Editora LTDA, 1999.

SANTAELLA, Lucia. A teoria geral dos signos. São Paulo: Ed. Thomson Pioneira, 2000.

STRUNCK, Gilberto. Como Criar Identidades Visuais para Marcas de Sucesso. Rio de Janeiro: Ed. Rio Books, 2003.

TRUJILLO FERRARI, Afonso. Metodologia da ciência. 3.ed. Rio de Janeiro : Kennedy, 1974.

VIDAL, Mario Cesar. Ergonomia na empresa: útil, prática e aplicada. 2.ed. Rio de Janeiro: Científica, 2002.

Page 84: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

82

Periódicos Gonçalves, José Pereira. Evolução e perspectivas do crédito: Os fatores que impulsionaram o crédito imobiliário e o cenário para os próximos anos. Construção Mercado, São Paulo, n.85, p.52-53, 2008. Oliveira, Thiago. Mobilização anticrise: Conheça as estratégias das empresas da construção para enfrentarem a crise financeira. Construção Mercado, São Paulo, n.91, p.28, 2009. Panizza, Janaina Fuentes. Metodologia e processo criativo em projetos de comunicação visual. 2004. 174 f. Dissertação (Mestrado em Publicidade, moda e produção simbólica) - Escola de Comunicação e Artes de São Paulo – ECA/USP, São Paulo, 2004. Revista CREA PR: Tudo azul. Conselho regional de engenharia, arquitetura e agronomia do estado do Paraná, Jul e ago. 2008.

Eletrônicas

A construtora Nostracasa é uma das. Disponível em: <http://www.nostracasa.com.br/construtora> Acesso em 18 março de 2008

A empresa mais recente das concorrentes. Disponível em: <http://www.stmaria.com.br/construtora> Acesso em 18 março de 2008

O conceito da construtora catarinense. Disponível em: <http://www.construtoracatarinense.com.br/construtora> Acesso em 18 março de 2008

Chapecó a construção civil cresceu 27,04%. Disponível em: <http://www.chapeco.sc.gov.br/prefeitura/noticias/?n=1603 > Acesso 8 março de 2008. Existem 43,1 milhões de usuários e o país lidera com um tempo de navegação de 24 horas e 49 minuto. Disponível em: <http://g1.globo.com/Noticias/Tecnologia/0,,MUL1009913-6174,00.html> Acesso 8 março de 2008. Focada para construções pré-moldadas. Disponível em: <http://www.rotesma.com.br/construtora> Acesso em 18 março de 2008

MENDES, Gustavo. Dez contra a crise. Construção Mercado, 2009.Disponível em:< http://revista.construcaomercado.com.br/negocios-incorporacao-construcao/92/editorial-127201-1.asp >. Acesso em: 21 março 2009. OLIVEIRA, Thiago. Crise financeira. Construção Mercado, 2009.Disponível em:<http://revista.construcaomercado.com.br/negocios-incorporacao-construcao/88/crise-financeira-120569-1.asp >. Acesso em: 15 março 2009.

Page 85: PROJETO CONSTRUTORA MATTIELLOsiaibib01.univali.br/pdf/Bruno Mattiello.pdf · 2009-12-14 · e criação de um web site corporativo para construtora Mattiello localizada em Chapecó,

83

OLIVEIRA, Thiago. FVG estima crescimento de 3,5% para o setor em 2009. Construção Mercado, 2009.Disponível em:< http://www.piniweb.com.br/construcao/custos/fvg-estima-crescimento-de-35-para-o-setor-em-2009-128329-1.asp >. Acesso em: 13 março 2009. PEREIRA, Aisa. Em 1969 o Departamento de Defesa dos Estados Unidos. Aprenda a Internet Sozinho Agora, 1999. Disponível em:< http://www.aisa.com.br/quem.html>. Acesso em: 01 Julho 2009.