knowledge is free

Apple Safari 4 - Beta

noreply@blogger.com (Adriano Laurindo) — Thu, 26 Feb 2009 15:00:00 +0000

A Apple lançou uma nova versão do seu navegador, o Safari versão 4, ainda esta em teste e trás muitas novidades (?!) já conhecida por outros browsers, como as abas no topo (Google Chrome) e uma tela com os sites prefesiros (Opera) e o Coverflow./ (Imagem)

Tele com os principais sites e Coverflow

Versão para windows

Alem de todas essas novidades, o navegador promete também muita velocidade.

Ainda não instalei no Mac, mas testando no windows, o novo Safari esta muito melhor.

É isso ae pessoal, para baixar a nova versão do Safari é só clicar aqui!

Abraços a todos

Escolher cores para projetos

noreply@blogger.com (Adriano Laurindo) — Thu, 26 Feb 2009 13:08:00 +0000

Fala rapaziada,

Com dificuldade em escolher uma boa combinação de cores parar usar em seus projetos? O site Color Scheme Designer te ajudará nisso.

Basta vc esolher o tipo de cor nos círculos que estão lá no inicio do site, e depois movimentar os pontos que estão no círculo colorido.

Se quiser observar como seria o resultado com a mistura das cores num site, basta clicar em: Light page exemple (para página clara) ou em Dark page exemple (para página escura)

Recomendo dar uma boa olhada neste site, ajudará bastante.

Abraços

Editor WYSIWYG: jwysiwyg com jQuery

noreply@blogger.com (Adriano Laurindo) — Thu, 26 Feb 2009 00:53:00 +0000

Fala rapaziada, muito tempo sem postar, hoje venho dar uma dica de editor, o jwysiwyg, um editor feito com o jQuery.

Observe a imagem abaixo.

Para mais informações, visite o site do projeto!

Abraços a todos

Fullscreen (Tela cheia) No flash

noreply@blogger.com (Adriano Laurindo) — Wed, 11 Feb 2009 23:04:00 +0000

Fala rapaziada,

depois de muito tempo sem postar, hoje vou mostrar como usar fullscreen utilizando o flash.

O procedimento é muito simples, mas precisamos fazer duas configurações:

- Código no flash (ActionScript 2)

- Código do HTML

Vamos, lá!

Abra o Flash - Eu estou usando o CS3;
Abra o painel action e digite o seguinte código:

O ideal é colocar em apenas uma linha.
Bom, o que estou fazendo alí, é mexendo na propriedade displayState (do Stage) que recebe uma verificação: se fullscreen esta normal, ele mete um fullscreen, se estiver fullscreen ele coloca em normal.
Alí esta no Frame, mas pode ser colocar num botão, aí dependerá da sua aplicação;
Agora exporte o filme e certifique-se de que seja gerado o HTML tbm.
Abra o o HTML em seu editor de texto preferido e faça as seguintes modificações:
Adicione os parâmetros allowFullScreen com o valor: true e o allowScriptAccess com o valor sameDomain. isso vai permitir que o flash dê o comando para o HTML.
Agora é só abrir o html e ver o efeito, eu sugiro que use o fullscreen em um botão: clique, ele abre, clique novamente, ele fecha.

É isso ae pessoal, espero que tenha sido útil esta dica.

Abraços

Procurando inspiração para Preloader em flash?

noreply@blogger.com (Adriano Laurindo) — Wed, 14 Jan 2009 19:19:00 +0000

Fala rapaziada,

Hoje vou dar uma dica de inspiração para aqueles que querem fazer um preloader (pré-carregador) de filmes em flash personalizados e com estilo.

O site é o http://www.prettyloaded.com/ Vale muito a pena a visita, é só abrir e ficar curtindo os preloaders sendo carregados um após o outro.

Alem do preloader, o site também mostra as informações sobre ele, ano, de onde é, enfim, não perca tempo! visite logo.

Abraços

Opa, fechei um novo site, e agora?

noreply@blogger.com (Adriano Laurindo) — Tue, 13 Jan 2009 19:29:00 +0000

Hoje mais um assunto sobre... Clientes! "objeto de: desejo e ódio".

Porque desejo e ódio? Por que passamos o tempo todo em busca deles e dias depois do contrato fechado (que é assunto para um outro post) ele começa a pedir coisas que não foram especificadas, mas isso não tem problema, porque vc pensou nisso e..... Esqueceu de documentar!

Você tenta argumentar com o cliente que isso vocês não tinham combinado e ele jura de pé junto que sim, que vocês haviam conversado e ele tinha deixado bem claro esta "nova" funcionalidade do projeto, o que fazer? a situação fica pior quando você finalizou o site, pretende começar um novo projeto AND o seu cliente não quer (mais uma vez o contrato aparece) pagar você porque "tal" requisito não foi desenvolvido.

E você obviamente, fica na mão do cliente e vai desenvolver pq afinal de contas, vc tem gastos! Faz o trabalho, recebe (com bastante dificuldade ainda) e pensa: "na próxima vou documentar TUDO". E esquece, e o problema retorna.

Então, digo para quem esta começando, tomem bastante cuidado com isso, fechou um novo trabalho? faça uma Check-list. Como por exemplo:

O site conterá:

Página inicial: Na página inicial conterá: Noticias (dinâmico) e chamadas para as páginas internas;
A empresa: Na página empresa, conterá textos e imagens referentes à empresa (estático);
Produtos: Nesta página conterá os produtos separados por categorias principais (estática) e secundárias (estática), com a listagem dos produtos (dinâmico);
.....

E assim por diante, deixe tudo bem claro, do que você vai fazer ou não, faça um documento bem detalhado, e imprima (duas cópias, uma sua e outra do seu cliente), de preferência em papel timbrado e peça para o seu cliente assinar, depois no decorrer do projeto, o que não estiver no documento, orce a parte. Acredite em mim, esta medida previne MUITA dor de cabeça.

Para quem não sabe:

Estático: Página que ficará "assim", até que alguém mexa no HTML do site manualmente, ficará da mesma forma;
Dinâmico: O conteúdo é atualizado por um painel de controle, sem que o cliente precise mexer no HTML.

Bom pessoal, por hoje é isso, esta é uma pequena e simples dica mas que você pode economizar muito com analgésico, pq as dores de cabeça irão diminuir significativamente.

Abraços a todos!

Cliente tem sempre razão?

noreply@blogger.com (Adriano Laurindo) — Mon, 12 Jan 2009 13:26:00 +0000

Fala rapaziada,

hoje venho com um assunto meio polêmico, aquela velha questão que todo mundo diz que o cliente (que esta pagando - eles sempre deixam isso bem claro) tem SEMPRE razão, mas, até que ponto?

Eu particularmente, não concordo com isso, principalmente na minha área, a de desenvolvimento de sites, já cancelei contratos por este motivo. Um destes casos vou relatar aqui.

A certa altura de 2008, fiz um site totalmente em flash para um cliente e tudo estava indo bem, estava tratando com um pessoal relativamente da área, que era o pessoal de marketing da empresa, fazia o briefing, desenvolvia o trabalho e apresentava, poucas mudanças depois, o projeto estava aprovado e era hora de trabalhar. Pois bem, para a minha "sorte" este pessoal sai da empresa e eu passo a conversar com a filha do dono da empresa e com duas estilista. Pronto, foi o meu terror.

Pessoas com NENHUMA formação no negócio querendo dar palpites totalmente nonsense. Não me importo que clientes deem palpites no meu trabalho, muito pelo contrario, as vezes é interessante você discutir (não brigar) sobre o trabalho e modifica-lo para melhorar. (isso aconteceu comigo recentemente e o trabalho ficou bem bacana) O problema meus amigos, é quando o cliente quer alguma coisa apenas por que... Ele quer! simples assim, argumento? bobagem, o Cliente paga, ele tem razão, você tem que fazer, certo? Não, totalmente errado! E é aqui que chegamos onde eu queria.

O Cliente me pediu uma coisa absurda, que era colocar um FULL BANNER (468 x 60 pixels) no MEIO do site, o qual não suportava esta publicidade, tentei argumentar, e NADA. Em determinada altura da nossa conversa "amigável" ela me larga: "Eu estou pagando, então você TEM que fazer", existe coisa pior para se ouvir? Pensei muitas coisas para xingar a menina, mas, respirei fundo e alguns Husss Fraba depois, tentei conversar com ela sobre uma melhor forma de fazer aquilo e consegui.

Bom, o que estou querendo dizer com isso é que na nossa área, não existe isso de "estou pagando", o nosso trabalho, é orientar o cliente com as melhores práticas para resolver um problema. Até isso me lembra uma coisa que o meu Professor de GP me disse: "Não pergunte ao cliente o que ele quer, pergunte qual o problema dele". TEORICAMENTE, (digo teoricamente pq não conheço a realidade de todos) nós estudamos pra isso e (mais uma vez) TEORICAMENTE nós sabemos o que é melhor para que o nosso cliente obtenha um bom resultado.

Então, escrevi tudo isso para dar uma pequena dica: Estudem, argumentem, pesquisem, façam da forma correta, por dois motivos:

O trabalho de vocês ficará mal feito.
O site do seu cliente não terá o resultado esperado.

Mas não digo isso como uma verdade absoluta, e SEMPRE ignorar o pedido/idéia do seu cliente, mas pensar no assunto, e ver se realmente esta idéia vai ajudar no projeto. E isso é importante principalmente para quem esta iniciando no desenvolvimento de sites (ou qualquer outra área) e esta fazendo o seu nome.

Resumindo a história deste meu cliente, não fiz da forma que ele quis fazer (como falei anteriormente), achei uma outra solução após alguns minutos de discussão sadia pelo telefone, dois dias depois ligo cancelando o contrato, ninguém merece tratar coisas do site da empresa com a filha do dono e mais duas que o máximo que fazem é entrar no MSN e ORKUT. (e não, não é pelo sexo feminino, já tive alguns episódios com homens tbm). Não sou machista a tal ponto, muito pelo contrario, o público feminino é uma ótimo público, sempre criativo, detalhistas, dentre outras coisas...

É isso ae pessoal, não esqueçam, é o nome de vocês que está em jogo, então estudem bastante, preparem-se pq a batalha não é fácil. :)

Aquele abraço!

Fiquem a vontade para comentar, o importante é debater o assunto e sempre melhorar.

Como dizia um outro professor meu: "Tudo tem no mínimo dois lados".

;)

Salve a internet, pare de usar o IE6

noreply@blogger.com (Adriano Laurindo) — Fri, 09 Jan 2009 12:51:00 +0000

Fala rapaziada, neste ano de 2009 os desenvolvedores resolveram se unir e pedir o fim do IE6, o motivo todos estão cansados de saber, hacks, gambiarras e muitas outras coisas para funcionando no navegador que não trata com muito carinho as especificações do CSS.

No meu blog, a taxa de visitação do IE é mais baixa do que fo Firefox, entre o IE segue a tabela das versões:

Então só para o meu blog, tenho 384 visitas mensais o que reseprensta 30,31% das visitas vindo do IE.

Para este ano, esta previsto o lançamento das novas versões dos browsers mais famosos, IE8, Opera 10, Firefox 3.1.

Abaixo o gráfico de utilização do IE6 fornecido pelo Market Share:

Como podemos observar, a utilização do IE6 esta caindo muito desde então, e somando com a venda dos novos computadores que já estão vindo com Windows Vista e IE7, quem sabe este ano os desenvolvedores não ganham um presente com a morte do IE6?

Faça sua parte, se você utiliza o IE6, atualize a sua versão para a versão 7 do IE ou experimente outros navegadores:

- IE 7

- Opera

- Safari

- Firefox

É isso ae rapaziada, vamos fazer a nossa parte!

Abraços

Usando o Componente Alert do Flash

noreply@blogger.com (Adriano Laurindo) — Thu, 08 Jan 2009 12:23:00 +0000

Olá rapaziada, afim de fazer alguma pergunta ou mostrar algum aviso para o visitante do seu site? bom, você pode usar o Componente Alert que ja vem no flash.

Precisamos apenas do flash, do componente alert, uma boa pergunta (ou aviso) e algumas linhas de código AS2.

Vamos lá:

Abra o Flash :D
Configure o Stage com as propriedades que achar melhor;
Agora, vamos importar o componente Alert para o palco. Abra o painel componentes (CTRL + F7) ou vá em Window » Components. Depois de aberto, vamos em User Interface e depois em Alert.
Para incluir o componente Alert, clique a arraste para qualquer área do stage (palco). Após isso, delete-o. Toda requisição ao componente faremos via AS. este procedimento é necessário apenas para incluir o componente no filme.
Abra o painel Action (F9) e digite o seguinte código:
Ok, vamos à explicação:
Linha 1: importamos a biblioteca Alert.
Linha 3: Criamos um objeto chamado de listenerObj, este objeto vai servir para gerenciarmos a ação de acordo com a resposta do usuário.
Linha 4: Criamos uma função para ser acionada quando o usuário responder o "Alerta";
Linha 5: função switch ou em "Algorítmos" CASO. ele fará uma verificação: se for ok (linha 6) ele toma uma ação (linha 7) e depois para a execução (linha 8) e se for CANCEL (linha 9) ele toma uma ação (linha 10) e para a execução (linha 11).
Bom, vamos para a linha 15: responsável por modificar a cor do texto da caixa de alerta;
Linha 17: responsável por modificar o alinhamento do texto.
Obs: Utilizei apenas dois, mas possui muitas outras configurações veja a lista aqui: http://help.adobe.com/en_US/AS2LCR/Flash_10.0/help.html?content=00001952.html#3135823

Na linha 19: chamamos o Alert propriamente dito, para isso usamos o Alert.show e passamos os seguintes atributos:
- Pergunta/Mensagem
- Titulo da caixa de diálogo
- Opções (ok e cancel)
- this significa que vamos utilizar as informações desta caixa de diálogo e enviar para o objeto que criamos lá no inicio para fazer a verificação: listenerObj.

Atribuimos tudo isso a uma variável chamada Alerta, isso foi necessário para que pudéssemos posicionar a mensagem de alerta na tela, utilizando as propriedades _x e _y.
Bom, depois disso, é só dar um CTRL + ENTER e ver a mensagem:
É isso ae rapaziada, espero que tenha sido útil este tudo.

Faça o download do arquivo aqui: Versão Flash CS3 - Formato ZIP

Abraços a todos

Fluxo de Processos em Gerenciamento de projetos

noreply@blogger.com (Adriano Laurindo) — Wed, 07 Jan 2009 15:26:00 +0000

Fala rapaziada, para complementar os meus estudos em Gerenciamento de Projetos, vou começar a escrever algumas coisas aqui no blog também.

Bom, hoje vou postar aqui o que é fluxo de processos, quais são e o que compõe cada processo.

Primeiramente uma pequena definição do que é Gerência de Projetos, a GP nada mais é do que:

a aplicação de conhecimentos, habilidades e técnicas na elaboração de atividades relacionadas para atingir um conjunto de objetivos pré-definidos. (wikipedia)

Então, o conhecimento e as práticas de GP são melhor descritas por seus processos que são:

Iniciação:

+ Desenvolver o termo de abertura do projeto;

+ Desenvolver a Declaração do escopo preliminar do projeto.

Planejamento:

+ Desenvolver o plano de gerenciamento do projeto;

+ Planejamento do escopo;

+ Definição do escopo;

+ Criar EAP;

+ Definição da atividade;

+ Sequenciamento de atividades;

+ Estimativa de recursos da atividade;

+ Estimativa de duração da atividade;

+ Desenvolvimento do cronograma;

+ Estimativa de custos;

+ Orçamentação;

+ Planejamento do gerenciamento de riscos;

+ Identificação de riscos;

+ Análise qualitativa de riscos;

+ Análise quantitativa de riscos;

+ Planejamento de respostas a riscos;

+ Planejamento da qualidade;

+ Planejamento de recursos humanos;

+ Planejamento das comunicações;

+ Planejar comprar e aquisições;

+ Planejar contratações;

Controle:

+ Verificações do escopo;

+ Controle do escopo;

+ Monitorar e controlar o trabalho do projeto;

+ Controle integrado de mudanças;

+ Controle do cronograma;

+ Controle de custos;

+ Gerenciar equipe do projeto;

+ Relatório de desempenho;

+ Gerenciar as partes interessadas;

+ Realizar o controle da qualidade;

+ Monitoramento e controle de riscos;

+ Administração de contrato.

Execução:

+ Selecionar fornecedores;

+ Solicitar respostas de fornecedores;

+ Orientar e gereniar a execução do projeto;

+ Realizar a garantia da qualidade;

+ Contratar ou mobilizar a equipe do projeto;

+ Desenvolver a equipe do projeto;

+ Distribuição das informações.

Finalização:

+ Encerrar o projeto;

+ Encerramento do contrato.

Onde possuimos o seguinte fluxo:

Onde: Começamos com a iniciação do projeto, passamos para o planejamento e vamos para a execução, na execução, existe também o controle, este controle serve para verificar se os processos estão corretos ou se precisa de alguma modificação. caso haja necessidade de modificação, volta para a etapa de planejamento e após isso a execução. Este ciclo de mantém até o requisitos do projeto estarem em conformidade. Caso não tenha nenhum ajuste para fazer, passamos para a ultima etapa que é a finalização do projeto.

Reparam que eu fiz os processos todos coloridos? Não, não é por causa do carnaval, isto tem um motivo, e bem importante.

Dentro de cada etapa temos varios processos e estes processos fazem parte de um grupo:

# Gerenciamento da Integração;

# Gerenciamento do Escopo;

# Gerenciamento do Tempo;

# Gerenciamento dos Custos;

# Gerenciamento da Qualidade;

# Gerenciamento dos R. Humanos;

# Gerenciamento das Comunicações;

# Gerenciamento dos Riscos;

# Gerenciamento das Aquisições.

Bom pessoal, como podemos observar, possuimos 44 processos para gerenciarmos os nossos projetos.

Nos próximos posts, falaremos de cada uma das 5 etapas mais detalhadamente.

Estas informações foram retiradas do PMBOK 3rd Edition.

Abraços a todos.. e aguardo comentário para melhorar o conteúdo.

50 Pacotes com ícones

noreply@blogger.com (Adriano Laurindo) — Wed, 07 Jan 2009 00:18:00 +0000

Fala rapaziada, para coroar a volta do blog, já vou postar uma pequena ajuda para quem procura ícones na internet para download.

Encontrei um site muito bacana que lista estes 50 pacotes de ícones.

Aproveite!

Ano novo, novos Posts

noreply@blogger.com (Adriano Laurindo) — Tue, 06 Jan 2009 17:48:00 +0000

Fala rapaziada, por muito tempo fiquei fora do mundo dos blogs, muitos trabalhos, estudos, mais trabalhos, cuidar do filho e muitas outras coisas.

Este é um post para duas coisas, a primeira dizer que estou de volta e farei o possível para manter atualizações diárias, não só com post comuns (texto) mas também com screencasts, a pouco configurei o ScreenFlow no mac e já comecei os teste iniciais.

Bom, a segunda coisa é para fazer o teste de um novo software para blogar, o Ecto. Estou migrando para a plataforma Mac.

É isso ae rapaziada, Em breve novos Posts.

Abraços a todos!

Descubra a cor em RGB de toda a sua tela

noreply@blogger.com (Adriano Laurindo) — Fri, 31 Oct 2008 02:41:00 +0000

Rapaziada, desculpem pela falta de post, mas o trabalho esta apertando e estou estudando bastante sobre Gerência de Projetos e estou aprendendo muitas coisas úteis que em breve irei postar aqui.

Bom, eu tenho um software que realmente não me lembro onde eu peguei, que é bastanta útil para quem desenvolve layouts.

A ferramenta EyeDropper (que tem 276kb) diz qual a cor em RGB que esta na tela, bastanta você posicionar o cursor do mouse em cima da cor desejada.

A ferramenta não precisa de instalação, quando executada, um ícone de conta-gotas irá aparecer no tray:

Basta clicar duas vezes no ícone para ativar a ferramenta e mais duas vezes para desativar.

Fácil não? Aconselho o download (compactado .zip - 120kb) = (descompactado - 276kb )!

Abraços

Definir Background repetidos com CSS

noreply@blogger.com (Adriano Laurindo) — Mon, 13 Oct 2008 17:04:00 +0000

Olá rapaziada,

a correria esta muito grande e esta cada vez mais difícil postar no blog. Mas vamos lá!

O que hoje ensinar hoje é algo muito simples de se fazer e também importante e que da um efeito bem bacana no site.

Bom, cansado de colocar aquela cor chapada ao redor do seu site? hoje vamos mudar isso.

A imagem abaixo mostra o “site” com o fundo com uma cor chapada na cor laranja. vamos adicionar um plano de fundo bacana nele utilizando CSS.

Então, o nosso resultado final terá que ser:

Para colocar este plano de fundo, utilizamos apenas um quadrado de 100 X 100, a imagem abaixo:

Copie e coloque no mesmo local da sua página em html.

Bom, depois de ter a imagem na mesma pasta do HTML, agora vamos inserir os códigos em CSS para pegar a imagem e colocar como plano de fundo. segue:

Na linha 7 e 11 estamos iniciando e finalizando o código em CSS.
Na linho 8, estamos abrindo um bloco de códigos que vai se aplicar à TAG body do HTML.
E na linha 9 é onde esta o código, que definimos a imagem como background, por padrão, o plano de fundo vai ser repetido tanto na posição X quanto na Y (pros lados e pra baixo).

Então, podemos incrementar um pouco mais o nosso código, ficando assim:

Agora, na linha 10, estamos dizendo que queremos repetir o background somente em X:

Abaixo sequência de códigos que podemos utilizar para manipular o background.

É isso ae rapaziada, agora é só mandar bala no desenvolvimento!

Abraços a todos

Adobe Flash CS4

noreply@blogger.com (Adriano Laurindo) — Fri, 26 Sep 2008 16:25:00 +0000

Fala rapaziada,

depois de um tempo sem postar, hoje vou falar um pouco da nova versão do flash (e também de outros programas) no dia 23/09/2008.

A primeira coisa a ser notada é definitivamente a interface do programa, depois da aquisição da Macromedia pela Adobe, esta versão veio realmente com “cara” de adobe, principalmente pegando a “carinha” de softwares já conhecidos como o Adobe Premiere e Adobe After Efects, então, logo, nota-se a evolução do ambiente de trabalho.

A time line (linha do tempo) agora esta posicionada na parte inferior (como no Premiere) e o inspetor de propriedades foi para o lado direito, permitindo assim que possa ser melhor visualizar as propriedades das ferramentas, objetos, etc.

Outra grande mudança também, é a forma de criar animações, ela ficou extremamente mais fácil e rápida.

Aumentar ou diminui tempo de animação? Clicar e arrastar (como no Premiere também) – longe de ficar adicionando frames com F5 e removendo com Shift + F5… tudo ficou muito mais fácil.

Bom, sobre as novas funcionalidades do flash, eu poderia ficar um dia inteiro escrevendo aqui, o post ficaria longo e eu estaria reinventando a roda.

Olhem as principais funcionalidades no site da Adobe e também assistam o vídeo (em inglês – mas da pra entender perfeitamente) das novas funcionalidades no site da gotoandlearn.com.

A primeira vista, o Flash CS4 é uma ferramenta que apenas de olhar a demonstração dá vontade de comprar, infelizmente, nem a versão de teste esta disponível.

Abraços a todos

Carregar SWF externo no Flash com Action Script 3.0

noreply@blogger.com (Adriano Laurindo) — Sat, 06 Sep 2008 15:38:00 +0000

I ae rapaziada, depois de aprendermos a carregar swfs externo com o AS2, hoje vamos aprender como fazer isso com o AS3.0.

Então, vamos lá:

A Primeira coisa é: vamos criar dois arquivos, o SWF principal, e o secundário (que é o que vamos carregar no principal).
Não esqueça de criar um arquivo no flash com suporte e AS3.0
SWF Principal: 500px x 400px;
SWF Secundário: 500px x 400px; Neste SWF, coloquem algum objeto, figura, forma, qualquer coisa. Salve com o nome de “secundario”. Pressione CTRL + F12 para exportar e gerar p SWF.
Ok, volte para o SWF Principal e abra o painel Action (F9) e adicione o seguinte código:

Vamos a explicação:
1: Criamos uma classe do tipo loader();
2: Atribuimos o arquivo que queremos carregar a uma variável;
3: Utilizando o URLRequest, fizemos uma requisição deste arquivo (linha 2);
4 e 5: Posicionamos o objeto carregar no palco:
6: carregamos o objeto (arquivo)
7: Mostramos o arquivo carregado no palco;
Ok, Basta pressionar CTRL + Enter e testar o filme.

Você pode baixar o arquivo de exemplo!!

Abraços a todos!

[IMPORTANTE] para descarregar o arquivo externo, é só utilizar o código abaixo:

Precisando testar seu site em várias versões do IE?

noreply@blogger.com (Adriano Laurindo) — Fri, 05 Sep 2008 23:26:00 +0000

Fala Rapaziada,

Um problema que muitas pessoas enfrentam quando desenvolvem um site - principalmente com CSS - é o teste em vários navegadores.

Bom, visitando o site Deskmundo, vi um post muito interessante de como colocar várias versões do IE no seu computador.

É um tutorial muito simples, e rápido de fazer!

Boa sorte.

25+ Sites com Imagens grátis

noreply@blogger.com (Adriano Laurindo) — Fri, 05 Sep 2008 23:18:00 +0000

Olá Rapaziada.

Precisando de imagens para os seus trabalhos?

Visitante o site PaintBits, vi um Post muito bom com uma grande lista de Sites que vocês podem obter imagens gratuitamente.

Então, sem mais delongas, aí vai a lista:

Banco de Imagens Grátis para donwload:

É isso aí, bom proveito com estes sites, se tiverem mais algum site, por favor, deixem nos comentário.

Abraços

Preloader – Carregador simples em Flash (parte 2 – Barra de progressão)

noreply@blogger.com (Adriano Laurindo) — Tue, 19 Aug 2008 16:54:00 +0000

Fala rapaziada,

hoje vou postar a continuação do Preloader que iniciei ensinando apenas como fazer o preloader e exibir a % que foi carregada. Hoje iremos aprender a adicionar a barra de progressão no nosso documento.

Para quem chegou direto nesta página, por favor, leia a primeira parte antes de fazer esta!

Vamos lá.

Abra o documento da primeira parte (faça o download aqui):

O primeiro passo é criar um MovieClip que irá servir como a nossa barra de rolagem.
Pressione: CTRL + F8, dê um nome ao objeto, escolha a opção MovieClip e pressione o botão OK.
Agora, faça o desenho da barra:
Volte para o stage (palco principal) pressionando CTRL + E.
Abra a biblioteca pressionando F11, localize a barra que acabamos de criar, clique e arraste para dentro do palco:
Ok, agora precisamos dar um nome pra ele, ou seja, instancia-lo.
para isso, basta inserir um nome no campo <instance name>.
Eu vou dar o nome de Barra.

1 – Observe se você realmente selecionou o objeto;
2 – Instancia: barra.
Agora, vamos inserir a programação: Clique no frame 1 da camada Carregador e abra o painel Action (F9). E adicione os códigos como abaixo:
Adicionamos as linhas: 4, 21 e 35.
Pronto, pressione CTRL + ENTER para testar, caso o flash não simule o efeito de carregamento, pressionel CTRL + ENTER novamente.

Observação:

Reparem no meu MC:

Ele esta exatamente centralizado, então a animação de carregamento, se dará para os dois extremos:

Para ir em apenas uma direção, mova o objeto, como na figura abaixo:

É isto aí, espero que tenha ficado claro como criar um preloader simples com barra de progressão e %.

Abraços a todos, dúvidas, utilizem os comentários do post, ou o formulário ao lado.

;)

Colocar data na página utilizando Javascript

noreply@blogger.com (Adriano Laurindo) — Tue, 19 Aug 2008 15:08:00 +0000

Hoje vou postar – a pedidos de uma aluna – como colocar data em um site em Javascript.

Vamos lá.

Onde eu coloco os códigos em Javascript?

Os códigos devem ser inseridos dentro das Tags <head> </head> do html.

ficando assim:

Reparem nas linhas 4 e 10, elas são as responsáveis por iniciar e fechar o bloco de códigos em javascript.

Como colocar data na página?

Para inserir a data na página, precisamos criar uma classe Date:

Onde: Data é uma variável que eu crio, e após o igual esta dizendo que é uma nova classe Date.

Caso eu mande escrever a variável Data, a minha saída será: Tue Aug 19 2008 11:33:26 GMT-0300 (Hora oficial do Brasil) ou seja, muito mais coisa do que precisamos. Então, precisamos extrair o que queremos:

Nas linhas 8 e 9, nós atribuimos à variável DataDeHoje:
Hoje é: Dia/Mês/Ano.

Na linha 10, nós usamos a função Alert para exibir uma mensagem com data.

OBS sobe o getYear();

O resultado que iremos obter vai depender do navegador.

Este método retorno o ano com dois ou três dígitos. O valor retornado por getYear nem sempre é retornado com 4 dígitos. Para anos entre 1900 e 1999 o retorno é só dois dígitos.

Para outros anos (antes de 1900 e depois de 1999) o retorno depende do navegador:

Internet Explorer:

Retorna 4 dígitos antes de 1900 e depois de 1999.

Firefox:

Retorna um valor menor do que zero para anos antes de 1900. Por exemplo: o ano 1800 retorna -100.
Retorna um valor 100 ou maior para anos igual ou maior a 2000. Por exemplo: o ano 2008 retorna 108.

Então nossa saída no Firefox será:

No Internet Explorer:

Sobre Datas: EU particularmente prefiro colocar a data utilizando uma linguagem de programação como o PHP, caso você tenha interesse, eu escrevi um POST sobre a classe Date do PHP.

Para escrever a data no corpo da página, iremos utilizar o document.writer:

Observe que colocamos o código entre as tags <body></body>

É isso ae, espero que tenha sido útil.

Abraços a todos.

[UPDATE]

Uma dica do Lucas Ferreira é utilizar o getFullYear(); que segundo ele é mais preciso do que o getYear().

Valeu Lucas!

Preloader – Carregador Simples no Flash

noreply@blogger.com (Adriano Laurindo) — Fri, 15 Aug 2008 17:14:00 +0000

Fala rapaziada, uma coisa muito importante em projetos em flash, é o Preloader, este é um item que não pode faltar nunca.

Então hoje, vou postar como fazer um carregador simples.

Abra o Flash, e crie um documento com 400 x 300 pixels. (este tamanho pode ser variável, fica a sua escolha);
Faça um campo de texto DINÂMICO, este campo de texto irá receber a “%” carregada.

1 – Caixa de Texto;
2 – Tipo da caixa de texto: Dynamic Text;
3 – Instância da caixa de texto. (isto é necessário para dizer ao flash onde escrever a “%”.
Agora, crie uma nova camada e dê o nome de “Carregador”, e no frame 1, adicione o seguinte código:
(Abra o painel ACTION – F9)
Depois disso, volte para a Scene 1 (palco principal) crie uma nova camada, e a partir do frame 2, coloque o resto de sua animação.
Agora, para testar, pressione: CTRL + ENTER, caso não apareça o carregamento (%) pressione novamente CTRL + ENTER, o Flash irá simular o preloader.
Atenção para: Caso não apareça a porcentagem, verifique algumas coisas:

Cor da fonte;
Tipo da caixa de texto (tem que ser Dynamic);
Ortografica do código fonte;
Tamanho da sua animação, para teste, coloque uma imagem bem grande.

É isto aí!

Pessoal, espero que tenham gostado do tutorial, ele é bem simples e possui apenas %, num proximo tutorial, vou mostrar como colocar uma barra de progressão.

Download do arquivo .fla (Flash versão 8) (compactado com o WINRAR)

Abraços a todos!

Mais um editor WYSIWYG – SPAW Editor

noreply@blogger.com (Adriano Laurindo) — Mon, 11 Aug 2008 14:49:00 +0000

Fala rapaziada,

Foi lançado mais um editor WYSIWYG (what you see, is what you get/o que vc vê, é o que vc obtem) explicando melhor, é igual ao Dreamweaver, que você vai criando o seu site em modo design e vai verificando com esta ficando.

Ok, este editor, o SPAW foi criado pela SOLMETRA, e possui um visual muito agradável.

algumas de suas características:

O SPAW Editor possui suporte à linguagem PHP (PHP4, PHP5) e .NET (2.0 ou superior).
Oferece suporte aos mais importantes browsers do mercado (Opera, Safari, Internet Explorer, Firefox, Netscape etc.).
Oferece suporte a instalação e criação de novos temas.
Suporte e mais de 30 idiomas diferentes.
Arquitetura Modular
Menus flutuantes compartilhados
Interface multi-documento tabeada.

Para ler mais sobre as suas funcionalidades, acesse o site do autor.

Veja o demo da versão 2 do Spaw

Via: IgorEscobar

Procurando por sons para usar nos seus trabalhos? SoundSnap!

noreply@blogger.com (Adriano Laurindo) — Wed, 06 Aug 2008 10:38:00 +0000

Olá Rapaziada,

Você que quer incrementar seus trabalhos adicionando sons, o site SoundSnap é um ótimo site que disponibiliza milhares de áudios todos separados por categorias.

Aproveite: SoundSnap

Abraços a todos!

Combinando Formas com o Fireworks

noreply@blogger.com (Adriano Laurindo) — Wed, 06 Aug 2008 10:27:00 +0000

Olá Rapaziada,

hoje acordei mais cedo para ver o jogo de futebol feminino. Ja faz algum tempo que não posto nada aqui, a correria esta grande.

Bom, a uns 5 minutos atrás, recebi uma dúvida:

Jean: como misturar as cores de 2 objetos no fireworks! EX: 1 quadrado azul...texto preto...a parte que esta em cima do quadrado fica preto e a parte que esta por fora fica azul.

Pois bem, isso eu fazia muito no Corel Draw, que era só combinar formas, no Fireworks não é diferente. (~~quaaaase gol do Brasil…~~)

Abra o Fireworks (eu estou usando o CS3);
Desenhe uma forma básica (retângulo por exemplo) e digite um texto qualquer, como a imagem a seguir:
Antes de darmos o comando, precisamos transformar o TEXTO em uma forma para que possamos combina-las. Clique com o botão direito no Texto e vá em Convert to Paths (Ctrl+Shift+P).
Após esta etapa, selecione os dois objetos e vá na opção: Modify – Combine Paths – Join (Ctrl+Shift+J)
Depois disso, o resultado:

É isso aí! espero que tenha sido útil e claro.

Abraços a todos e continuem mandando dúvidas.

Silhuetas em Vetor - Garotas e Esportes

noreply@blogger.com (Adriano Laurindo) — Sun, 20 Jul 2008 18:15:00 +0000

Fala Rapaziada, depois de muito tempo volto a postar.
O tempo esta cada vez mais curto, e agora estou me dedicando aos estudos do Flex 3 e do Action Script 3.0, pretendo, em breve, postar alguma coisa dessas linguagens.

Bom, enquanto isso não acontece, hoje vou postar um download muito legal.

É um pacote com 3 dançarinas, 2 grupos de dançarinos e tocadores de quitarras, 8 super garotas e 2 esportistas. (confira na imagem)

Download via: Rapidshare e Filebox

É isso ae, aproveitem.

knowledge is free

Apple Safari 4 - Beta

Escolher cores para projetos

Editor WYSIWYG: jwysiwyg com jQuery

Fullscreen (Tela cheia) No flash

Procurando inspiração para Preloader em flash?

Opa, fechei um novo site, e agora?

Cliente tem sempre razão?

Salve a internet, pare de usar o IE6

Usando o Componente Alert do Flash

Fluxo de Processos em Gerenciamento de projetos

Iniciação:

Planejamento:

Controle:

Execução:

Finalização:

50 Pacotes com ícones

Ano novo, novos Posts

Descubra a cor em RGB de toda a sua tela

Definir Background repetidos com CSS

Adobe Flash CS4

Carregar SWF externo no Flash com Action Script 3.0

Precisando testar seu site em várias versões do IE?

25+ Sites com Imagens grátis

Preloader – Carregador simples em Flash (parte 2 – Barra de progressão)

Colocar data na página utilizando Javascript

Preloader – Carregador Simples no Flash

Mais um editor WYSIWYG – SPAW Editor

Procurando por sons para usar nos seus trabalhos? SoundSnap!

Combinando Formas com o Fireworks

Silhuetas em Vetor - Garotas e Esportes