8 – Protótipo Funcional – 1ª Funcionalidade

1. Objetivos

Implementar a primeira funcionalidade do protótipo.

2. Preparação da Aula

Continuar a implementação do protótipo funcional, depurando questões de organização geral e terminando a implementação de uma funcionalidade. Deve permitir ao utilizador realizar várias tarefas, apresentando a flexibilidade necessária para tal. Relembra-se, mais uma vez, que uma funcionalidade completa envolve dar ao utilizador liberdade de escolha (ex: “encontrar amigo” não é apenas “encontrar o João”). Recorda-se ainda que não é necessária nem desejável a implementação de nenhum backend ou servidor. Devem manter o estado (por exemplo, se o utilizador escolher o João, no ecrã seguinte deve aparecer essa amigo e não outro), mas isso deve ser simulado usando uma de várias formas disponíveis para isso em HTML (Client-Side Storage, cookies ou até mesmo variáveis globais em JavaScript).

Não só a parte funcional do protótipo deve ser tida em conta como também o aspeto: devem ser seguidos os princípios básicos de desenho de ecrãs (layout, estrutura, alinhamentos, tipos de letra, proximidade, legibilidade, etc.). Dito isto, é legítimo que o aspeto final (imagens, cores, etc.) possa ser alterado em versões subsequentes do protótipo (por motivos de consistência com as restantes funcionalidades, por exemplo).

O protótipo tem que estar disponível online no site do grupo. Será demonstrado a partir desse site.

3. Tarefas na Aula

Demonstração do protótipo funcional.

4. Tarefas depois da Aula

Assim, e como habitual, a nota desta aula poderá subir até dois valores se na próxima versão do protótipo apresentarem correções efetuadas de acordo com as sugestões do docente.

5. Critérios de Avaliação

Layout

Ecrã inicial (bem estruturado, segue princípios de design gráfico, faz sentido face às funcionalidades, etc.)

Organização Geral Credível (está bem organizado? Quando tiverem todas as funcionalidades fará sentido, ainda permitirá usar como deve ser? Ou não vão caber/integrar bem? Há coisas (status, etc.) que deveriam aparecer no ecrã inicial, depois de selecionadas “lá dentro”? (ex: indicação de que o alarme está ligado), etc.)

Boa Utilização do Espaço (inclui boa utilização do espaço em branco. Sem atafulhar de coisas…)

Ecrãs Consistentes (é uma interface coesa, e não um “copy&paste” de estilos diferentes)

Widgets Consistentes (no seguimento do anterior, em particular para os widgets usados)

Agrupamentos lógicos (coisas relacionadas estão perto e separadas do resto)

Adequado ao Dispositivo (não estão a tentar encaixar uma interface de telemóvel, ou web, no pulso dos utilizadores…)

Texto

Consistência

Sem serifas

Tamanhos aceitáveis e legíveis

Cores

Consistência

Significados corretos

Bom contraste (no geral, e facilitando a legibilidade do texto)

Ícones/Imagens

Consistência (estilos, etc. cuidado com ir buscar imagens a fontes diferentes)

Percetíveis (sabemos o que representam)

Funcionalidade 1

Complexidade Aceitável (não é um “caminho de ferro”, nem deixa fazer apenas tarefas trivialmente simples

Completa (conseguem fazer-se tarefas do princípio ao fim)

Utilizador controla e exerce o livre arbítrio

Integração

Fala a Linguagem do Utilizador

Estado do sistema visível

Demonstram-se situações limite (“e se quiser ser avisado de 12 concertos, e não apenas de 1”?)

Mantém Estado (“encontrar o João” tem que se lembrar que é o João nos vários passos (e quando sair dos ecrãs da tarefa e enquanto não o encontrar) , etc.)

Evitam-se Erros