Andrews Roberson

Recentemente trabalhei em um projeto muito interessante na Girafa Comunicação Interativa, onde, tinhamos um grande desafio que era reestruturar a loja virtual Univisaoshop a qual seria baseada na plataforma magento.

A grande sacada desta nova loja seria a usabilidade da mesma, onde, o cliente deveria encontrar os menus e produtos de forma clara e rápida.

As mudanças:

Depois de três anos de sucesso na rede, a Univisaoshop mudou, ficou mais moderna e trabalhou a usabilidade em todo o seu conteúdo. Hoje, o e-commerce da Univisaoshop é a melhor loja virtual do Brasil feita na plataforma Magento, que apresenta um espaço ideal tanto para estrutura pronta de e-commerce como para customização, com estrutura padrão personalizável visualmente e com facilidade de adicionar módulos de extensão. O diferencial da loja Univisaoshop é que, ao contrário de outras lojas que também usam esta ferramenta, o site personalizou totalmente a plataforma e pensou especialmente na usabilidade de todos os recursos. Além disso, criou um layout moderno e que facilita a navegação para a compra, com ícones grandes, destacados e de fácil acesso. “Vimos no Magento a oportunidade de criar algo especial, diferente, de fácil manutenção mas que saísse da ‘mesmice’ dos site feitos nesta plataforma. O resultado foi a melhoria da usabilidade e a compatibilidade com o design”, conta o gestor da Univisaoshop, Daniel Sliwinski.

Outra vantagem nesta mudança é quanto ao Search Engine Optimization (SEO) da plataforma Magento, que possibilita uma rápida otimização para os mecanismos de busca. Com isso, a loja virtual aparece mais nos resultados de busca o que dissemina seu conteúdo de forma mais ágil.

Com apenas duas semanas no ar, o novo site recebeu mais de 13 mil visitantes únicos.

Canais de atendimento:

Pensando sempre em melhorar e aproximar o relacionamento com seus clientes a Univisaoshop criou novos perfis nas redes sociais e também disponibilizou um novo blog.

Acesse e confira a nova loja Univisaoshop

O que é: F5 é um evento que em por objetivo qualificar o entendimento do mercado corporativo sobre a comunicação digital.

Data: 13 e maio de 2010
Local: Auditório Antonieta de Barros, na Assembléia Legislativa, em Florianópolis – SC
Hora: 19h30
Palestras: Cesar Paz, da agência AG2 e presidente da ABRADi e Mateus Braga, da Agência Garageim.

Percebi que muita gente busca esta informação poraqui devido a outro post que fiz sobre como popular ComboBox no Adobe Flash com PHP e MySQL, então resolvi escrever este pequeno post solucionando e ajudando quem tem está dúvida.

Teremos então uma function no PHP que retorna os dados para o Adobe Flex dentro de um Array.

function popularCombo() {
  for ($i = 0; $i<=10; $i++) {
    $aReturn['data'][$i]['data']  = $i;
    $aReturn['data'][$i]['label'] = 'Label ' . $i;
  }
  return $aReturn;
}

E no Adobe Flex devemos então criar outro for que por sua vez, irá tratar e jogar os dados para dentro do ComboBox.

// Variavel do tipo ArrayCollection,
// que serve para acondicionar
// os dados para o dataProvider
private var aDados:ArrayCollection = new ArrayCollection();
 
// Function
function... {
  for(var i:int = 0; i<event.result.data.length; i++) {
    var objDados:Object = new Object();
    // passando ao objeto (objDados)
    // os dados vindos do php
    objDados.data  = event.result.data[i].data;
    objDados.label = event.result.data[i].label;
    // adiciona o objeto da vez ao ArrayCollection (aDados)
    this.aDados.addItem(objDados); 
  }
  // informa ao dataProvider do ComboBox que ele
  // recebera os dados do ArrayCollection (aDados),
  // assim preenchendo o mesmo
  ComboBox.dataProvider = this.aDados;
} // End of function

Bem simples não?
Não me apronfudei muito, pois entendo que neste caso, tu saiba trabalhar com Adobe Flex e PHP.

Fui convidado por meus colegas de classe da Uniguaçu para que ministrasse um curso de extenção sobre Adobe Flex para eles, assim mostrando os passos iniciais para se trabalhar com a ferramenta.
Pois bem, aceitei e acatei a idéia. Penso que quanto mais desenvolvedores eu conseguir trazer para o mundo das RIA, certamente todos estaremos ganhando em qualidade de softwares no mercado.
A partir deste curso estarei postando todo o material ao qual utilizamos em sala de aula aqui no blog, criando assim um passo-a-passo do curso, para que este também esteja disponível para a comunidade. Não sou um ninja em Adobe Flex, mas o pouco que conheço certamente fara a diferença e ajudará os que estão começando. No curso estaremos adaptando um sistema que está desenvolvido em php e que foi utilizado somente para estudos, o qual comentarei no próximo post.
Para dar início a este passo-a-passo, deixo aqui a apresentação utilizada na primeira aula, onde fala sobre Adobe Flex, RIA/AIR, plugins/ferramentas e sobre vantagens/desvantagens de se utilizar a ferramenta.
Bom estudo, até a próxima.

Continuando os posts sobre as classes caurina vou mostrar como trabalhar com os filtros DropShadow, Glow e Blur.
Não vou me ater muito na criação do arquivo para não ficar extenso o post, assim entendo que tu saiba trabalhar com flash.
Neste caso estou aplicando os filtros através de uma function, onde verificamos qual é o filtro solicitado pelo botão, após aplica-se o filtro solicitado.

// IMPORTAMOS A CLASSE Tweener e FilterShortcuts
import caurina.transitions.Tweener;
import caurina.transitions.properties.FilterShortcuts;
 
// INICIANDO A CLASSE FilterShortcuts
FilterShortcuts.init();
 
/**
 * FUNCTION aplicarFiltro
 * @param MouseEvent
 */
function aplicarFiltro(event:MouseEvent):void {
	var target:String = event.target.name;
	switch(target) {
		case 'shadow_mc':
			Tweener.addTween(container_mc, {_DropShadow_blurX:30, _DropShadow_blurY:30, time:.5, transition:'linear'});
			break;
		case 'glow_mc':
			Tweener.addTween(container_mc, {_Glow_blurX:30, _Glow_blurY:30, time:.5, transition:'linear'});
			break;
		case 'blur_mc':
			Tweener.addTween(container_mc, {_Blur_blurX:30, _Blur_blurY:30, time:.5, transition:'linear'});
			break;
	}
}
 
/**
 * FUNCTION removerFiltro
 * @param MouseEvent
 */
function removerFiltro(event:MouseEvent):void {
	var target:String = event.target.name;
	switch(target) {
		case 'shadow_mc':
			Tweener.addTween(container_mc, {_DropShadow_blurX:0, _DropShadow_blurY:0, time:.5, transition:'linear'});
			break;
		case 'glow_mc':
			Tweener.addTween(container_mc, {_Glow_blurX:0, _Glow_blurY:0, time:.5, transition:'linear'});
			break;
		case 'blur_mc':
			Tweener.addTween(container_mc, {_Blur_blurX:0, _Blur_blurY:0, time:.5, transition:'linear'});
			break;
	}
}
 
// EVENTOS
shadow_mc.addEventListener(MouseEvent.MOUSE_OVER, aplicarFiltro);
shadow_mc.addEventListener(MouseEvent.MOUSE_OUT, removerFiltro);
glow_mc.addEventListener(MouseEvent.MOUSE_OVER, aplicarFiltro);
glow_mc.addEventListener(MouseEvent.MOUSE_OUT, removerFiltro);
blur_mc.addEventListener(MouseEvent.MOUSE_OVER, aplicarFiltro);
blur_mc.addEventListener(MouseEvent.MOUSE_OUT, removerFiltro);

Repare que no filtro Glow você precisa alterar a cor, pois ele utiliza uma cor padrão para o filtro. Neste caso pode-se estar aplicando também a propriedade _Glow_color, que é o responsável pela manipulação da cor do Glow.

Tweener.addTween(container_mc, {_Glow_blurX:30, _Glow_blurY:30, _Glow_color:0x333333, time:.5, transition:'linear'});

As classes caurina são uma mão na roda para quem não curte usar a timelime e manipular os objetos no palco, assim facilitando e muito nossa vida. Lembrando que devemos essa ao Zeh por te-la disponibilizado a comunidade.

Clique aqui e veja como ficou o exemplo.

Uma dica bem simples para causar um tchan a mais ao se passar o mouse sobre objetos em uma aplicação flash é criar um perseguidor ou como queiram chamar.
Pois bem… primeiro crie então um movieclip no palco e instancie-o com o nome de botao_mc, após ter o botão criado, criaremos nosso perseguidor.
Desenho um circulo, retângulo ou qualquer outra coisa no palco, e transforme-o em um movieclip setando seu nome como perseguidor_mc, também será necessário setar uma identificação para o Linkage, pois iremos chamar ele da biblioteca. Para fazer isto clique em Advanced, e após marque a opção Export for ActionScript. Veja o exemplo abaixo.

Após ter criado o perseguidor, delete-o do palco, deixando apenas o botão.
Crie uma nova layer e escreva a action que será responsável por atachar e movimentar o persseguidor do mouse.

// IMPORTANDO A CLASSE CAURINA TWEENER
import caurina.transitions.Tweener;
 
// EVENTO OVER
botao_mc.onRollOver = function() {
 
	// ATACHA O PERSEGUIDOR NA POSICAO X E Y DO MOUSE
	attachMovie('perseguidor_mc', 'perseguidor_mc', 1, {_x:_xmouse, _y:_ymouse});
 
	// AO MOVER O MOUSE, MOVE TAMBEM O PERSEGUIDOR
	onMouseMove = function() {
 
		// APLICANDO TWEENER PARA SUAVIZAR O MOVIMENTO DO PERSEGUIDOR
		Tweener.addTween(perseguidor_mc, {_x:_xmouse+9, _y:_ymouse+20, time:1, transition:'easeOutExpo'});
	}
}
 
// EVENTO OUT
botao_mc.onRollOut = function() {
 
	// REMOVE O PERSEGUIDOR
	removeMovieClip(perseguidor_mc);
 
	// DELETA A FUNCAO MOUSE MOVE
	delete onMouseMove;
}

Esta feito nosso perseguidor, supimpa não!
clique aqui e veja como ficou o exemplo

Manifesto 2009 Digital Year, Apoiado!

ColdFusion Web Day é o primeiro evento on-line totalmente dedicado ao compartilhamento de técnicas, conceito e mercado de uma das linguagens de programação web mais produtivas que existem.

Serão 5 horas de palestras com a participação de grandes nomes da comunidade ColdFusion brasileira, compartilhando o máximo e informações sobre ColdFusion, o seu mercado no Brasil, funcionalidades, produtividade, novidades e futuras versões.

O evento será realizado no dia 11 de Abril de 2009 a partir das 13:30, e será totalmente on-line e gratuíto. Para isto, basta deixar seu nome e email através do menu “Quero participar”. No dia do evento basta acessar a sala de palestras através do link Acesso que estará disponível nesta mesma página.

Não fique de fora desta e conheça todos os diferenciais de uma das linguagens mais usadas para o desenvolvimento de aplicações ricas para a internet. Conheça o ColdFusion!

A Girafa Comunicação Interativa, está abrindo uma vaga para estágio em criação. Interessados devem enviar currículo para o email trampo[at]girafacomunicacao.com.br

Happy hour sempre rola na agência para descontrair a moçada, e a rodada de chopp para trocar idéias sobre tecnologia (afinal somos geeks e também estamos rodeados de gadgets) acontecem sempre em algum barzinho/choperia.

Quer trabalhar em um ambiente legal, descontraido e com horários flexíveis? Então, seu lugar é aqui!

Uma dica rápida de como chamar components baseados em FlexMDI via actionscript (Entendo que ja saiba trabalhar com Components no Adobe Flex).

Deve-se definir um container no arquivo principal para que este possa acondicionar os components baseado em FlexMDI, onde, também teremos um Button para executar a function.

<mx:Button label="Add Window" click="addWindow()"/>
<flexmdi:MDICanvas id="myMDI" width="100%" height="100%"/>

Também devemos criar o component lógico , então definimos que nosso component será do tipo MDIWindow e seu nome será window.
Após ter criado o component, escreveremos a function que o chamará.

private function addWindow():void {
     var myWindow:window = new window();
     myMDI.windowManager.add(myWindow);
}

Pronto! mais simples que isto impossível.
Veja como ficou nosso component, bem como o source