[1] O documento descreve as etapas de um projeto para desenvolver um guia do motorista, incluindo brainstorming, entrevistas, wireframes e identidade visual. [2] As etapas incluem mapear postos de gasolina, coletar feedback dos usuários, criar esboços de tela e selecionar cores e fontes para o site. [3] No final, conclui que embora a ideia inicial parecesse promissora, surgiram dificuldades como a veracidade das informações fornecidas que tornariam o projeto

1. Universidade Estadual de Maringá
Departamento de Informática
Especialização em Desenvolvimento de Sistemas para Web
Docente: Frederick van Amstel
Projeto Guia do Motorista
Dicentes: Hercules Gomes Cangussú
Leandro
Osvaldo Massakazu Kohatsu
Reinaldo
Thiago Corbari Feldhaus

2. Maringá
2010
Sumario
Introdução
No mundo atual, tempo é algo precioso ou de acordo com os capitalistas, tempo
é dinheiro. Alguns seguem a linha de raciocínio em que não devemos ter pressa, mas
também que não devemos perder tempo. Perdê-lo é algo desagradável. Ganhá-lo é
ótimo pois, sobrando tempo, podemos realizar outras tarefas e até mesmo adiantar
outros afazeres.
Hoje existem ferramentas, e nisso incluímos tanto ferramentas no seu sentido
material quanto no sentido das idéias, que nos auxiliam a agilizar nossos afazeres e
aumentar nossa eficiência.
Além desta praticidade, as pessoas buscam também a comodidade. Algo é dito
cômodo quando nos proporciona vantagens, agradabilidade e conforto.
Com base neste pensamento, este projeto proporciona os elementos acima
mencionados no segmento das viagens e locais de abastecimento. O projeto oferece
praticidade e comodidade a seus usuários neste quesito, pois possibilita um
planejamento prévio de viagem, minimizando ou evitando possíveis transtornos e
imprevistos que poderiam ocorrer numa viagem programada.
A seguir alguns dos passos executados no projeto, com uma breve descrição de
cada etapa.
1. Brainstorm (Mindmeister)
Consiste em uma reunião de no máximo 30 minutos, senão torna-se
improdutivo, para idealização de novos projetos, cada pessoa opina sobre o que
poderia ser implementado e como seria.
Algumas destas idéias podem ser arquivadas para uso posterior, ou para fins de
consulta.

3. Figura 1.1. – Modelo de Brainstorm do Guia do Motorista
2. Entrevistas
Serve como instrumento para medir a aceitação do sistema sobre o público alvo.
Elaborado alguns ítens a serem abordados, a etapa consiste em entrevistar, e
coletar informações de forma dinâmica, sem indução para as respostas.
3. Dendograma (Websort)
Auxilia na montagem de menus acessíveis ao usuário final. Consiste no
preenchimento de itens e categorias para estes menus, o teste é realizado pelo usuário
em potencial, onde este arrasta a tarefa de acordo com a categoria que ele julga ser,
no final, é analisado o resultado para verificar se o menu se encaixa no contexto da
maioria dos usuários.

4. Figura 3.1. – Visualização das categorias.
3.2. Category x Itens (Websort)
X
4. Wireframe (gomockingbird)
Desenho de telas, para visualização num contexto geral da aplicação, uma visão
genérica de como deve ficar o site, ou seja, um esboço do site.

5. Figura 4.1. – Tela de Cadastro

6. Figura 4.2. – Tela das rotas.

7. Figura 4.3. – Tela de avaliação dos serviços dos postos.

8. Figura 4.4. – Tela de filtragem dos dados.

9. Figura 4.5. – Tela de Login.

10. Figura 4.6. – Tela de Reclamações.

11. Figura 4.7. – Tela de Compartilhamento de Rotas.

12. Figura 4.8. – Tela de Registro.

13. Figura 4.9. – Tela de Erro de Login.

14. Figura 4.10. – Tela para Recuperação de Senha.

15. Figura 4.11. – Tela de Feedback da Recuperação da Senha.

16. Figura 4.12. – Tela de Erro para Recuperar Senha.

17. Figura 4.13. -

18. Figura 4.14. – Tela de Rotas.
5. Identidade Visual
Utilizado para marketing do sistema ou produto, este deve conter informações
sobre o mesmo, principais funcionalidades, atraindo o público alvo.
O mesmo serve para selecionar cores que serão inseridas ao site final.
A tipografia foi um dos passos importantes, a seleção de fontes que estejam
disponíveis em vários sistemas operacionais, e que seja agradável ao usuário, assim
como utilizar no máximo 3 tipos de fontes.

19. 6. Layout
Desenvolvimento de um protótipo da interface.

20. 7. Postagem em Blog (Portfolio)
Postagem em blog para fins de divulgação dos trabalhos realizados, o mesmo
pode servir como portfolio pessoal.
8. Conclusão
Com este projeto, foi possível interagir com diferentes técnicas para criação de
um pré-projeto para desenvolvimento ou remodelagem de um site.
Inicialmente a idéia do projeto de mapear os postos de gasolina e marcar
informações pertinentes a viajantes pareceu de certa forma, algo rentável, mas ao
analisarmos com mais calma, verificamos certas dificuldades quanto ao tratamento da

21. veracidade das informações postadas pelos usuários, está também constatada pela
maioria das pessoas entrevistadas.
Algumas técnicas e métodos demonstrados e relizados, apresentarão ser
interessantes e válidos, mas somente a projetos de grande porte, pelo custo, tempo e
mão de obra qualificada necessária para realização dos mesmos.