Quarta-feira, 30 de Maio de 2012
#aula12

Na aula da última segunda-feira, fizemos o ponto de situação do momento, mostrando ao professor Benjamin a instalação em funcionamento. O resto da aula foi dedicada a aperfeiçoamentos sugeridos pelo professor e à implementação do feedback visual das ferramentas.


tags:


Quinta-feira, 24 de Maio de 2012
#orientacao10

Na última reunião de orientação, discutimos os requisitos a serem implementados na próxima entrega e falámos acerca do modo de avaliação do novo elemento do grupo.
Tivemos também oportunidade de mostrar ao orientador as alterações introduzidas na parede até ao momento.

 




#aula11

Esta segunda-feira recebemos um novo elemento no grupo, a Alexandra.

Durante a aula, continuámos os melhoramentos do grafismo da parede, contando com a opinião do professor Ivo. A nível técnico, prosseguimos com o desenvolvimento das funcionalidades que propusemos fazer para próxima entrega.


 


tags:


Mosaiko - Lx Factory Open Day

Na última Sexta-Feira, dia 18 de Maio o Mosaiko fez uma visita à Lx Factory aproveitando o Open Day para mostrar o nosso protótipo directamente ao público. Desde já aproveitamos para agradecer a oportunidade que nos foi dada pelo nosso orientador Nuno Ribeiro.

Aproveitámos esta oportunidade de testar o nosso protótipo e confirmámos algumas dificuldades.

 

Fiquem agora com as primeiras reacções:

 




Domingo, 20 de Maio de 2012
#entrega06pre

 Com o protótipo alpha concluído, e até já levemente testado, torna-se necessário estabelecer os requisitos a implementar no protótipo seguinte, beta.

Neste post, vamos identificar as componentes que deveão estar presentes no protótipo beta (requisitos funcionais e não-funcionais), os bugs já encontrados e possíveis causas e soluções, e eventuais testes que deverão ser aplicados ao protótipo.

 

 Representação do sistema do projeto

 

Sistema do projecto "Mosaiko"

 

Estrutura de navegação da "webapp"

Estrutura de navegação do telemóvel

 

 Como podemos observar pelas componentes identificadas a azul da primeira imagem, representação do sistema, todo o sistema deverá estar operacional, permitindo o acesso simplificado à plataforma, através dos serviços DHCP e DNS, o funcionamento local e sincronização remota dos servidores.

Na fase alpha, ficaram já implementadas as componentes do "Telemóvel", "Aplicação de desenho" e a sua ligação através de Sockets (em PHP), a integração do Kinect com a aplicação e a utilização do servidor local. Assim, nesta fase resta implementar: a utilização do servidor global e a necessária sincronização entre servidores, o servidor DNS e de DHCP.

 Quanto à "webapp", a navegação da aplicação encontra-se bastante avançada, permitindo a navegação/utilização das funcionalidades implementadas na aplicação AS3. No entanto, o seu desenvolvimento ainda não está concluído, sendo necessário implementar a navegação entre ferramentas através de swipe, os eventos de mouseOver e mouseDown e eventuais bugs visuais já identificados.

No protótipo entregue, apenas era possível a utilização de um jogador em simultâneo. Neste entrega, pretendemos desenvolver o sistema de forma a se tornar multi-utilizador.

 

Lista dos requisitos implementados e por implementar na fase beta


TipoRequisitos implementadosComponente
Não funcionalDetectar orientação do telemóvelTlm + App
FuncionalSelecionar mãoTlm + App
FuncionalSelecionar tamanho do pincelTlm + App
FuncionalSelecionar corTlm + App
FuncionalDesenhar (efeito flag)Tlm + App
FuncionalApagar (efeito flag)Tlm + App
FuncionalEscolher stencils e tamanho (navegação apenas)Tlm
FuncionalGuardar imagem completaTlm + App
FuncionalSelecionar avatarTlm
FuncionalFazer upload de avatarTlm
Não funcionalApagar avatares antigos do utilizadorTlm
FuncionalLogin, registo, editar perfil e logoutTlm
FuncionalAjuda (básica)Tlm
Não funcionalValidação Javascript e PHP dos formuláriosTlm
Não funcionalGerar tema (a partir da BD)App
Não funcionalGerar contador do tema actualApp
FuncionalApontador da posição do utilizadorApp
Não funcionalLer posição através do KinectApp
Não funcionalLer posição através do rato (útil para debug e desenvolvimento)App
Não funcionalLigação entre Telemóvel, Aplicação e Base de dadosTlm + App
Não funcionalLimitar área de desenhoApp
FuncionalExportar PNG para o servidor localApp
Não funcionalInserir informação do PNG na base de dadosApp
Não funcionalApagar desenho completoApp

 

TipoRequisitos por implementarComponente
FuncionalUtilização multi-jogadorTlm + App
FuncionalSprayTlm + App
FuncionalDesenhar/apagar ao pressionar a ferramentaTlm
FuncionalNavegação através do toque (deslizar o ecrã)Tlm
FuncionalPré-visualizar stencil na paredeApp
FuncionalAplicar stencil na paredeApp
Não funcionalAutores do desenho na paredeApp
Não funcionalAutores do desenho na BDApp
Não funcionalAviso ao apagar os avatares antigosTlm
Não funcionalFull screenApp
Não funcionalSincronização entre servidoresApp
FuncionalGuardar nome do desenhoApp
FuncionalGuardar contributoApp
FuncionalGuardar imagem na BD (registo por email)Tlm + App
Não funcionalFiltrar o movimento do utilizador no desenhoApp
Não funcionalMelhoramento da navegação do utilizador pela área de jogoApp
Não funcionalImplementação do servidor DNSOutro
Não funcionalImplementação do servidor DHCPOutro

  

 

  Lista de bugs conhecidos

 

Prd

Natureza

Descrição

Estratégia de resolução

3

Design

Padrão de fundo com limites visíveis

Troca por um padrão que permita a repetição vertical e horizontal

2

Programação

Navegação por setas

A utilização de alguns plugins desenvolvidos em JQuery Mobile permitem adicionar o efeito swipe à aplicação

4

Design/ Programação

Avatar desalinhado na página de avatares

A implementação de imagens preview (thumbnails) com dimensões padrão

4

Design/ Programação

Preview dos avatares não ocupa a div por inteiro

A mesma solução para os avatares desalinhados deverá ser utilizada

2

Programação

Utilização das ferramentas através do evento de “click”

A utilização de JQuery Mobile possibilita a utilização de mais eventos, como vmouseup e vmousedown

5

Design/ Programação

Inserção de texto redimensiona as áreas da aplicação, desformatando a aplicação

O desenvolvimento do CSS ajustado para o display na horizontal deverá permitir contornar este problema

1

Programação

Seleção de mão ainda com problemas

Revisão do código

 

 

Finalmente, falta apenas definir quais os testes que deverão ser utilizados para a identificação e correção de problemas da plataforma. De acordo com as especificidades do nosso projeto, considerámos relevantes os seguintes testes:

1) Funcionalidades - permite observar a eficácia das estratégias implementadas para a implementação dos nossos requisitos;

2) Segurança - o registo de informações pessoais e a capacidade de inserção de conteúdos obrigam a uma atenção redobrada a problemas como SQL Injection;

3) Compatibilidade - este teste tem grande importância, devido às diferentes condições que a WebApp vai encontrar (resoluções de ecrã, taxa de transmissão, comportamento de diferentes browsers, etc);

4) Design - A auditoria do trabalho de design da plataforma permite sempre ter um parecer objetivo do trabalho realizado, facilitando o registo de analomalias;

5) Usabilidade - De importante peso, visto que a natureza do projeto visa produzir experiências agradáveis ao utilizador. A utilização do Kinect para desenhar poderá trazer algumas limitações à usabilidade da plataforma.

 




Sábado, 19 de Maio de 2012
#orientacao09

 Nesta reunião, fizemos uma demonstração do protótipo alpha ao orientador, que nos deu o seu feedback em relação às funcionalidades implementadas.
Procedemos ainda á preparação da apresentação do projeto no "Open day" da LX factory.
 




#aula10

No início da aula passada, o professor Helder Caixinha explicou aquilo que é pretendido fazer na próxima entrega e na pré-entrega. O resto da aula foi dedicada à apresentação e teste das componentes desenvolvidas na última entrega.

 


tags:


Sexta-feira, 11 de Maio de 2012
#entrega05

 

Este post descreve o trabalho realizado para o desenvolvimento do protótipo alpha do projeto "Mosaiko".

Felizmente, as as funcionalidades principais projetadas na pré-entrega foram implementadas com sucesso, sendo possível até implementar algumas extra, como a gestão de utilizadores (login, registo, edição de perfis e avatares) . A exportação para XML, não sendo um requisisto principal do projeto, foi deixado para a versão beta.

A aplicação para telemóvel foi desenvolvida através de linguagens web, sendo necessário projeta-la com dimensões variáveis (CSS com recurso a percentagens). No telemóvel os utilizadores podem fazer a gestão do seu perfil e selecionar e utilizar as várias ferramentas da aplicação.

A aplicação AS3 foi desenvolvida no Adobe Flash Builder 4.6, com recurso à framework AirKinect 2.1, de modo a culminar numa aplicação AIR. Esta aplicação AS3 recebe comandos do telemóvel, utilizandos para definiar as opções de desenho. É também capaz de se ligar à BD, através de serviços do amfPHP e e pedidos URL a páginas PHP, permitindo gerar um tema da BD ou exportar um PNG e registá-lo.

A ligação entre o telemóvel e o AS3 foi a componente mais dificil de implementar, sendo necessário estabelecer uma ligação entre Javascript, PHP e AS3. A ausência de sockets em Javascript (os Websockets do HTML5 ainda não são compatíveis com muitos browsers) obrigou-nos a fazer pedidos AJAX a um ficheiro PHP que, por sua vez, utiliza os sockets para se ligar a um servidor de sockets (programado em PHP) e que reencaminha as mensagens para a aplicação (também através de sockets).

 

Para demonstrar a utilização do projeto, estão presentes dois vídeos, o primeiro representativo da utilização típica da plataforma, o segundo com detalhe de algumas funcionalidades do telemóvel.

 

Utilização normal da plataforma

 

 

 

Utilização do telemóvel

 

 

 

Como anexo, listamos os requisitos implementados e a componente do projeto a que dizem respeito, os requisitos por implementar e os bugs conhecidos até ao momento.

 

Tipo Requisitos implementados Componente
Não funcional Detectar orientação do telemóvel Tlm + App
Funcional Selecionar mão Tlm + App
Funcional Selecionar tamanho do pincel Tlm + App
Funcional Selecionar cor Tlm + App
Funcional Desenhar (efeito flag) Tlm + App
Funcional Apagar (efeito flag) Tlm + App
Funcional Escolher stencils e tamanho (navegação apenas) Tlm
Funcional Guardar imagem completa Tlm + App
Funcional Selecionar avatar Tlm
Funcional Fazer upload de avatar Tlm
Não funcional Apagar avatares antigos do utilizador Tlm
Funcional Login, registo, editar perfil e logout Tlm
Funcional Ajuda (básica) Tlm
Não funcional Validação Javascript e PHP dos formulários Tlm
Não funcional Gerar tema (a partir da BD) App
Não funcional Gerar contador do tema actual App
Funcional Apontador da posição do utilizador App
Não funcional Ler posição através do Kinect App
Não funcional Ler posição através do rato (útil para debug e desenvolvimento) App
Não funcional Ligação entre Telemóvel, Aplicação e Base de dados Tlm + App
Não funcional Limitar área de desenho App
Funcional Exportar PNG para o servidor local App
Não funcional Inserir informação do PNG na base de dados App
Não funcional Apagar desenho completo App

 

Tipo Requisitos por implementar Componente
Funcional Utilização multi-jogador Tlm + App
Funcional Spray Tlm + App
Funcional Desenhar/apagar ao pressionar a ferramenta Tlm
Funcional Navegação através do toque (deslizar o ecrã) Tlm
Funcional Pré-visualizar stencil na parede App
Funcional Aplicar stencil na parede App
Não funcional Autores do desenho na parede App
Não funcional Autores do desenho na BD App
Não funcional Aviso ao apagar os avatares antigos Tlm
Não funcional Full screen App
Não funcional Sincronização entre servidores App
Funcional Guardar nome do desenho App
Funcional Guardar contributo App
Funcional Guardar imagem na BD (registo por email) Tlm + App
Não funcional Filtrar o movimento do utilizador no desenho App

 

 

Lista de bugs conhecidos até ao momento

Bugs Descrição
Padrão de fundo  É possível observar os limites do padrão de fundo actual.
Setas de navegação As setas de navegação são temporárias.
Caixa de aviso de voltar O texto dos botões da caixa de aviso ao voltar ao menu principal estão desalinhados.
Crash da aplicação ao sair da área de utilização Quando o utilizador sai do ecrã deixa de haver uma "joint" para se ir buscar a posição.
Avatar desalinhado (página avatar.php) Os avatares horizontais transferidos pelos utilizadores ficam colados ao fundo e não centrados na vertical.
Preview do avatar As diferentes resoluções e orientações dos avatares transferidos provocam este bug. Poderá ser resolvido com a criação de thumbnails com as mesmas proporções da área de preview.
Utilização das ferramentas através de flags O comportamento do eventos onmousedown e onmouseup no browser do Android obrigou-nos a adoptar por esta estratégia. No entanto, a utilização de Jquery Mobile poderá permitir a utilização inicialmente prevista.
Inserção de texto provoca bugA abertura do teclado do Android provoca um reajustamento das dimensões da aplicação, provocando overflow de conteúdos.

 

 




#orientacao08

Nesta quinta-feira mostrámos ao orientador a aplicação móvel já concluída e funcional de acordo com os requisitos a que nos proposémos para a próxima entrega.

Em seguida, conversámos acerca das nossas dificuldades na criação da ligação entre as componentes. 




#aula09

Na aula desta segunda-feira, continuámos o desenvolvimento da aplicação web e fizemos o estudo das componentes de ligação e do módulo de desenho. Na conversa com os professores, fomos  aconselhados a repensar futuramente as metáforas gráficas utilizadas.


tags:


.mais sobre mim
.pesquisar neste blog
 
.Junho 2012
Dom
Seg
Ter
Qua
Qui
Sex
Sab

1
2

3
4
5
6
7
8
9

10
11
12
13
14
15
16

17
18
19
20
21
22
23

24
25
26
27
28
29
30


.posts recentes

. entrega06testes

. entrega06

. #orientacao12

. #aula13

. #orientacao11

. #aula12

. #orientacao10

. #aula11

. Mosaiko - Lx Factory Open...

. #entrega06pre

.arquivos

. Junho 2012

. Maio 2012

. Abril 2012

. Março 2012

. Fevereiro 2012

.tags

. todas as tags

.as minhas fotos
blogs SAPO
.subscrever feeds