Tecnologia à tona

Diagrama de Classes: ActionScript 3.0

2009-04-26T15:21:00.006-03:00

Você anda estudando sobre UML? Então veja quão curioso é o diagrama de classes completo da API do ActionScript 3.0.
É uma pena que o diagrama não mostra nada à baixo nível, mas já é uma ótima referência para estudos. Para modelarmos uma nova API, seria realmente algo bem semelhante.

Faça o download do diagrama em PDF.

Deu bug no layout?

2009-02-17T14:51:00.006-03:00

Quem nunca passou por esse problema?

É incrível como há diferenças de interpretação nas CSS dentre diversos navegadores.

Mas existem meios de não ficarmos às escuras disso tudo.

CSS Reset:

Primeiro de tudo é preciso ter boas práticas de CSS. Se adquirirmos maus ensinamentos, fazendo gambi em todo o documento, é bem provavel que teremos muito mais problemas de compactibilidade entre os navegadores do que se adotarmos uma. Existem várias práticas para um "CSS Reset", há um post no blog do Tableless falando um pouco sobre o assunto. Particularmente, eu costumo utilizar apenas o reset dos atributos margin e padding de todos os elementos, como mostra o código a seguir, bem simples.

* {margin: 0; padding: 0;}

Browsershots.org:

Aqui você pode selecionar vários tipos de navegadores rodando no sistema operacional de sua escolha para aplicar seus testes, vai demorar em média 5min para tirar seus screenshots, mas ao menos você saberá como acabou ficando nos navegadores/SO's selecionados.

Internet Explorer, a maior dor de cabeça de todo o mundo:

É uma complicação para instalar mais de uma versão do Internet Explorer na mesma máquina. Por causa disso, existem um grupo de desenvolvedores que estão trabalhando em um único navegador, com a única finalidade de testar as páginas escolhendo em qual versão do IE você quiser. O IETester, atualmente em sua versão 0.3 ja permite abrir abas de IE5.5, 6, 7 e 8RC1.

Adorei este software pois ele não simula somente a interpretação de CSS e HTML, mas também toda a engine de Javascript dos respectivos IE's.

Enfim, a boa notícia é que você pode corrigir seu layout. A má é que isso vai dar um pouco de trabalho. :)

Infelizmente não existe fórmula mágica.

ExtJS: O que é bom, é opensource

2009-01-28T13:14:00.007-02:00

A ExtJS é uma grande biblioteca escrita em Javascript para auxiliar na construção RIAs.

Com ela você é capaz de fazer formulários, validação, listagem em tabelas, User Interface, janelas dentro da aplicação, mensagens de diálogo, abas de navegação, campos de data, entre outros.

Não é necessário pesquisar por nenhum plugin de terceiros para você ter um certo componente funcionando como o esperado. Esta biblioteca é super completa.

O Combobox dela, por exemplo, é o componente do qual mais gostei. Veja aqui um exemplo dele em execução.

Seus códigos em lado servidor ficam mais limpos; a aplicação se torna mais intuitiva; o risco de bugs é menor; funciona perfeitamente nos browsers mais utilizados; e o melhor: tudo isso de graça.

Para saber mais sobre ExtJs, visite o site oficial.

SQL com todas as cidades e estados do Brasil

2008-12-11T15:27:00.005-02:00

Depois de bastante tempo pesquisando consegui encontrar um SQL para criação de uma tabela de Estados e Cidades, contendo as informações do nosso país.

Fiz algumas modificações nas tabelas, pois as informações das quais necessitava eram apenas os nomes dos Estados e das Cidades. Então, essa versão que estou disponibilizando não contém CEP, ok? :)

A tabela de Estados contém os seguintes campos: estado_id, nome.
E a tabela de Cidades contém: cidade_id, estado_id, nome.

À princípio os dados estão 100% corretos, a menos que tenham surgido novas cidades no País desde que a primeira versão foi criada.

Faça o download do SQL aqui

Trote do Deckard Cain

2008-10-26T19:37:00.002-02:00

Deckard Cain é um velho sábio presente em todas as versões do jogo "Diablo". Confira abaixo alguns trotes aplicados em telefonistas de tele-marketing utilizando famosas falas deste personagem:

Navegue em fotos tridimensionais com Photosynth

2008-09-04T19:12:00.000-03:00

Este é o novo conceito de visualização de fotos na internet, proposto pela Microsoft.
Com um pequeno Pluggin no seu navegador, você pode vê-las de uma maneira inovadora: em três dimensões.

No Photosynth, o modo como elas são vistas pode ser comparado ao do Google Earth, com aproximação e rotação de câmera. Além de existir uma visualização própria do programa em pequenos pontos coloridos, que formam o ambiente.

Para montar o seu ambiente em 3D, você deve enviar uma quantidade mínima de 10 imagens. A qualidade e veracidade da representação criada dependem de vários fatores, como resolução, ângulo, posicionamento, iluminação, etc.

Confira abaixo um vídeo de demonstração do Photosynth:

Arte desviante

2008-08-22T16:54:00.018-03:00

Se você é do mundo artístico, já deve ter visitado o deviantArt alguma(s) vez(es).
O site está no ar desde o ano de 2000, e hoje conta com um repositório imenso dos mais variados tipos de arte, tendo cerca de 80.000 contribuições diárias pelos usuários.

Todo o material disponível está sob uma das licenças Creative Commons, permitindo, ou não, o uso comercial e alterações da obra.

Se você procura por tutoriais, modelos 3D, vetores, fontes, texturas, recursos para um aplicativo específico (Photoshop, Flash, Illustrator, etc.) ou algo do tipo, clique aqui e veja o que este site tem para oferecer.

Para os pervertidos de plantão, também existe uma área de "Retrados de Fetiche" (sorte que fotos femininas são a maioria).

Eu fiz a minha contribuição para o site, faça a sua também! ;)

Firefox: Add-ons úteis para desenvolvedores

2008-08-18T21:27:00.007-03:00

Veja abaixo alguns Addons selecionados para desenvolvedores:

Firebug: Com certeza, um dos melhores addons para o Firefox. Veja detalhes sobre todas as requisições HTTP (incluindo Ajax); depure HTML, CSS, Javascript; execute códigos diretamente na página e muito mais.

Web Developer Toolbar: Desativar Javascript e Cache são um dos seus maiores diferenciais; Você ainda pode checar todos os elementos de sua página; Redimensionar o navegador precisamente; Adicionar e editar seus Cookies; Validar HTML e CSS; etc.

ColorPicker: Descubra todas as cores utilizadas em uma página-alvo com este addon. É permitido copiar a definição da cor selecionada em diversos formatos (RGB, hexadecimal)

User Agent Switcher: Permite trocar o "User agent" do navegador com um simples clique.

Prós: Você não precisa mais abrir diversos navegadores para fazer seus testes.
Contras: A troca de User agent não afeta em nada na renderização das páginas.

ShowIP: Veja o IP, Whois, timing, traceroute, ip2country da página que estiver navegando e muito mais.

Português brasileiro no GTA 4?

2008-08-16T15:01:00.004-03:00

Isso mesmo. Espero não vulgarizar (tanto) o conteúdo deste blog com estas coisas, mas confesso que achei o máximo a interpretação e voz destes brasileiros no Grand Theft Auto 4.

Assita o vídeo abaixo:

Aproveite e "Vai pra casa do caralho!".
Brincadeirinha...

Os melhores plugins da jQuery

2008-08-15T22:25:00.010-03:00

Se você é da área de Desenvolvimento Web, provavelmente já tenha utilizado, ou ao menos ouvido falar, na jQuery.

Um dos maiores benefícios desta biblioteca escrita em Javascript - além de ser robusta e lhe poupar muito trabalho em várias rotinas, de AJAX, por exemplo - são os seus mais diversos plugins.

Veja a seguir alguns dos plugins mais utilizados que selecionei. Verifique em cada um dos links as informações sobre como utilizá-los, em geral, por fazerem parte desta grande biblioteca, seu uso é bem fácil.

Opções para galeria de fotos:

Tooltips:

Outras utilidades:

Se quiser sugerir algum outro bom plugin, sinta-se à vontade para comentar!

Você sabe o que é um Abandonware?

2008-08-08T18:19:00.012-03:00

Abandonwares são softwares antigos cujos direitos autorais já não tem mais importancia para os desenvolvedores, devido à descontinuidade do mesmo ou pela abdicação de suas vantagens econômicas.

Você pode fazer o download de vários jogos abandonados no site da Abandonia gratuitamente. Alguns deles não podem ser baixados ou não apresentam extras, como descrição ou histórico, mas todos eles acompanham uma ou mais screenshots. O site é atualizado frequentemente, vale a pena conferir de vez em quando. Vale lembrar que não é apenas a Abandonia que oferece este serviço de download de antiguidades. A Abandonware Ring divulga uma lista completa de sites no ramo.
O game da foto se chama "Abandoned Places", veja mais detalhes dele clicando aqui.

Existem algumas polêmicas sobre a distribuição de softwares deste tipo, porém muitos desenvolvedores levam para o lado da diversão e da "imortalidade" dos seus antigos produtos e apoiam esta iniciativa.

Jogos Open Source

2008-08-07T13:26:00.022-03:00

Muitas vezes apenas estudar sobre desenvolvimento sem ter uma base em algo já concretizado não é uma tarefa fácil. A dúvida sempre persiste: "Será que está correto desta maneira?".
Então analizar alguns códigos-fonte alheios é uma ótima alternativa para que esta pergunta seja respondida.

Existe uma variedade imensa de jogos de código aberto com boa qualidade, tanto visualmente quanto em sua implementação, disponíveis para download na internet.

Veja alguns projetos interessantes:

Frets on Fire
Jogo completo, se tornou muito bem falado pelos gamers amantes de Guitar Hero. Multi-plataforma, este jogo tem suas versões para Windows, Linux e Mac OS X.
Foi desenvolvido em Python, utilizando as bibliotecas PyGame, PyOpenGL, Amanith Framework, PyAmanith, entre outras.

VDrift
Ainda em desenvolvimento, em estado jogável, este jogo é um simulador de corrida de carros.
Escrito em C++, utiliza as bibliotecas SDL e OpenGL para os gráficos, Bullet para física e Vamos para simulação automotiva.
Atualmente disponível para Linux, FreeBSD, Mac OS X e Windows.
Licença: GNU General Public License (GPL) v2.

RocketCommander
Escrito em C#, utiliza a plataforma .NET 2.0 e DirectX.
Atualmente ja possui 7 mods para o game, sendo eles "Flower Commander", "Pizza Commander", "Fruit Commander", entre outros.
Também acompanha vários video-tutoriais para apoio.
Foi desenvolvida uma versão dele em XNA, junto de muitos outros games, também Open Source, disponíveis no XNAProject.net

The Mana World
Apesar dos graficos "ultrapassados" (que lembram Super Nintendo), TMW é um MMORPG, ainda em fase de desenvolvimento, e pode ser uma boa alternativa para se estudar técnicas de comunicação de cliente com servidor.
Licença: GNU General Public License (GPL).

Se deseja conferir mais alguns projetos, veja esta lista de jogos de código aberto para windows, esta lista geral sobre o assunto no Open Directory Project ou no Google Directory.
Bons estudos! :)

Dicas para melhorar posicionamento e indexação no Google

2008-08-05T21:59:00.006-03:00

Existem vários fatores que influenciam no posicionamento do seu website nos resultados dos buscadores. Mas alguns deles são excenciais para um melhor posicionamento, tentarei passá-los para você de uma forma bem simples e direta:

Título: Crie títulos descritivos, não com apenas o título propriamente dito do seu website. Se você está na area de "Contato", por exemplo, Utilize: "Meu título - Entre em contato". Lembrando que são lidos apenas os 60 primeiros caracteres, então, não ultrapasse.
Exemplo: <title>Tecnologia à tona - Dicas de SEO</title>

Descrição: Nunca se esqueça de utilizar a meta tag "description". O conteúdo dela deve alguma ligação com o da sua página em si. Utilize também descrições diferentes para cada página no seu site.
Exemplo: <meta name="description" content="Saiba como melhorar o posicionamento e aprimorar a indexação do seu website nos buscadores." />

Palavras-chave: Utilize palavras-chave que existam no conteúdo da sua página; Crie palavras-chave diferentes para cada página do seu site. Se o seu assunto mudar, o mínimo que seja, de uma página para a outra, você ja tem motivos para adicionar alguma palavra, ou retirar outras; Suas palavras devem ser, obrigatóriamente, separadas por vírgula; É preferível utilizar todas as letras em minúsculo, porém não existe uma regra para isto;
Muitas keywords não significam que seu site será encontrado facilmente, você deve selecioná-las com cuidado. O limite é de 120 caracteres (contando espaços e as vírgulas)
Exemplo: <meta name="keywords" content="seo, dicas, marketing online, google, marketing de busca" />

HTML semântico: Basicamente utilize tags html corretamente nos seus devidos lugares. Utilizar tableless é um bônus. Leia um pouco mais sobre o assunto neste artigo da Tableless
Exemplos: <strong> para frases em destaque;
<h1> para o título principal; <p> para parágrafos; atributo alt nas imagens (<img src="..." alt="Assunto da foto" />).

Robots.txt e sitemap: Deixe sempre na raiz do seu site um arquivo chamado "robots.txt", e permita que ele acesse o(s) seu(s) sitemap(s).
Exemplo:
```
User-agent: *
Allow: /sitemap.xml
Disallow: /administrador
```
Gere o seu sitemap automaticamente aqui, e o seu robots.txt aqui.

De otimizações manuais, estes são os pontos mais importantes. Também deve-se levar em conta que quanto maior o número de sites que apontam para o seu, melhor vai ser o seu posicionamento e o seu pagerank no Google.

Você ja ouviu falar no Google Webmaster tools? Vale a pena você participar lá. Completamente em português, ele te dará ainda mais algumas dicas, lhe informará sobre todas as palavras-chave realmente presentes no seu site e muito mais.
Basta você confirmar a autoridade do site fazendo upload de um arquivo HTML via FTP para o seu servidor, ou optar pela forma mais simples: adicionando uma meta tag de verificação.

Se você tem um blog, também é interessante adicionar a URL do seu RSS nos sitemaps desta ferramenta para Webmasters.

Simulador de física

2008-08-05T14:14:00.004-03:00

Você nunca gostou das aulas de física? O Phun, um software de simulação de física em 2D, é um aplicativo muito divertido que lhe ensina algumas noções básicas sobre a matéria.
Ele pode até ser considerado um jogo, pela sua interação e diversão, mas o objetivo do Phun é mesmo focado no aprendizado.

O "diversão" envolve gravidade, resistência do ar, movimentação de fluídos, massa, aceleração, inércia, lei da ação e reação, e muito mais. O depoimento dos usuários não é outro: "Phun is really fun."

É realmente muito divertido. Assista ao vídeo e descubra algumas das possibilidades que a ferramenta apresenta:

A Phun é gratuita e você pode baixá-la clicando aqui.
Lets phun!

Bancos de imagem gratuitos

2008-08-04T21:22:00.005-03:00

A busca de imagens do Google não é um dos melhores lugares para se buscar uma foto boa e de alta qualidade. Muito menos se você estiver procurando uma variedade de fotos.

Você vai ficar de boca aberta com os resultados de qualquer busca no Stock.XCHNG. Um banco virtual de fotos sem restrição para download que conta com uma variedade assustadora de imagens gratuitas e de qualidade (Quase todas elas tem tamanho superior a 1000x1000px).

Basta criar uma conta no site, também gratuitamente, para começar suas pesquisas e seus downloads.

Outra boa alternativa é o EveryStockPhoto. Este já não precisa de cadastro e faz suas buscas diretamente no banco anterior (Stock.XCHNG) e no Flickr, porém com resultados menos precisos.

Estes dois são os mais completos que conheço, se você conhece algum e gostaria de compartilhar, sinta-se à vontade para dar o seu palpite. :)

Um coelho inteligente

2008-08-04T13:47:00.010-03:00

Lançado no final de 2006 com o objetivo de se tornar uma febre, como foi o Tamagotchi, o Nabaztag, que significa "coelho" em armênio, ainda não é muito falado aqui no Brasil.

Este coelho, conectado numa rede Wi-Fi (sem fio), pode lhe informar quando você recebe emails novos, ler notícias atualizadas, prever o tempo para amanhã, tocar músicas em mp3 e servir como despertador. Além de ser interativo e engraçado ele tem sua própria personalidade e pode interagir com seus parceiros Nabaztags.

Interessante não é? Na teoria parece que sim. Se quiser conferir um pouco mais de perto, veja alguns videos dele no YouTube e saiba mais sobre no site em português.

Analise e otimize o seu website

2008-08-03T23:32:00.006-03:00

Atualmente otimização de um website é algo muito importante, tanto para o diminuir o tempo de carregamento, quanto para economizar na carga do seu servidor.
Como todo webdeveloper que preste, você precisará do Firefox instalado na sua máquina.

Um dos melhores recursos do Firefox, no ponto de vista do desenvolvedor, é a vasta quantidade de add-ons disponíveis para integração à este navegador, como IRC, buscador de cores, etc.

Chega de introdução e vamos ao assunto do post em si.
O add-on que ajuda a analisar e manipular todas as requisições, HTML, CSS, Javascript, rede e DOM, ja é bem conhecido pelos desenvolvedores, e você também ja deve conhecer: chama-se Firebug.

Mas a novidade agora é um outro add-on que é integrado ao próprio Firebug: chama-se YSlow. Desenvolvido pela Yahoo!, este add-on além de lhe mostrar um relatório super completo com vários tópicos do que pode ser otimizado na página analisada, ainda lhe mostra vários links com as informações necessárias para você conseguir colocar em prática esta otimização.

Na documentação da OpenSocial do Google (logo postarei mais sobre o assunto), eles estão indicando esta ferramenta para analisar as aplicações na plataforma.

Bom trabalho, porque o caminho não é muito curto! :)