Screencaster

Fiz um vídeo rápido dando uma breve explicação destes 3 valores para a propriedade display do CSS. Considero o entendimento destes de suma importância para aqueles que pretendem montar layouts com HTML e CSS.

Antes de colocar o vídeo aqui, deixo um disclaimer de que a partir de hoje os vídeos postados no Screencaster estão em qualidade mais alta, com resolução 1280×800, assim quem baixar poderá ter um vídeo de melhor qualidade para assistir.

 Podcast Video [4:04m]: Download (104)

Espero que gostem, e comentem =]

[]’s

Finalmente consegui voltar com os screencasts aqui no screencaster.com.br

Juntamente com este novo vídeo, quero agradecer à todos que têm baixado/assistido/assinado nosso conteúdo, pois nesta semana completamos mais de 2000 dowloads de podscrasts. Como digo no final do vídeo, isso é muito bom para nós, visto que não faz muito tempo que completamos 1000 downloads.

Falando sobre este vídeo em questão, trata-se de um tutorial de introdução à biblioteca jQuery de javascript, que é a minha biblioteca favorita e a que eu tenho usado ultimamente em todos os meus projetos. No vídeo eu construo um menu em árvore e também um menu accordeon aproveitando o mesmo código html.

 

 Podcast Video [8:34m]: Play Now | Play in Popup | Download (176)

Por hoje é só! Espero que vocês aproveitem, se o feedback for positivo pretendo postar mais coisas aqui sobre jQuery. Qualquer coisa é só comentar.

Estamos também aguardando sugestões de novos tutoriais e/ou podcasts em áudio, podem mandar nos comentários também. E tem a nova série vindo aí, depois de muita enrolação da nossa parte =]

[]’s

Estaremos republicando aqui no Screencaster todos os podcasts do falecido Web2Ponto0, para permitir àqueles que não ouviram ouvirem e àqueles que já ouviram ouvirem novamente se desejado. Segue a descrição que foi postada no Web2Ponto0, no post do podcast:

Eh com muito prazer que lançamos o Podcast do Web2Ponto0! Nesta primeira edição, falamos sobre os cursos de informática de hoje em dia, assunto muito interessante e que rendeu um bom bate-papo.

No podcast estamos meu amigo André, que trabalha numa escola de informática e eu. O Gui hoje não podia gravar, mas no próximo ele participa =]

Exigimos feedback

Acharia interessante colocar aqui o que mudou desde que gravamos o podcast:

1 - O André deixou de dar aula na escola de informática em questão
2 - Cerca de meio ano depois, a escola em questão faliu
3 - O supracitado Gui nunca chegou a participar de um podcast

 

 Standard Podcast [61:31m]: Play Now | Play in Popup | Download (43)

Eh isso! Espero que possa ser interessante. Em breve aqui novos podscrasts e screencasts =]

[]’s

Os formulários na web são de extrema importância, pois é principalmente através deles que nossos usuários interagem com os websites ou sistemas. Portanto, um formulário deve combinar um visual agradável e intuitivo com uma boa usabilidade e acessibilidade. Pretendo demonstrar aqui um exemplo de formulário simples que seja bem construído levando em conta estes pontos-chave citados.

Eis aqui o formulário que iremos montar:

Também tem um exemplo dele funcionando aqui. Como podem ver, trata-se de um formulário muito simples, mas que pode nos servir de exemplo neste tutorial. Antes de começarmos, aqui vão algumas dicas que podem ser interessantes para quando você for montar um formulário:

1 - Mantenha-o com o menor número de campos possível
Não existe nada pior do que se deparar com um formulário gigante com inúmeros campos a serem preenchidos. Muitos usuários desistem de preencher um formulário muito grande. Para evitar isto você pode unir campos, por exemplo, em vez de colocar um campo para nome e outro pra sobrenome, una estes dois campos em um só e deixe expresso “Nome Completo”. Caso mesmo após resumido o formulário ainda pareça grande de mais, experimente dividí-lo em mais de uma página, isto pode ajudar.

2 - Peça para seu designer não exagerar nos efeitos visuais
Infelizmente os browsers ainda não têm uma boa flexibilidade quando a questão é personalização de campos de formulário. Inputs do tipo text/textarea e buttons podem ser bastante personalizados, mas alguns outros como selects e checkboxes exigem muitas “gambiarras” para uma simples personalização. O designer deve sempre estar ciente de tais limitações antes de montar o layout do formulário.

3 - KISS
Não, não é para beijar ninguém, nem ouvir as músicas da banda enquanto desenvolve. Keep It Simple, Stupid!  Esta é uma dica tão simples quanto o que ela propõe: quanto mais simples for o formulário, seu design, sua usabilidade, melhor.

Let’s get It started!

Antes que alguém pergunte, eu utilizei para este formulário o Adobe Fireworks para criação do design, TextMate para edição dos códigos e o framework jQuery na parte de javascript.

Vamos começar nosso formulário pelo HTML. Aqui vai o código HTML para se fazer o formulário, e em seguida sua explicação:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
“http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta http-equiv=”Content-type” content=”text/html; charset=utf-8″>
<title>Formulário Simples - www.screencaster.com.br</title>
<link rel=”stylesheet” href=”css/screen.css” type=”text/css” media=”screen”>
</head>
<body id=”form”>

<form id=”formulario” action=”" method=”post”>
<fieldset>
<h2>Informe seus dados abaixo</h2>

<label for=”nome” class=”i_normal”>
<span>Nome</span>
<input type=”text” name=”nome” value=”" id=”nome”>
</label>

<label for=”email” class=”i_grande”>
<span>E-mail</span>
<input type=”text” name=”email” value=”" id=”email”>
</label>

<label for=”website” class=”i_grande”>
<span>Website</span>
<input type=”text” name=”website” value=”" id=”website”>
</label>

<label for=”telefone” class=”i_medio”>
<span>Telefone</span>
<input type=”text” name=”telefone” value=”" id=”telefone”>
</label>

<label for=”uf” class=”i_mini”>
<span>UF</span>
<input type=”text” name=”uf” value=”" id=”uf”>
</label>

<button type=”submit”>Enviar<span></span></button>
</fieldset>
</form>

</body>
</html>

E precisa explicar alguma coisa? A marcação do formulário é extremamente simples. Talvez alguns de vocês possam estranhar a tag “button”. Pois é, trata-se de uma tag específica para fazer, errr… botões. Funciona semelhante ao input type=”submit”, mas não envia valores como campo de formulário, e podemos inserir qualquer elemento html inline dentro dela. Notem aquele span alí dentro; ele vai ser útil para criar um efeito com javascript depois, apenas deixem ele alí por enquanto. Estas classes que coloquei nos labels servem para identificar qual será o tamanho do campo dentro deles, pois, como podem ver no design, os campos têm tamanhos diferentes.

Agora vamos ao CSS, que tem alguns truques interessantes:

* {
margin:0;
padding:0;
list-style:none;
}

form fieldset {
border:none;
background-color:#eee;
width:698px;
height:240px;
}

form fieldset h2 {
text-indent:-9000em;
overflow:hidden;
display:block;
background:url(imagens/header.png) no-repeat;
width:698px;
height:60px;
}

form fieldset label {
display:table;
width:100%;
}

form fieldset label span {
float:left;
text-align:right;
width:80px;
font:14px ‘Trebuchet MS’, Arial, Helvetica, sans-serif;
}

form fieldset label input {
float:left;
height:28px;
border:none;
padding:8px 22px 0 17px;
margin:-5px 0 0 0;
}

form fieldset label.i_normal input {
width:305px;
background:url(imagens/input_normal.png) no-repeat 0 4px;
}

form fieldset label.i_medio input {
width:280px;
background:url(imagens/input_medio.png) no-repeat 0 4px;
}

form fieldset label.i_grande input {
width:450px;
background:url(imagens/input_grande.png) no-repeat 0 4px;
}

form fieldset label.i_mini input {
width:100px;
background:url(imagens/input_mini.png) no-repeat 0 4px;
}

form fieldset label input:focus {
background-position:0 -36px;
}

form fieldset button {
width:67px;
height:25px;
background:url(imagens/botao.png) no-repeat 0 0;
border:none;
text-indent:-9000em;
overflow:hidden;
cursor:pointer;
float:right;
margin:-33px 165px 0 0;
position:relative;
}

form fieldset button span {
width:67px;
height:25px;
background:url(imagens/botao_bright.png) no-repeat 0 0;
position:absolute;
top:-7px;
left:-3px;
display:block;
display:none;
}

Vamos rever cada parte do código para que eu possa explicar mais facilmente:

* {
margin:0;
padding:0;
list-style:none;
}

Aqui não tem muito segredo, apenas estamos zerando algumas propriedades padrão dos elementos, para que não nos atrapalhem. Aquele list-style alí nem seria necessário no nosso exemplo, mas também não vai atrapalhar em nada.

form fieldset {
border:none;
background-color:#eee;
width:698px;
height:240px;
}

Aqui estamos formatando o fieldset que colocamos dentro do form. O elemento fieldset é utilizado para agrupar campos de um formulário. Estas propriedades eu poderia ter definido no próprio form, mas como nosso form tem apenas um fieldset preferi colocar no fieldset mesmo.

form fieldset h2 {
text-indent:-9000em;
overflow:hidden;
background:url(imagens/header.png) no-repeat;
width:698px;
height:60px;
}

Aqui formatamos aquele título do formulário. Tive de utilizar um h2 em vez da tag legend porque a tag legend tem algumas limitações. As duas primeiras linhas servem para esconder o texto que está no elemento. Em seguida, definimos o background e a largura/altura do elemento que são as mesmas da imagem.

form fieldset label {
display:table;
width:100%;
}

Aqui estamos personalizando nosso label. O label precisa ter display:table porque ele conterá elementos com float. Desta forma, ele se expande para conter os elementos com float. A largura de 100% é para garantir que o label ocupará toda a extensão do fieldset.

form fieldset label span {
float:left;
text-align:right;
width:80px;
font:14px ‘Trebuchet MS’, Arial, Helvetica, sans-serif;
}

form fieldset label input {
float:left;
height:28px;
border:none;
padding:8px 22px 0 17px;
margin:-5px 0 0 0;
}

Primeiro, formatamos o texto do span. Também mandamos ele flutuar à esquerda, definimos uma largura e mandamos o texto alinhar à direita, para dar aquela impressão de que o formulário é “ajeitadinho”. O input também flutua à esquerda, com uma altura de 28px. Tiramos a borda pois na imagem que usaremos de fundo a borda já está inclusa. Aqui vale uma observação: os valores de margin/padding não são definidos, eu tive que experimentar e ir tentando até acertar os valores certos. Muitas vezes as pessoas me perguntam “de onde você tirou estes números?”, na verdade às vezes é necessário ir tentando “no chute” até acertar. Também vale lembrar que valores negativos são perfeitamente válidos no CSS, não é gambiarra não.

form fieldset label.i_normal input {
width:305px;
background:url(imagens/input_normal.png) no-repeat 0 4px;
}

form fieldset label.i_medio input {
width:280px;
background:url(imagens/input_medio.png) no-repeat 0 4px;
}

form fieldset label.i_grande input {
width:450px;
background:url(imagens/input_grande.png) no-repeat 0 4px;
}

form fieldset label.i_mini input {
width:100px;
background:url(imagens/input_mini.png) no-repeat 0 4px;
}

Aqui definimos a imagem de fundo dos inputs, de acordo com seus tamanhos, bem como suas larguras. Notem que foram fatiadas 4 imagens diferentes: input_normal, input_medio, input_grande e input_mini.

form fieldset button {
width:67px;
height:25px;
background:url(imagens/botao.png) no-repeat 0 0;
border:none;
cursor:pointer;
float:right;
margin:-33px 165px 0 0;
}

O button aqui não tem muito segredo, basta colocar a imagem de fundo e definir os tamanhos.

form fieldset button span {
width:67px;
height:25px;
background:url(imagens/botao_bright.png) no-repeat 0 0;
display:block;
margin:-2px 0 0 -3px;
_margin:0;
}

No span, colocamos de fundo uma outra imagem que exportei, que contém o botão um pouco mais claro. Utilizaremos transparências no javascript depois para criar um efeito de “pisca” no botão. Tem um hackzinho alí, mas não é nada de outro mundo

Agora vamos partir para o javascript, onde iremos solucionar algumas incompatibilidades do nosso formulário com o Internet Explorer (pra variar) e também criar o efeito do botão.
Primeiramente, observe este trecho de código, que deve ser acrescentado ao CSS:

input:focus, input.focado {
background-position:0 -36px!important;
}

Aqui deslocamos o background para mostrar aquele input com o glow ao redor. Para que você entenda melhor, olhe a imagem input_(qualquercoisa).png:

Perceba que a imagem contém o input nos seus dois estados. Quando o usuário foca no input, “puxamos” a imagem para cima para aparecer o glow. Esta técnica é chamada de CSS Sprite. No entanto, nosso querido IE não aceita a pseudo-classe focus, então temos que utilizar javascript para tal.

Irei utilizar a biblioteca jQuery para facilitar nosso javascript. Vamos criar um arquivo js também para colocar nosso código, e acrescentar os dois no head do documento html:

<script src=”js/jquery.js” type=”text/javascript”></script>
<script src=”js/form.js” type=”text/javascript”></script>

Agora vamos editar nosso script form.js:

$(function(){

$(”form input”).focus(function(){

$(this).addClass(”focado”);

});

$(”form input”).blur(function(){

$(this).removeClass(”focado”);

});

})

Não vou me aprofundar na explicação do javascript porque este não é o foco do nosso tutorial. Apenas saiba que tudo o que estiver dentro de $(function(){….}) será executado quando o documento tiver sido carregado. Este trecho corrige o problema do focus.

Para animar nosso botão, podemos contar-lhe uma piada, elogiar suas belas qualidades de botão, ou deixar nosso js assim:

$(function(){

$(”form input”).focus(function(){

$(this).addClass(”focado”);

});

$(”form input”).blur(function(){

$(this).removeClass(”focado”);

});

blinkButton();

})

blinkButton = function() {
$(”form button span”).animate({’opacity’ : 1}, ’slow’, function(){
$(this).animate({’opacity’ : 0}, ’slow’, function(){
blinkButton();
});
})
}

A função blinkButton dá um efeito de fade no span que está no button, dando a impressão de que o botão está piscando. Note que, ao final da animação a função chama a si mesma, reiniciando a animação e criando uma espécie de loop infinito.

Por hoje é só pessoal! Espero que possam ter aprendido sobre formulários com este nosso tutorial. Estou disponibilizando um zip com todos os arquivos para que vocês possam baixar e revisar qualquer coisa que não tenham entendido. O exemplo foi testado apenas no Firefox 3 e Internet Explorer 6 (emulado). A animação do botão não funcionou aqui no meu IE6 emulado via Wine, mas acho que num PC deverá funcionar.

Até mais!

Este post aqui é apenas para divulgar para vocês uma continha que criei no YouTube com o objetivo de postar uma vez por semana uma dica rápida sobre Mac OS em vídeo.

São vídeos em média de 1 minuto e meio sem narração, com dicas simples e úteis de como tirar melhor proveito de um Mac. São interessantes tanto para donos de Macs quanto para quem ainda não se decidiu se vai migrar ou não.

Talvez eu poste aqui no blog cada vez que atualizar lá, mas não custa assinar as atualizações pelo YouTube mesmo, pra garantir!

[]’s

Como vocês devem ter percebido, o blog anda meio parado ultimamente. Ok, e como alguns devem imaginar, isso deve ter algum bom motivo, certo?

Pois bem, o André e eu estamos cuidando dos últimos detalhes do site da nossa startup (interAtiva!) e também cuidando de outras coisas como conseguir clientes, mercado, etc.

Junto disso, eu estou trabalhando temporariamente numa Web TV (caiweb TV) como editor, e estou com meu tempo bastante corrido.

Assim que as coisas se normalizarem o blog voltará ao seu ritmo normal, não se preocupem!

[]’s

Já faz cerca de um ano e meio desde que conheci e venho utilizando bastande o framework Code Igniter para criação de aplicações PHP baseadas em banco de dados.

Algo que sempre senti falta no Code Igniter foram os clássicos “generators”, bastante conhecidos dos programadores Ruby on Rails. Pensando nisso criei um script (pensando em mim, inicialmente, depois que decidi compartilhá-lo) para facilitar a criação de aplicações Code Igniter.

Na verdade são dois scripts: um chamado igniter e outro chamado igniter_generate. Eles são escritos em PHP e por enquanto só funcionam em plataformas unix-based (mac, linux…). Não deve ser muito difícil portar os scripts para Windows, mas eu não tenho nehum PC aqui no qual possa testar, então se alguém tiver conhecimentos em PHP e DOS e quiser modificar o script, sinta-se à vontade, ele é creative commons.

Fiz um vídeo curto só para mostrar como eles funcionam:

 

 Podcast Video [3:02m]: Play Now | Play in Popup | Download (197)

Só para observar: criei o script com intenções meramente pessoais (sim, eu sou egoísta), portanto não presto suporte de nenhum tipo, é apenas para ajudar a comunidade, usem como quiserem mas me deixem em paz!

Em breve postaremos aqui a primeira parte da nossa nova série. Quem não ganhou na nossa promoção não fique preocupado, a primeira parte será liberada para qualquer pessoa.

[]’s

Ontem tive o prazer de poder presenciar o 10º Encontro Locaweb de Profissionais de Internet em Porto Alegre.

Claro que não poderia deixar de expor minha opinião sobre a organização do evento, as palestras, as pessoas, e também não poderia deixar de postar algumas fotos.

Organização

Ótima. A começar pela localização do evento. Eu sou de São Sebastião do Caí, que fica a cerca de 60km da capital. Tive que pegar ônibus e, por não conhecer bem Porto Alegre, provavelmente nem teria ido se a localização do evento fosse muito longe da estação rodoviária.

O evento foi no Centro de Convenções São Rafael, há cerca de 5 quarteirões da estação rodoviária. Ou seja, uma maravilha para quem, como eu, teve que pegar ônibus para ir até POA prestigiar o evento.

Palestras

9:00 am - A primeira palestra do dia, entitulada “Tendências do Mercado de Internet”, e apresentada por Gilberto Mautner (presidente da Locaweb), foi muito boa. Entre os temas abordados ele falou sobre o crescimento e a importância do opensource para quem trabalha com internet atualmente, citando exemplos como Joomla, Drupal, Ringside. Após falar sobre aplicações opensource, ele citou iniciativas de grandes empresas, como a do CodePlex (da Microsoft), para se aproximarem da abordagem opensource.

Ainda na sua palestra, ele falou sobre APIs, o que são, quais suas utilidades, citando ótimos exemplos como Facebook, openID, entre outros (ele não incluiu a API do Google Maps na sua listagem pois, segundo ele, todos utilizam este exemplo e ele queria ser diferente).

Após isso ele falou sobre Cloud Computing, que (ao menos no meu entendimento) deverá interessar mais pessoas ligadas à servidores.

Seguindo sua palestra, citou um ponto muito importante no desenvolvimento web atual: A web é multimodal; citando exemplos de gadgets que acessam a internet, como iPhones, videogames, etc.

Para finalizar, ele falou um pouco sobre Desenvolvimento Ágil e, mesmo sem citar o termo, falou sobre algumas características da Programação Pragmática.

Após isso, deu uma bela demonstração de Ruby On Rails, mesmo com o telão do ELPI apagando a cada 15 segundos (foi engraçado para quem estava na platéia, mas acho que não para ele).

10:10 am - Após esta primeira palestra, tivemos um Coffee Break, com uns petiscos maravilhosos, café, coca-cola, iogurte, suco, entre outras coisas deliciosas que nem vou citar aqui senão acabo ficando com água na boca.

10:30 am - Voltamos para o auditório, onde tivemos cerca de 5 minutos de papo do pessoal da Microsoft (provavelmente por eles estarem patrocinando o evento). O executivo da Microsoft (o qual infelizmente não me recordo o nome) falou sobre as (supostas) intenções da Microsoft de se tornar mais aberta. Logo quando subiu no palco, fez a seguinte indagação: “O que vem na cabeça de vocês quando se fala em Microsoft” e uma certa pessoa da platéia gritou para todos ouvirem “Tela azul”. O executivo ficou um pouco sem jeito, deu uma risada amarela, e disse que eles “estavam trabalhando para resolver este probleminha”.

10:40 am - Neste momento tivemos a palestra “Produtividade: Padrões web, frameworks, jQuery, controle de versão e outras ferramentas” com o Elcio Ferreira, que já deve ser conhecido de vocês. Ele começou com sua clássica frase “Vida longa e próspera” (que, diga-se de passagem, foi a frase que me fez ganhar uma entrada para o ELPI no desafio que eles fizeram no Tableless; aliás, eu não ganhei o notebook que foi sorteado no final do ELPI, então não preciso pagar um almoço pro Elcio :P).

O Elcio começou falando sobre o real papel do programador. “O programador não é pago para escrever código, o programador é pago para resolver problemas” disse ele. Após introduzir o real papel do programador, passou por pontos como Padrões Web e controle de versão, mostrando ferramentas muito boas para auxiliar no controle de versão (svn, trac, etc).

Ele deu uma demonstração muito legal de jQuery (que eu já uso e recomendo inclusive), montando lá ao vivo e a cores um menu em árvore que, se não me engano, não levou mais de 5 minutos para ser realizado.

Falando mais sobre produtividade e o papel do programador, citou pontos básicos e que parecem bestas, mas que na realidade são muito importantes para todo o bom programador: backup, digitação, e também editor de código, que, segundo ele, precisa ter (entre outros recursos) find & replace com expressões regulares, snippets… também citou o fato de ele usar VI, e disse que não iria recomendar o VI para todo mundo porque ele é realmente difícil de aprender (embora seja muito bom depois que se aprende).

Seguindo o papo de produtividade, mostrou o conceito de TDD (desenvolvimento guiado por testes), dando uma demonstração da técnica montando uma função para validar e-mails que não era perfeito nem nunca ia ser - aqui ocorreu o momento mais engraçado de todo o ELPI, que não tenho como reproduzir, só quem estava lá entenderia, só posso dizer que eu e todos ao meu redor choraram de rir - e citando as vantagens que o TDD traz, principalmente na questão qualidade de código.

Pessoalmente achei a melhor palestra do evento, e a julgar pela atenção e envolvimento do público em geral, não fui só eu que tive essa opinião. Inclusive meu amigo Mailon que estava ao meu lado no auditório teve a mesma opinião.

12:00 am - Foi a hora da palestra da Microsoft, entitulada “O fator ‘UAU’”. O palestrante começou falando de comunidade, passando por assuntos tais como experiência do usuário. Me pareceu que o palestrante tentou passar a idéia de que uma aplicação é boa quando o usuário vê/usa e diz “UAU”.

Ficou a palestra inteira batendo na mesma tecla de que a Microsoft está tentando se tornar mais próxima do opensource. No entanto, temos algumas discrepâncias, pois parte da “filosofia” do software livre é aquela de que o mesmo direito que você tem de usar uma coisa, você tem de não usar. Mas vem ele e me fala em Microsoft Visual Studio Express, Microsoft Blender, Microsoft isso, Microsoft aquilo, todos ferramentas que têm versões gratuitas, mas, me perdoem se eu estiver errado, são NECESSÁRIAS para se desenvolver na plataforma que eles estão propondo. Para mim, no momento em que você é dependente de uma ferramenta para fazer seu trabalho, você não é livre.

Outra visão distorcida que na minha visão ele tentou passar, é de que produtividade é fazer as coisas arrastando e soltado, e clickando em botões. Citou também o fato da plataforma deles ser compilada e não interpretada, segundo ele trazendo mais performance em tempo de execução. No entanto, o PC dele deu umas boas escorregadas e demorou um bocado para compilar alguns exemplos simples que ele fez (nenhum ao vivo, ele já levou tudo pré-pronto), uma dúvida minha que ficou no ar é como fica isso numa aplicação grande, será que é preciso esperar que o compilador compile toda a aplicação pra depois poder testá-la?

Agora começa a parte da palestra que eu menos gostei. Ele mostrou o tal do Silverlight que parece muito interessante, mas que, creio eu, não tem nenhuma grande vantagem sobre o Flash da Adobe.

Depois disso, citou a relação Designer x Programador, usando um exemplo muito divertido, em que ele mostrava a foto de um ovo como sendo um projeto do designer, depois a foto de um ovo todo quebrado como sendo o design após passar pelas mãos do programador e, por final, a foto de um ovo todo remendado como sendo o projeto final. O problema foi a solução que ele apresentou para isso: um tal de XAML, que ele citou como sendo uma “revolucionária linguagem que está aí para servir programadores e designers”, mas peraí, já não temos os Padrões Web resolvendo este problema? Pra que mais uma tecnologia pra fazer a mesma coisa?

Foi a palestra que eu menos gostei, não por ser da Microsoft, mas porque apresentou aquela característica que todos conhecemos da Microsoft, de em vez de usar tecnologias e padrões que já existem, criar os seus próprios, causando uma confusão no mercado (basicamente o que já aconteceu e continua acontecendo com o Internet Explorer). Foi a única palestra, aliás, em que vi muita gente levantando e saindo do auditório.

02:05 pm - Após o almoço, foi a vez da Google. O palestrante começou falando sobre a história da empresa e a meta que eles pretendem cumprir (mesmo sendo impossível, segundo ele): “Organizar toda a informação do mundo” (olha a história da que a Google iria dominar o mundo). Falou também que eles querem tornar toda a informação acessível de facilmente.

Depois disso ele citou três ferramentas do Google para auxiliar no marketing na internet: Google Adsense, Google Adwords e Google Analytics.

Aqui vai um ponto interessante, perguntado por uma pessoa da platéia sobre o porquê de a Google manter dois sites de vídeos (Google Video e YouTube) ele deu a entender, pelo menos na minha concepção, de que o Google Video será descontinuado, dizendo que o YouTube deu mais certo e que é no que eles estão trabalhando agora, e que deverá continuar (talvez tenha faltado um complemento na frase dele, mas do jeito que foi dito…).

Foi uma palestra muito interessante, e muito útil inclusive, pois foram apresentados muitos produtos e serviços que a Google oferece para divulgação de sites.

03:08 pm - Hora da palestra do Gil Giardelli, entitulada “WWW x WWD - A internet inteligente”. Ele falou basicamente sobre coisas tradicionais (tv, rádio, etc) que estão sendo reinventadas na internet, citando muitos exemplos.

Uma frase muito interessante que ele falou foi “Tudo que é sólido, desmancha na rede”. Ele citou a evolução constante do mercado, o crescimento das Startups, e também o que ele chamou de “Caos 2.0″.

Também falou sobre os 4 C’s: Colaboração, comunidade, conteúdo e comércio.

Foi a palestra que me fez pensar mais, pois ele apresentou visões de passado/presente e futuro, questionamentos muito interessantes. Foi também uma palestra muito divertida que nos fez rir bastante.

04:20 pm - Hora do coffee break da tarde, tão bom quanto o da manhã.

04:50 pm - Foi a vez do Cesar Pazi falar sobre “Novas plataformas para um novo marketing”. Ele é presidente da AG2 e falou sobre alguns assuntos que nós falamos na nossa entrevista com Marco Gomes (diretor de tecnologia da Boo-box).

Entre os assuntos estiveram empreendedorismo (que ele diz ser entusiasta), e também a questão da irrelevância da publicidade (publicidade-lixo), onde ele usou uma foto com um caminhão cheio de abóboras para exemplificar: como todas as abóboras são iguais, nenhuma se destaca, logo todas são irrelevantes.

Falou também que as campanhas de marketing na web devem ser “webnative”, ou seja, planejadas e executadas para o ambiente da web, e não iguais às que vemos na TV, no jornal ou no rádio.

Ele citou pontos muito importantes como sendo boas idéias para um bom marketing webnative: Inovação, individualidade, interatividade, colaboração e mobilidade. Mostrando exemplos de grandes empresas como C&A e Master Card.

Conclusão e visão geral do evento

Não me arrependi nem um pouco de ter comparecido, foi um evento muito legal que realmente quem tem oportunidade de ir deve ir, tanto pelas palestras quanto pelo networking.

Parabéns aos palestrantes e ao pessoal da Locaweb pela organização exemplar.

[]’s