10 Ajax, CSS, HTML, PHP, Javascript galerias de imagens
Artigo publicado em January 27, 2008 as 9:55 pm
Uma potente galeria em PHP/Javascript, no website oficial dizem ser uma solução de tamanho pequeno, mas eu acho que quase 200kb não é assim tão pequeno.
Pontos fortes:
- Para quem procura uma galeria e apenas isso, minishowcase da conta do recado
- Rapidez, claro que também depende do servidor, mas mesmo assim esta galeria de imagens é rapida.
- Fácil de instalar.
Pontos fracos:
- É uma galeria (e apenas isso), sendo assim é dificil integrar com o resto do website
- Opções, são varias mas básico.
Site oficial: Minishowcase
Exemplo oficial: Minishowcase Demo
Instruções oficial: Minishowcase Instruções
AJAX Slideflow Control - estilo iPhone?
Para quem procura uma galeria do estilo do iPhone, esta é a solução mais parecida de momento.
Pontos fortes:
- O efeito visual é sem duvida bastante atractivo
- Fácil integração com outras paginas que já tenhas no teu website
Pontos fracos:
- Ter que preparar as imagens todas em photoshop
- A sério o factor de ter que criar 3 imagens (esquerdo/centro/direito) em photoshop torna-se bastante cansativo
- Ter que criar o ficheiro xml
Site oficial: Mediaeventservices
Exemplo oficial: Mediaeventservices Demo
Instruções oficial: Mediaeventservices Instruções
ZenPhoto é talvez uma das plataformas mais completas para quem quer ter uma galeria de imagens na web.
Pontos fortes:
- Index, Albums e imagens
- Cria automaticamente thumbnails
- Podes adicionar imagens através de FTP ou através do browser
- Os visitantes podem comentar cada foto ou imagem
- Ajax edita enquanto navegas pela a galeria
- Themes, podes criar a tua template ou podes fazer download de algumas ja existentes
- Varias maneiras de procurar, através de datas, tags, titulo e descrição
Pontos fracos:
- Quando o visitante esta a ver as tuas imagens em tamanho inteiro cada vez que muda de imagem o pedido não é atraves de Ajax
Site oficial: Zenphoto
Exemplo oficial: Zenphoto Demo
Instruções oficial: Zenphoto Instruções
SmoothGallery é uma galeria que usa bastante tecnicas de Ajax, as vezes ate parece ser criado em Flash.
Pontos fortes:
- O display
- A suavidade entre mudanças de imagens
- Fácil de integrar com o teu website, não é apenas um standalone
Pontos fracos:
- Quando o visitante clica para ver a imagem em tamanho normal, não existe a opção para voltar para a galeria
Site oficial: SmoothGallery
Exemplo oficial: SmoothGallery Demo
Instruções oficial: SmoothGallery Instruções
Pyxy-gallery é mais uma galeria em PHP e Javascript que usa lightbox.js para mostrar as imagens da galeria.
Pontos fortes:
- Apesar de uma ajax para mostrar as imagens numa só pagina é possível fazer o bookmark a imagens individuais.
- Super leve
Pontos fracos:
- Beta, falta limar ainda alguns pormenores.
- Visualmente não é a galeria mais atractiva.
Site oficial: Pyxy Gallery
Exemplo oficial: Pyxy Gallery Demo
Instruções oficial: Pyxy Gallery Instruções
Couloir é uma solução em Javascript, HTML e CSS que tenta ( e bem ) recriar uma galeria em Flash.
Pontos fortes:
- Excelente suavidade entre as mudanças de imagem para imagem
Pontos fracos:
- Não existe suporte
- O código é oferecido com esta
- Não oferece a oportunidade de criar álbuns etc.. é apenas mesmo um visualizador de imagens
Site oficial: Couloir
Lightbox2 é talvez uma das lightbox conhecidas e usadas. Baseado nas seguintes frameworks, prototype e scriptaculous.
Pontos fortes:
- Suavidade de animação entre imagens é talvez uma das melhores
- Fácil de instalar
- Fácil integração com o teu website
Pontos fracos:
- Não é uma galeria completa como outras aqui apresentadas
Site oficial: Lightbox 2
Exemplo oficial: Lightbox 2 Demo
Instruções oficial: Lightbox 2 Instruções
TripTracker na minha opinião é excelente para quem tem umas quantas imagens no site e quer uma maneira agradável para os visitantes navegarem entre imagens.
Pontos fortes:
- Fácil de usar
- Fácil de instalar
- Fácil de integrar com o teu website design
- Excelente navegação entre imagens
- Opção para enviar a imagem por email
- Opção para criar um bookmark a imagem
Pontos fracos:
- Não é de borla
- Licença normal: $25
- Licença premium: $500
Site oficial: TripTracker
Exemplo oficial: TripTracker Demo
Instruções oficial: TripTracker Instruções
O que distingue Suckerfish HoverLightbox de outras soluções é o factor de poder criar uma barra de navegação de galerias em que o visitante basta passar com o rato por cima para aparecer uma caixa género “dropdown” com thumbnails das imagens.
Pontos fortes:
- Diferente de outras soluções
Pontos fracos:
- Talvez os visitantes mais “básicos” não percebam a primeira como ver as imagens
Site oficial: Suckerfish
Exemplo oficial: Suckerfish Demo
ThickBox oferece mais do que apenas uma maneira de ver imagens. Pode tambem mostrar paginas, divs, texto etc..
Site oficial: Thickbox
Exemplo oficial: Thickbox Demo
Instruções oficial: Thickbox Instruções
Shadowbox novo lightbox
Artigo publicado em January 26, 2008 as 10:11 pm
Shadowbox não é apenas mais uma lightbox, apesar de também ser usado para o mesmo efeito. Mas existe vários pontos interessantes nesta extensão como:
- Standards Shadowbox cria HTML valido que passa os testes por W3C.
- Frameworks normalmente uma extensão tem que ser usado com apenas uma framework, e todos nos sabemos que as vezes não usamos certas extensões pois não são compatíveis com a nossa framework escolhida. Shadowbox suporta varias frameworks como YUI, Ext, Prototype + Scriptaculous, jQuery e MooTools.
- Design fácil modificar o design da box, Shadowbox usa um sistema de skins em que basicamente basta modificar apenas um ficheiro CSS.
- Formatos Quicktime, Windows Media Player, Flash, Flash video e até paginas externas.
Sem duvida que extensão esta bem conseguída e o factor de poderes usar qualquer framework ajuda muito em escolher esta extensão para os próximos projectos.
Nova maneira de seleccionar datas
Artigo publicado em January 24, 2008 as 8:29 pm
Uma nova extensão para quem usa prototype. Desta vez é uma nova maneira de seleccionar datas, em vez dos tradicionais popups Ajaxorized introduz uma nova maneira, uma barra com datas e o usuário apenas necessita de clicar e arrastar.
Apesar de achar uma ideia original e interessante, acho que só resulta se for preciso o usuário escolher um um período de datas, pois fica difícil escolher apenas um dia.
Para mais informações e download visitem Ajaxorized.
Roxer, cria sites sem usar programação
Artigo publicado em January 23, 2008 as 9:33 pm
Roxer um novo website que convida a pessoas que queiram criar o seu primeiro website de uma maneira fácil e sem ter que ter conhecimentos em programação.
Sem ser necessário o download de nenhum plugin ou programa, Roxer funciona apenas online. Criado com base no Dojo, Roxer oferece ao utilizador varias funções como:
Drag e drop sendo fácil ao utilizador colocar na posição desejada tanto imagens como texto.
Um poderoso e completo editor de texto com as funções já mais conhecidas como alinhamento, cores etc…
Mudar o tamanho das imagens em tempo real.
Isto tudo sem escrever uma linha de código.
Mas claro tudo tem um preço ( e não, não é para usar a aplicação que é de borla), mas de momento o código produzido não é o melhor do mundo, e dificilmente será valido por W3C.
Primeira versão ao vivo
Artigo publicado em January 23, 2008 as 8:56 pm
Ai esta a primeira versão do PTAjax ao vivo.
O tempo tem fugido e outros projectos apareceram sem estarmos a espera, mas por fim a primeira versão esta agora “aberta” ao publico.
Espero que gostem.
Sem mais novidades, vamos voltar ao que interessa noticias do mundo “Ajax”.
Como sempre a vossa opinião é sempre bem vinda. E claro “bugs” são de esperar e tentaremos num espaço de uma semana conseguirmos eliminar todos.
Obrigado
PT Ajax V2
Artigo publicado em January 15, 2008 as 10:57 pm
A luta contra o relógio.
A tentar lançar a nova versão do PT Ajax, depois de mandarmos para o lixo o primeiro design, estamos a limar a segunda tentativa para o novo design.
De momento já estamos a testar e ate agora ainda não nos “fartamos” do design por isso possivelmente esta será num futuro breve o novo design.
Digam de livre vontade o que acham.

Drag e Drop com Scriptaculous
Este tutorial consiste em explicar como usar o prototype e o script.aculo.us para criar o efeito drag e drop. Analisamos todas as opções, mostramos como criar com exemplos práticos e visuais.
Uff.. Como usar Prototype para pedidos em Ajax.
Neste tutorial explicamos como podes começar a dar os teus primeiros passos na famosa framework prototype, um simples tutorial onde é explicado como podes fazer os teus primeiros pedidos em Ajax.






