Quinta-feira, 31 de Março de 2011
Entrega do módulo TP3 (2/2)

 

Demo técnica
 
O objectivo com esta demo técnica é demonstrar o funcionamento de uma parte essencial da aplicação, que é a leitura do código QR pela câmara do dispositivo móvel e a ligação aos conteúdos, para tal é necessário que o telemóvel tenha acesso à rede. Quanto à técnica em si, é adicionada uma nova peça a uma base de dados MySQL sendo que, nesta demo, apenas são inseridos os campos: título, imagem e campo (texto). Criámos também um ficheiro PHP que acede à base de dados e invoca a informação relativamente ao ID recebido via método $_GET: http://www.impakt.com.pt/aulas/projecto/index.php?cat=ID. Todo este URL é então passado para código QR. Para esta demo recorremos a um gerador de código QR online (http://qrcode.kaywa.com/), mas pretendemos optar pela implementação futura de uma API que gere automaticamente o código QR relativo ao URL de cada peça, na altura em que esta é inserida pelo administrador na base de dados via backoffice.
 
 
No post anterior à entrega do módulo estão disponíveis 3 códigos QR para experimentação e comprovação do funcionamento desta tecnologia.
 
 
Actualizações recentes:
 
Considerações técnicas - Gerador de código QR automático.
Para o desenvolvimento do backoffice da aplicação queremos implementar um método dinâmico de gerar um código QR para o link da peça de maneira a minimizar a quantidade de aplicações necessárias como também de optimizar o mecanismo de inserção de peças na base de dados.
Como tal, pesquisámos por APIs e bibliotecas de código para o efeito e encontrámos uma solução para o problema:
http://www.tag.cx/qr-codes/
Esta biblioteca cria automaticamente um código QR para o link em que está inserido, sendo que nos elimina a necessidade de recorrer ao gerador utilizado na demo técnica.

 




Entrega do módulo TP3 (1/2)

 Módulo TP3 – desenvolvimento de demos/protótipos de baixa fidelidade

 
 
 
O objectivo deste módulo é o desenvolvimento de uma demo gráfica e uma demo técnica de baixa fidelidade.
A demo gráfica tem como finalidade a elaboração de modelos/esboços dos ecrãs e exemplificação da interacção do utilizador com os mesmos. Esta demo foi elaborada com recurso ao Balsamiq mockups - http://balsamiq.com/products/mockups para o desenho conceptual dos ecrãs e posteriormente com recurso ao Adobe Flash fizemos uma pequena animação mostrando quais as acções que o utilizador tem com o dispositivo e como o utiliza.
O objectivo com esta demo técnica é demonstrar o funcionamento de uma parte essencial da aplicação, que é a leitura do código QR pela câmara do dispositivo móvel e a ligação aos conteúdos, para tal é necessário que o telemóvel tenho acesso à rede e um leitor de código QR instalado, neste caso, o NeoReader.
 
 
Demo gráfica
 
De seguida apresentamos os ecrãs essenciais da nossa aplicação, relativamente à organização dos conteúdos dentro da aplicação, tentámos que fosse o mais ‘clean’ possível para facilitar a utilização e percepção do utilizador, com a finalidade de simplificar a navegação tornando-a o mais intuitiva possível. Os conteúdos podem ser acedidos pelo utilizador em um ou dois cliques, sendo que a ajuda está sempre acessível assim como voltar ao ecrã de inicio, clicando no logótipo, o botão anterior permite voltar um passo atrás.
 
Para contextualizar vamos fazer uma pequena descrição sobre como o utilizador toma contacto com a aplicação antes de a utilizar e vamos utilizar um museu como exemplo. O visitante entra no museu e através de sinalética estrategicamente colocada toma conhecimento da existência da nossa aplicação, segue as instruções indicadas para a descarregar para o telemóvel assim como o leitor de código QR se ainda não o tiver instalado, liga-se à rede disponível no museu e abre a aplicação, a partir daí descrevemos abaixo os ecrãs em que pode navegar com imagens exemplificativas.
 
 

 

 

 

 
 
 
 
 
 
 
 
 

 

 

 
 
 
 
 
 
 

 

 

 

 
 
 

            

 
 

 

 

 
 
 

 
 
 

 

 

 

 
 

 

 
 

 

 
 

 
 

De seguida apresentamos o link para uma pequena animação com os mockups que fizemos para a nossa demo gráfica, para demonstrarmos como o utilizador pode interagir com a aplicação.

 http://www.vimeo.com/21787169

 

Animação da demo gráfica (aguardar um pouco para carregar o vídeo no blog - para facilitar a visualização  a animação foi embebida no blog no dia 04-04-2011)



publicado por brunomoutinho às 17:20
editado por filipe-monteiro em 05/04/2011 às 12:17
link do post | comentar | adicionar aos favoritos

Quarta-feira, 30 de Março de 2011
Demos gráfica e técnica - aula 30.03.11

Na aula apresentámos já alguns mockups da demo gráfica e filmámos a demo técnica.

 

Para o video explicativo da demo técnica vamos dar uso às seguintes "peças" exemplificativas:

 

Peça 1:

 

 

Peça 2:

 

 

Peça 3:

 

 

Video da demo técnica do ponto de vista do utilizador:

 

 

 

Quanto à técnica em si:

É adicionada uma nova peça a uma base de dados MySQL sendo que, nesta demo, apenas são inseridos os campos: título, imagem e campo (texto). Criámos também um ficheiro PHP que acede à base de dados e invoca a informação relativamente ao ID recebido via método $_GET: http://www.impakt.com.pt/aulas/projecto/index.php?cat=ID . Todo este URL é então passado para QR. Para esta demo recorremos a um gerador de código QR online (http://qrcode.kaywa.com/) , mas pretendemos optar pela implementação futura de uma API que gere automaticamente o código QR relativo ao URL de cada peça, na altura em que esta é inserida pelo administrador na base de dados via backoffice.

 

Os códigos QR criados são então expostos juntamente com as suas peças. Neste caso, criámos 3 peças (2 encontradas no Louvre e 1 no museu de Aveiro). Ao apontar a câmara do telemóvel para o código QR, durante a utilização de um leitor de código QR, o utilizador descodifica o código e é reencaminhado para o browser onde é disposta toda a informação encontrada na base de dados referente a essa mesma peça.

 

Informações técnicas adicionais:

PHP / MySQL



publicado por brunomoutinho às 11:54
editado por mariajcampos em 01/04/2011 às 13:35
link do post | comentar | adicionar aos favoritos

Sessão de orientação 29.03.2011

Na reunião com o orientador ficou decidido que nesta primeira fase vamos desenvolver a aplicação online, sendo que desta forma já temos ferramentas para trabalhar na demo técnica e posteriormente numa fase de desenvolvimento mais avançado podemos fazer uma aplicação offline simplificada em Java.

 

Em relação à demo gráfica vamos concluir os mockups e fazer uma pequena animação em flash mostrando como funciona do ponto de vista do utilizador.

 

A demo técnica vai ser demonstrada em vídeo: o telemóvel através da câmara lê o código QR e é redireccionado para um conteúdo colocado por nós. Vamos também colocar códigos QR no blog para que os visitantes possam comprovar o seu funcionamento.

 

O orientador facultou-nos hoje o segundo equipamento de testes, Samsung Galaxy S, uma vez que até agora só tinhamos um telemóvel do mesmo modelo de um dos elementos do grupo e estávamos a testar aí as soluções que encontavamos para a realização do projecto. Os restantes elementos só tinham acesso ao telemóvel quando nos reuniamos o que dificultava, por vezes, a resolução do trabalho, tendo agora um equipamento que pode ser partilhado pelos restantes membros que não têm smartphone, facilita bastante o processo. 




Terça-feira, 29 de Março de 2011
Demos gráfica e técnica - aula 28.03.11

A equipa de trabalho esteve, durante o fim-de-semana, a pesquisar algumas possíveis soluções para que aplicação funcione tanto online como offline, já que têm surgido complicações para fazer com que a exportação dos conteúdos para o Android resulte. Pensámos também numa possível solução híbrida mas não encontrámos soluções satisfatórias. Ao expôr o problema ao professor na aula de hoje , ele sugeriu novas abordages do problema, com possíveis soluções como, investigar sobre o anuncio recente de flash (10.1) para Android (2.2), mas verificámos que além de ainda estar em desenvolvimento, não permitia a utilização da câmara do telémovel, que é um acessório essencial no nosso projecto. 

Depois desta nova pesquisa e brainstorming com a ajuda do professor, pusemos em questão a viabilidade da aplicação funcionar off-line dentro do prazo, já que só, até agora, a tal abordagem híbrida é que tem estado mais perto de apresentar resultados tangíveis (para não ser completamente on-line). Na reunião com os orientadores, amanhã, temos como objectivo definir efectivamente os moldes em que se vai desenrolar o projecto, tendo em conta o tempo disponivel e os recursos de que dispomos.

Quanto à demo gráfica,continuamos o trabalho com o Balsamiq, o qual vai avançado e deixou satisfeito o professor.



publicado por eduardojose às 00:43
editado por mariajcampos em 30/03/2011 às 10:32
link do post | comentar | adicionar aos favoritos

Domingo, 27 de Março de 2011
Novas abordagens

Enquanto procurava frameworks que possibilitassem a utilização de PHP e exportação da mesma para Android surgiu-me a ideia de pesquisar sobre outras possíveis abordagens para a concepção e desenvolvimento da nossa aplicação.

 

No início do projecto tinha-nos surgido a ideia de criar uma aplicação web que poderia ser acedida pelo utilizador via browser e que tivesse todas as características que pretendiamos com o projecto (leitura do código de QR, reencaminhando o utilizador para uma pagina onde pudesse visualizar toda a informação desejada sobre uma determinada peça). No entanto, visto que esta aplicação Web só poderia estar acessível quando o utilizador se encontrasse online, e visto também que a aplicação deve funcionar em ambiente offline sem acesso a qualquer rede, esta ideia foi posta de parte.

 

Uma hipotética solução para este inconveniente seria o armazenamento dos ficheiros da aplicação localmente, que permitisse ao utilizador o acesso local. No entanto existem 2 problemas: para a leitura de ficheiros de PHP seria necessária a instalação de uma aplicação que os interpretasse localmente, sendo que, assim, seria necessário o utilizador instalar 3 aplicações: interpretador PHP, leitor código QR e a nossa própria aplicação; para além disto, não é de maneira alguma seguro disponibilizar código PHP (ou qualquer outra programação server-side) já que pode tornar toda a aplicação bastante vulnerável.

 

Como tal, pesquisei por aplicações que permitissem guardar todo o conteúdo encontrado num determinado domínio localmente, sendo que nenhum código PHP seria disponível para o utilizador.

Encontrei a seguinte:

http://www.httrack.com/

 

O que esta aplicação permite é efectivamente guardar toda a informação encontrada num domínio, sendo que é possível ignorar ficheiros como vídeos (para não sobrecarregar o disco local).

 

Assim, seria possível a abordagem híbrida online/offline: para a utilização online, o utilizador é simplesmente redireccionado para a aplicação Web ao descodificar o código QR. Se este se encontrar offline ou sem rede, pode simplesmente ser redireccionado para o ficheiro local com a informação desejada.

Para a actualização da aplicação, o utilizador teria de se dirigir a um "hotspot" para o efeito num museu, por exemplo. Aqui, um responsável pela actualização dos dispositivos dos utilizadores transferiria os ficheiros para o dispositivo do utilizador, preparando-o assim para utilização offline. Estes ficheiros seriam preparados diariamente por esse mesmo responsável utilizando a aplicação indicada.

 

EDIT: Depois de testar no Android posso confirmar que esta abordagem de facto resulta. Pode também ser criado um shortcut para acesso mais directo mas tendo em conta que a aplicação de leitor iria direccionar o utilizador para a aplicação de qualquer maneira, a criação do mesmo não seria essencial.




Actualizações – demo gráfica

 

Aqui ficam alguns exemplos dos mockups que estamos a desenvolver para a demo gráfica.
 
 
 
 
Ecrã inicial

 

 

Ecrã de informação complementar acerca do POI (ecrã que aparece após leitura do código QR)
 
 
 
 
Ecrã onde o utilizador pode votar acerca do POI
 
 
 
 
Ecrã da plataforma de comentários

 


tags: ,

publicado por mariajcampos às 17:11
editado por filipe-monteiro às 20:57
link do post | comentar | adicionar aos favoritos

Sexta-feira, 25 de Março de 2011
Frameworks p2

 Depois de alguma exploração e experimentação, a framework PhoneGap está finalmente utilizável.

A utilização de emuladores de Android acaba por não executar o código inserido, mas quando tentei ligar o meu próprio telemóvel (Samsung Galaxy S, c/ Android) por USB e correr a aplicação nele, o resultado foi completamente diferente.

 

 

Próximos passos:

 

implementação de um leitor de QR na aplicação;

exposição de informação consoante o ID inserido no código.




Quinta-feira, 24 de Março de 2011
Alteração nas tabelas de requisitos funcionais e não funcionais

Na última sessão de orientação e por indicação dos professores, procedemos a uma pequena alteração nos requisitos funcionais e não funcionais. Existia uma área - LEITURA DE DADOS - presente nos requisitos funcionais que devia estar nos requisitos não funcionais. Aqui fica a alteração:

 

Tabela de requisitos funcionais:  requisitos_funcionais_utilizadores.pdf

 

Tabela de requisitos não funcionais:  requisitos_nao_funcionais_utilizadores.pdf




Demos gráfica e técnica – aula 23.03.11

Começámos a elaboração da demo gráfica utilizando o balsamiq mockups, não tendo encontrado dificuldades na sua execução.

 

Neste momento as nossas principais preocupações prendem-se com a demo técnica, para a qual estamos à procura de ferramentas que nos possam auxiliar no seu desenvolvimento. Falámos com o docente sobre as nossas questões e decidimos que a acção importante a demonstrar com a demo técnica, é a leitura do código QR e a sua ligação aos conteúdos que serão visualizados, sendo que neste caso não é necessário haver um conteúdo concreto, mas mostrar que esta ligação entre a leitura do código e a mostra de conteúdos é exequível.

 

O grupo comprometeu-se a pesquisar soluções e vai reunir-se amanhã para analisar qual a mais viável começar a realização da demo técnica e concluir a demo gráfica.

 




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

1
2
3
4

5
6
7
8
9
10
11

12
14
15
17
18

19
20
21
23
24
25

26
27
28
29
30


.posts recentes

. Mobile Tourist Guide / se...

. Back Office

. Reunião de grupo – 13.06....

. Módulo 6 - testes

. Módulo 6 – Versão beta

. Testes de usabilidade

. versão beta e testes – au...

. Actualizações – testes

. Ponto de situação – OT 01...

. Versão beta e testes – au...

.arquivos

. Junho 2011

. Maio 2011

. Abril 2011

. Março 2011

. Fevereiro 2011

.tags

. todas as tags

.participar

. participe neste blog

blogs SAPO
.subscrever feeds