Category: Interatividade

PopPlaces – A gente se vê no GDD!

Esse ano eu tive uma idéia pra concorrer ao Google Developer Day HTML5 Open Call e se chama PopPlaces.

O que é o PopPlaces?

Um aplicativo que integrou as funcionalides do Google Maps e do Foursquare em uma interface HTML5.

A idéia era encontrar lugares próximos a você ou do centro da cidade onde você mora que são populares, interessantes e merecem uma visita, meu hobby é viajar e às vezes tenho esse problema, chego numa cidade que não conheço ninguém, ou poucas pessoas, quero sair mas não sei pra onde. Tá aí, PopPlaces :)

Mais detalhes sobre o jogo eu expliquei no blog de inovação da MadeinWeb: http://inovacao.madeinweb.com.br/m628-36/postagens/popplaces_-_experiencias_com_html5

Sobre o desenvolvimento, lembrei uma palestra sobre YQL do Guilherme Chapiewski, onde ele citou que você não precisava desenvolver tudo do zero, com todas APIs e Web Services disponíveis hoje na internet você poderia fazer um aplicativo interessante em pouco tempo, então foi aí que eu pensei, vou usar o Google Maps junto ao Foursquare e um demo de HTML5 que desenvolvi há um tempo atrás em um aplicativo só.

Foi 1 semana de desenvolvimento (20 horas) na MadeinWeb e o resultado ficou muito bacana.

Não sei se alguém lembra, mas o demo de HTML5 que utilizei nesse projeto foi postado dia 21 de dezembro de 2010: http://www.andersonferminiano.com/blog/2010/12/html-5-canvas-demo/

Brinquei com Geolocation, localStorage, CSS3 e tudo que achei interessante usar nesse projeto.

Se você tiver com vontade de jogar, acesse:

http://gdd11.madeinweb.com.br/

É importante salientar que se trata de uma experiência HTML5 e possui melhores resultados utilizando o browser Google Chrome, porém também funciona nas últimas versões do Mozilla Firefox, Opera, Safari.

Controle o avião pelas setas do seu teclado, segure a seta para cima a fim de decolar ou solte-a para aterrissar em algum local.

E também fiz um vídeo para mostrar como funciona:

Dia 17 desse mês sairá o resultado dos classificados pela Google e eu volto aqui no blog pra noticiá-los o que rolou :D

Bjs

Meu primeiro artigo na Nettuts+

Há uns 9 dias eu escrevi um artigo para postar na Nettuts+ e ver o que que dava, fiz um demo com box2D e HTML5 que se encontra aqui: http://www.andersonferminiano.com/blog/2011/06/html5-box2d-adventure-game/

O artigo foi publicado dia 1o de julho, hoje estão sendo marcados dezenas de sites/blogs com o mesmo artigo, 134 facebook likes, alguns tweets referenciando pelo search, 35 comentários e 2 emails com propostas de outros blogs/empresas.

Ele se encontra em 1o na lista de artigos de Javascript/AJAX, então esses números ainda devem crescer.

Algumas screenshots:

Build your First Game with HTML5

Lista de artigos Javascript/AJAX

Twitter Search - alguns tweets

(como eu estava viajando, só hoje eu fiz a requisição p/ trocarem meu nome para “Anderson Ferminiano” que é como eu me identifico em todos meus trabalhos e a descrição)

Link para o artigo:

http://net.tutsplus.com/tutorials/html-css-techniques/build-your-first-game-with-html5/

Abs

Sketch a Joke em HTML5?

Logo que lancei o Sketch a Joke fui questionado pelo Ivan Rosolen o motivo de ter usado Flex e não HTML5… haha

O título não tem muito haver com o que foi desenvolvido, só desenvolvi +1 demo utilizando a canvas API e não, não estou pensando em migrar o Sketch a Joke p/ HTML5, não agora :D

Bom, taí: http://andersonferminiano.com/html5/studies/sketchajokehtml5/

Podem brincar, utilizem o mouse pra desenhar linhas coloridas pela tela haha

E depois de muito tempo, agora tenho um github https://github.com/andferminiano, ainda não tem nada postado, mas vou postar em breve alguns códigos de HTML5, AS 3.0, Objective C (iOS) e talvez PHP.

Abs

HTML 5 – Device Orientation

Bom galera, essa semana fiz um vídeo demonstrando algumas features do HTML5, a idéia era mostrar apenas device orientation mas acabei mostrando no vídeo algumas outras referências e APIs como a Geolocation.

Assistam o vídeo, é auto-explicativo :)

A qualidade do vídeo ficou ruim para leitura, assim que tiver mais tempo exportarei novamente com melhor qualidade.


http://vimeo.com/andferminiano/html5deviceorientation

Demos:

andersonferminiano.com/​html5/​studies/​abstractimage/​
andersonferminiano.com/​html5/​studies/​abstractimagedevice/​

Google Developer Day HTML5 slides:
slides.html5rocks.com/​#slide-orientation

DeviceOrientation W3C docs:
dev.w3.org/​geo/​api/​spec-source-orientation

Referência:
html5rocks.com/​

Abraços!

jQuery ScrollPagination

Faz um bom tempo que não posto códigos né? Haha..

Bom, fica aí um plugin de jQuery que desenvolvi, simples e prático.

Ajuda no desenvolvimento de paginações (que entraram em moda) com base no movimento da sua barra de rolagem vertical ou scroll, como quiser chamar. É uma biblioteca flexível e grátis para utilizar em qualquer projeto que queira, apenas peço que mantenha os créditos.

Link oficial para o site do jQuery Plugins:

http://plugins.jquery.com/project/scrollPagination

Link para exemplo:

http://andersonferminiano.com/jqueryscrollpagination/

Download do código fonte:

http://andersonferminiano.com/jqueryscrollpagination/jqueryscrollpagination.zip

É isso, abs!