teste
DESCRIPTION
teste ree ere er e rereTRANSCRIPT
Gestão de Projetos Multimédia
• Conjunto de atividades que permitem planear, conceber, produzir, testar e distribuir uma aplicação multimédia interativa
• Vantagens : - Garante que o produto resultante do projeto está claramente definido e é compreendido por
todas as partes;
- Permite que se defina claramente os objectivos do projectos e que este siga estritamente esses objetivos
- Permite que as responsabilidades nas diferentes etapas da projetos sejam compreendidas, atribuídas e coordenadas;
- Promove uma abordagem lógica do planeamento e encoraja a estimativas mais precisas
- fornece os meios necessários à supervisão e controlo
Projeto Multimédia
2
Gestão e Desenvolvimento de Projeto
• Pensamento organizado
• Capacidade de processar grandes quantidades de informação
• Capacidade de resolver problemas
• Capacidade de composição da informação
• Comunicação e expressão de ideias
Projeto Multimédia - Capacidades necessárias
3Designing the stop Sign http://www.youtube.com/watch?v=Wac3aGn5twc
Gestão e Desenvolvimento de Projeto
• Tempo
- Escalonamento de tarefas, cronograma
• Recursos
- Meios financeiros, pessoas e equipamentos
• Tarefas
- Dimensão e complexidade, especificação requisitos e funcionalidades
Projeto Multimédia - Fatores a ter em conta
4
Gestão e Desenvolvimento de Projeto
1. Análise e planeamento
2. Design
3. Produção
4. Testes e validação
5. Distribuição e manutenção
Fase de densenvolvimento de um projeto Multimédia
5
Gestão e Desenvolvimento do Projeto
• Brainstorming
• Especificações funcionais e técnicas
• Calendarização tarefas, cronograma
• Planeamento competências e recursos
• Estimativa custos
1- Análise e Planeamento
6
1- Análise e Planeamento
• Criação de diagramas ou esquemas de ideias (brainstorming, mindmaps)
• Planear competências necessárias
• Planear tarefas, recursos e tempos necessários
- Diagramas de PERT ou GANTT
Metedologia
7
1- Análise e Planeamento
• Brainstorming : Processo de geração de ideias e soluções através de uma discussão de grupo aberta e sem julgamentos. Cada participante é encorajado a "think out loud" e a sugerir novas ideias e novas possibilidades. No brainstorming não importa se as ideias são bizarras ou absurdas - estas ideias podem conduzir a excelentes ideias
• Ferramentas : mindmaps, pensamento literal
• Ferramentas para realizar mindmaps online : http://www.mindmeister.com/
Brainstorming & Mind maps
8
1- Análise e Planeamento
• Gráfico utilizado para ilustrar o avanço das diferentes etapas do projeto
• Os intervalos de tempo representam o início e o fim de cada fase
• Alocação de recursos a cada tarefa
• Permite analisar / detetar possíveis atrasos na conclusão do projeto
• Permite uma estimativa mais correta dos custos, analisando o tempos e recursos alocados ao projeto
• Ferramentas : http://www.smartsheet.com/
Diagrama de Gantt
9
1- Análise e Planeamento
Diagrama de Gantt
10
1- Análise e Planeamento
• Programa Evaluation and Review Technique
• Consistem numa rede de blocos interligadoss em que cada bloco representa uma tarefa ou um marco no desenvolvimento do projecto acompanhado pela respectiva duração e recursos.
• Permite identificar relações de dependência entre tarefas, pessoas e recursos
• Calculo da duração do projecto através de uma média ponderada (otimista, mais provável e pessimista)
Diagrama de PERT
11
1- Análise e Planeamento
Diagrama de PERT
12
1- Análise e Planeamento
• Descrição dos objetivos a atingir
• Definição do tipo de aplicação multimédia a desenvolver
• Análise dos recursos, pessoas, competências, equipamentos e serviços a integrar
• Análise das tarefas, explicitando requisitos técnicos e funcionais da aplicação, bem como estrurura gráfica de apresentação e respetivos conteúdos
• Análise do tempo, escalonamento das tarefas e associação aos recursos. Desenvolvimento de um cronograma
Produção de um plano de ação detalhado
13
Gestão e Desenvolvimento do Projeto
• Concepção da aplicação multimédia
• Esquemas de navegação e interação
• Conteúdos e apresentação da informação
• Guião da aplicação
• Design Técnico
• Protótipo
2- Design
14
Gestão e Desenvolvimento do Projeto
• Layout da aplicação multimédia interativa
• Envolve a concepção das funcionalidades e do aspeto da aplicação atendendo aos requisitos e limitações das tecnologias
• Pensar, escolher, construir, aperfeiçoar, rever, testar e editar o guião da aplicação
• Concretização das ideias e conceitos desenvolvidos na fase da análise e planeamento
2- Design
15
2- Design
• Estrutura da aplicação
• Esquema de navegação
• Detalhar cada ecrã, tipo e disposição dos conteúdos e funcionalidades
• Concretizar o interface da aplicação
Produção de um guião
16
2- Design
• Concepção dos percursos que podem ser seguidos pelo utilizador para consulta da informação disponibilizada pela aplicação
• O mapa de navegação ilustra as hiperligações que existem entre as várias unidades de conteúdo e ajuda a organizar a apresentação de conteúdos e mensagens
Produção de um guião - Estrutura da Aplicação
17
2- Design
• Fornece um índice gráfico do fluxo lógico da interface interativa
• Descreve as hiperligações entre as unidades de conteúdo multimédia
• Ilustra o que acontece quando o utilizador interage com a aplicação
O mapa de navegaçao cumpre os seguintes objectivos:
18
2- Design
1.Linear
- o utilizador navega sequencialmente de um ecrã para o seguinte ou para o anterior
- Ex.: http://noonebelongsheremorethanyou.com
Existem 4 estruturas fundamentais a nível de navegação:
19
2- Design
Existem 4 estruturas fundamentais a nível de navegação:
20
2.Hierárquica
- o utilizador navega ao longo de ramos de uma árvore que reflete uma organização lógica do conteúdo
- Ex.: http://www.pingodoce.pt/
2- Design
3.Não linear
- o utilizador navega livremente por todo o conteúdo sem qualquer restrição, podendo escolher a qualquer instante, o percurso que deseja para consultar a informação
- Ex.:http://www.tequilamobile.com/#company
Existem 4 estruturas fundamentais a nível de navegação:
21
2- Design
4.Composta / Híbrida
- o utilizador pode navegar livremente, mas existem ocasiões onde encontra restrições, tais como apresentações lineares de sequências de vídeo, ecrãs contendo informações consideras críticas ou hierarquia de ecrãs
- Ex.: http://www.nevermindthebullets.com
Existem 4 estruturas fundamentais a nível de navegação:
22
2- Design
23
2- Design
24
• Fazer um mapa do site;
a) Do site : http://www.clubl.pt ou http://www.publico.pt/
b) de um site à vossa escolha ou que gostariam de desenvolver;
Usar a ferramenta : https://www.lucidchart.com/
https://www.lucidchart.com/documents/edit/423a-f864-50be784d-b2ac-77270a40476b#?demo=on&showMngr
Exercício:
2- Design
• Permitem descrever com precisão a composição e a disposição dos elementos multimédia (textos, gráficos, vídeo, áudio, animações, ...) em unidades de apresentação da informação
Storyboards
25
2- Design
• Utilizando descrições textuais e esquemas suficientemente detalhados para pré-visualizar uma filme, animação ou elementos interactivos de um website;
• Especificando cada imagem, bloco de texto, efeito sonoro, objecto gráfico, sequência de vídeo e animação que surgem em cada ecrã
• Detalhando a localização precisa dos elementos interativos que facilitam a navegação
• Especificando detalhadamente os atributos e os formatos dos conteúdos a utilizar. Ex: cores, sombras, fontes
Os storybords devem descrever funcionamentos dos ecrãs
26
2- Design
27
2- Design
28
2- Design
29
2- Design
30
• Desenha o storybord para a animação da splashpage do Site do Mini (http://www.mini.pt/index.html)
Ex.: Um jovem esta a caminho da praia no seu mini e pelo caminho para o carro para dar boleia a um amigo.
Exercício:
2- Design
31
• Conjunto de elementos através das quais o utilizador interage com uma máquina, dispositivo ou programa de computador. Fornece um método de entrada (input do utilizador) e saída de dados (resposta do sistema)
• No panorama web constitui o ambiente de interação entre o utilizador e um sistema operacional, que representa programas, ficheiros e opções, através de ícones, menus e caixas de diálogo no ecrã
• Se o conteúdo do interface estiver desorganizado e informação for difícil de encontrar e / ou os utilizadores se desorientarem o utilizador fica frustado - o projecto e os seus objectivos podem falhar. O mesmo se aplica se o design for pobre e pouco apelativo.
Design do Interface do utilizador - aspetos a ter em conta
2- Design
32
• Simples :
- Exige o menor esforço de aprendizagem por parte do utilizador ( deve ser concebido de modo a que não seja necessário qualquer estudo ou manual para utilizar a aplicação);
- Consistente no seu aspeto e comportamento - utilizando metáforas conhecidas pelo utilizador (icone de lixo, cursor “pointer” para indicar zonas interactivas, ampulheta, lápis).
• Acessível :
- Todas as pessoas devem ser capazes de utilizar os sistema - deve ser pensado tendo em conta eventuais limitações físicas dos utilizadores.
As interfaces devem ser simples e acessíveis
2- Design
33
• Linha de comandos
• Menus
• Linguagem natural
• Preenchimento de formulários
• Diálogo baseado em janelas, ícones, menus e apontadores
Estilos de interação mais utilizados
2- Design
34
• Possibilidade de enviar instruções directamente ao sistema através de comandos específicos (ex.: Linha de comandos Windows). Os comandos podem ser compostos por teclas de funções, caracteres, abreviações ou palavras inteiras.
• Oferecem um acesso directo às funcionalidades dos sistema.
• É um tipo de interacção complexo , curva de aprendizagem significativa - necessária a memorização de comandos.
Estilos de interação - Linha de comandos
Linha de comandos Windows
2- Design
35
• Conjunto de opções apresentadas numa Interface, em a que a seleção de uma ou mais opções resulta numa mudança no estada da interfac
• Opções seleccionadas através da utilização do rato, teclado ou dedo;
• As opções dos menus devem ser agrupadas logicamente para ajudar no processo de reconhecimento e obtenção de informação
• Podem ser baseados em texto, imagem ou ambos;
Estilos de interação - Menus
2- Design
36
• O computador é capaz de interpretar e executar intruções expressas oralmente através de palavras do vocabulário corrente do utilizador
• A ambiguidade da linguagem natural coloca problemas de compreensão por partes das maquinas :
- Sintaxe e estrutura podem não ser claras;
- Significado de uma palavra pode ser ambíguo - duplo significado
Estilos de interação - Linguagem Natural
Siri - iPhone
2- Design
37
• O utilizador tem à sua disposição um ecrã cuja a concepção se assemelha a um formulário em papel
• Adequado para a introdução de dados
• Fácil de aprender e utilizador por utilizadores com pouca experiência
• Devem indicar sempre o tipo de dados que pode ser introduzido e conter mecanismos de verificação e validação
Estilos de interação - Preenchimento de formulários
Formulário de registo
2- Design
38
Design de elementos interactivos
• É importante incluir em todos os ecrãs da aplicação botões ou ícones que despenham funções essenciais à utilização do sistema : ( sair da aplicação, cancelar uma actividade ou anular uma escolha, aceder ao mapa da navegação)
http://webdesignledger.com/inspiration/20-excellent-examples-of-icon-usage-in-web-design
• O Design da aplicação deve fornecer botões que façam sentido para que as acções sejam compreendidas de forma intuitiva pelo utilizador
• Não é aconselhável obrigar o utilizador a memórias e aprender ícones novos e muito específicos
2- Design
39
Disposição de controlos
• Os conjuntos de controlos devem ser agrupados logicamente:
• Tipos de organização possíveis:
• Funcional – controlos e áreas sensíveis são organizados aproximando aqueles que se relacionam em termos funcionais
• Sequencial – controlos e áreas sensíveis são organizados de forma a reflectir a ordem pela qual são utilizados numa interacção típica
• Frequência – controlos e áreas sensíveis são organizados de acordo com a sua frequência de utilização, sendo os mais frequentes colocados em locais mais acessíveis
• Controlos críticos devem estar situados ao nível dos olhos e devem espaçar-se de forma apropriada
Barra de ferramentas do Mail.app
2- Design
40
Utilização da cor
• As cores a utilizar nas interfaces devem ser distintas e essa distinção não deve ser afetada por alterações de contraste
• A cor azul ou verde não devem ser utilizados para apresentar informação critica para o utilizador
• Ao usar a cor como indicador deve-se incluir sempre informação adicional para utilizadores com dificuldades na percepção da cor;
• A utilização da cor deve obedecer às convenções estabelecidas e às expectativas do utilizador (Ex: vermelho – parar ; amarelo – esperar ; verde - avançar)
Sistema de notificações
2- Design
41
• Maus exemplos (http://www.webpagesthatsuck.com)
• http://www.sixtiespress.co.uk/
• http://www.cp.pt/
• http://www.richardsbrothersseafoods.com.au/
• http://www.pinesol.com/
• Bons exemplos (http://www.1stwebdesigner.com/design/well-designed-usable-sites/)
• http://www.apple.com
• http://www.zara.com/
Websites - Bons e Maus exemplos
2- Design
42
•Guias visuais para definir a estrutura que o interface deverá ter e relacionamentos entre páginas. É uma ilustração dos elementos fundamentais do interface. É um processo iniciado ante do do trabalho artístico
•Ferramentas online : https://gomockingbird.com
Wireframes
2- Design
43
Wireframes
2- Design
44
Exercício
Utilizando o mockingbird realize os wireframes de um site à escolha : ex: http://www.publico.pt/, http://www.mango.com/
•Ferramentas online : https://gomockingbird.com
2- Design
45
• Actividade geralmente realizada pelos membros da equipa cuja especialidade é a área da programação ou a área da utilização de sistemas de autoria multimédia
• Consiste na actividade pela qual se especifica a arquitetura de software que servirá de base à futura aplicação multimédia interativa
• A sua realização depende fortemente do tipo de aplicação que se pretende desenvolver. Não se justifica em aplicações muito simples
Design Técnico
2- Design
46
• Produz um documento que se integra no guião da aplicação a produzir durante a fase de design do projeto multimédia, juntamente com os mapas de navegação e os storyboards e interface do utilizador
• Descreve o modo como a aplicação será desenvolvida durante a produção e deve incluir as seguintes especificações:
- Definir a plataforma de desenvolvimento em termos de hardware
- Especificar as ferramentas de autoria a utilizar durante a produção, bem como os formatos e conteúdos
- Especificar o ambiente de desenvolvimento a utilizar
- Descrever os módulos de software que constituem a aplicação
Design Técnico
Gestão e Desenvolvimento do Projeto
47
• Desenvolvimento conteúdos
• Programação
Produção
3- Produção
48
• É nesta fase que a aplicação começa a ganhar forma e vida. Os documentos produzidos nas fases anteriores (guião, storyboards, mapas de navegação, design técnico) constituem o manual de instruções a ser seguido.
Produção
3- Produção
49
• Desenvolvimento dos conteúdos
- criação e aquisição de todos os conteúdos multimedia (textos, objetos, gráficos, ícones, imagens, sequências de vídeo e de áudio e sequências animadas). Edição ou alteração dos conteúdos
• Desenvolvimento do código da aplicação
- autoria ou programação da aplicação envolvendo a construção da estrutura da aplicação, a
elaboração dos ecrãs, a importação de todos os conteúdos para os ecrãs, a escrita de scripts para as ações associadas aos elementos interativos e à interface do utilizador, e a verificação do funcionamento da interface e das escolhas concebidas ao nível da navegação.
Actividades de autoria
3- Produção
50
• Ciclo alfa
- primeira implementação completa do guião, iniciando-se a autoria de conteúdos e a autoria da aplicação
• Ciclo beta
- modificações necessárias – funcionalidade, conteúdos, interface
• Ciclo gama
- finalização do processo
Organização Temporal
3- Produção
51
• Consiste na actividade pela qual se especifica a arquitetura de software que servirá de base à futura aplicação multimédia interativa
• Neste ciclo dá-se início o desenvolvimento e discussão de outras componentes do produto final:
- documentação (manual do utilizador e outros documentos)
- tipos de suporte em que a aplicação será distribuída, material adicional que será incluído e o aspeto que os suportes deverão apresentar
- métodos de avaliação que serão concebidos para conduzir os testes da aplicação junto dos utilizadores finais bem como a lista das funcionalidades que deverão ser avaliadas durante os testes
Ciclo Alfa
3- Produção
52
• Revisão completa do design da aplicação
• Realização dos primeiros testes com utilizadores
• Realização das últimas modificações ao design da aplicação
Ciclo Beta
3- Produção
53
• Encerra a fase de produção do projeto
• Completam-se a autoria de conteúdos e aplicação
• Finaliza-se o manual do utilizador e outros documentos de apoio, bem como os pacotes e outros elementos que conterão o suporte físico escolhido
• Verificação de todos os elementos multimédia
- verificação ortográfica e gramatical dos artigos textuais, correção de dados numéricos, verificação da resolução e definição de imagens, ícones e outros objectos, verificação das transições e efeitos de áudio e vídeo, etc.
Ciclo Gama
Gestão e Desenvolvimento do Projeto
54
• Testes técnicos e funcionais
• Correcão erros e aperfeiçoamento do produto multimédia
Teste e Validação
4 - Teste e Validação
55
• Verificar se a aplicação final corresponde aos objetivos traçados, se funciona corretamente nas plataformas a que se destina e se vai de encontro às necessidades do cliente ou do utilizador final
• Verificar o funcionamento de cada um dos elementos interativos, seu funcionamento em conjunto e cada um dos possíveis percursos
• Necessário manter noção das prioridades e da severidade dos erros
Teste e validação
4 - Teste e Validação
56
• Módulos de software
- a realizar pela equipa de programação ou autoria
• Integração do software
- verificar modo de funcionamento da aplicação. A realizar por pessoas que não fizeram parte da equipa de construção da aplicação
• Compatibilidade
- verificar a instalação da aplicação em vários tipos de plataformas de HW e SW
• Facilidade de uso da interface do utilizador
- Identificar se a interface é simples, acessível e se os controlos desempenham as
Tipos de testes
4 - Teste e Validação
57
• Falhas de design e sugestões – ao nível do interface e sugestões relativas ao posicionamento e estilo de links, disposição dos conteúdos nos ecrãs (...)
• Erros de conteúdo – erros de escrita, de conceito, problemas de formatação dos conteúdos e qualidade
• Defeitos de software – erros técnicos de excecusão e utilização da aplicação
Características e prioridades dos erros
4 - Teste e Validação
58
• Severidade do erro – escala de 1 (pouco grave) a 10 (muito grave)
• Detectabilidade do erro – escala de 1 (pouco detectavél) a 10 (muito detectavél)
• Lista de prioridades
- Baixa – erro pouco detectavél, com baixa severidade;
- Alta – erro facilmente detectavél, com alta severidade;
Erros - prioridades
4 - Teste e Validação
59
Erros - prioridades
Gestão e Desenvolvimento do Projeto
60
• Lançamento produto multimédia
• Atualização e suporte
5 - Distribuição e manutenção
5 - Distribuição e manutenção
61
• Criação de uma versão executável da aplicação
• Criação de uma aplicação de instalação
• Cópia para o suporte de distribuição
• Distribuição aos utilizadores finais utilizando os canais apropriados
Gestão e Desenvolvimento do Projeto
62
Software de apoio à gestão de projecto
Ferramentas que permite a gestão de projeto de uma forma generalizada. Possuem varias funcionalidades entre as quais
- Criação e definição de tarefas;
- Atribuição de tarefas a utilizadores;
- Repositório de código;
- Integração com o SVN
- Wiki
- Criação de gráficos e diagramas automáticos
- (...)
Gestão e Desenvolvimento do Projeto
63
Software de apoio à gestão de projecto
• Springloops - http://www.springloops.com/v2/
• Redmine - http://www.redmine.org/ | http://sourceforge.net/projects/openproj/