Apresentação de Proposta de Desenvolvimento: Web-site e Intranet CEMAR
SUMÁRIO Briefing
04
Estudos Preliminares
04
Primeiros Raffs
06
Grid de Construção do Site
07
Layout da Página Principal
08
Acesso à Intranet
09
Intranet
10
Canais de Relacionamento
11
Briefing
Estudos preliminares
Desenvolver uma nova interface para a Intranet da Companhia Energética do Maranhão CEMAR - realocando as seções do site de forma a facilitar a navegação dos usuários.
Antes de começar a elaborar o novo layout para o site/intranet foi necessário examinar todos os elementos da interface atual e criar um novo mapa de alocação de elementos, ou seja, definir onde ficarão elementos na nova interface tais como: menu principal, sub-menus, banner institucional, banners de publicidade, entre outros.
Sugerir também um novo layout para o site principal da CEMAR seguindo os mesmos conceitos e padrões de melhoria de navegação.
Fez parte também deste processo a definição do usuário padrão do site e quais seriam suas necessidades prioritárias - o que os mesmos poderiam vir a consultar em uma primeira instância. Ao lado, marcado em vermelho, colocamos o que julgamos ser importante para o usuário convencional: • 1 - 3: Percebemos, por estudos realizados, que clientes de grandes companhias de abastecimento como a CEMAR, quando acessam o site institucional da empresa, normalmente buscam meios para quitação de débitos ou verificação de novas tarifas. Julgamos que o espaço dedicado a Agência Virtual deve ter foco maior e ficar mais evidente ao usuário. • 2: Nem todos os usuários, quando buscam uma informação em específico sobre a empresa, tem paciência para localizar a mesma no menu principal. Os campos de busca e acesso rápido se tornam de grande importância para o usuários ir diretamente ao assunto desejado.
Ă reas de maior interesse do usuĂĄrio convencional
2 3
1
Primeiros Raffs Antes do desenho do site no computador criamos algumas opções à mão do que pode vir a se tornar o layout definitivo.
A partir do desenho à mão conseguimos colocar as seções em um grid de construção de forma a serem melhor distribuídas no layout. Ao lado é possível visualizar o mesmo.
Grid de Construção do Site O Grid de Construção foi dividido em 9 partes principais, sendo as mesmas:
1 2
1 - Cabeçalho 2 - Menu principal 3 - Banner principal do site
3
4 - Agência Virtual 5 - Espaço para notícias 6 - Área de visualização de conteúdo
4
7 - Espaço para banners de publicidade 8 - Mapa de navegação 9 - Rodapé
5
6
8 9
7
Layout da Página Principal Explicação detalhada sobre o layout: 1 - Cabeçalho: Espaço contendo a marca da Cemar, a marca da Equatorial Energia e um botão de acesso à Intranet, denominado de 'Área Restrita'. 2 - Menu principal: Disposto horizontalmente e alocado acima do banner principal, facilitando a navegação. 3 - Banner principal do site: Seqüência de 4 banners institucionais que mudam a cada 2 ou 3 segundos. Junto aos mesmos o espaço para buscas no site. 4 - Agência Virtual: Três grandes botões com ícones ilustrativos que mudam sua cor ao serem sobrepostos com o mouse. Ficam estrategicamente posicionados para ter fácil visualização pelos usuários. 5 - Espaço para notícias: Resumo das principais notícias cadastradas pela CEMAR. 6 - Área de visualização de conteúdo: Espaço para os quatro últimos destaques publicados pela CEMAR; os mesmos contam com resumo da matéria e redução da fotografia ao lado. 7 - Espaço para banners de publicidade: Quaisquer banners que sejam de interesse da CEMAR publicar. 8 - Mapa de navegação: O mesmo já fica aberto por completo, mostrando todas as áreas do site. 9 - Rodapé: Informações sobre a CEMAR.
Acesso à Intranet O template da Intranet foi desenvolvido de modo a manter as características de layout e disposição de elementos igual ao do site principal. A mesma é acessada através de um painel contido em um botão localizado no cabeçalho da página principal da CEMAR. Ao lado, em vermelho, aparece o painel aberto. Após serem inseridos os dados de usuário e senha a página redireciona para Intranet.
Intranet Explicação detalhada sobre o layout: 1 - Cabeçalho: Espaço contendo a marca da Cemar e indicação de que se trata da intranet, a marca da Equatorial Energia. 2 - Menu principal: Contendo as Áreas principais da Intranet. 3 - Banner principal do site: Seguindo o mesmo padrão do web site. 4 - Canais de Relacionamento, Conte com a CEMAR: Dividido em um menu com botões que levam ao conteúdo das páginas descritas, divididas em cores para diferenciar uma da outra. Estas cores são aplicadas às páginas sem desconfigurar o layout. 5 - Espaço para notícias: Resumo das principais notícias cadastradas na Intranet. 6 - Área de visualização de conteúdo: Seguindo o mesmo padrão do web site. 7 - Espaço para banners de publicidade: Seguindo o mesmo padrão do web site. 8 - Mapa de navegação: O mesmo já fica aberto por completo, mostrando todas as áreas do site. E muda quando o usuário acessa os Canais de Relacionamento. 9 - Rodapé: Informações sobre a CEMAR.
Canais de Relacionamento Entrando em qualquer um dos canais de relacionamento da CEMAR teremos a configuração de página mantida, com exceção do espaço de notícias que é reduzido para dar espaço ao menu específico do Canal acessado pelo colaborador. Para o colaborador voltar à pagina principal da Intranet, saindo dos canais de relacionamento, é só clicar na área desejada através do menu principal. Os demais Canais de Relacionamento, seguem o mesmo modelo deste apresentado, mudando apenas as cores e os itens do menu principal, adaptados para cada página em específico. Os mesmos são exibidos um a um nas próximas páginas.
.com.br