Revista iMasters #07 - Agosto

Page 1

Agosto 2013 / Ano 02 / Edição 07 Nós fazemos a Internet no Brasil

Nuvem Negra ou, computação em nuvem não são só flores Front-End Ops: introdução a uma nova disciplina #frontend #pág36

TI na propulsão do marketing

R$24,00

#mktdigital #pág48

Wordpress sem limites #cms #pág32



Expediente TIAGO BAETA Publisher LUIS LEÃO Editor RINA NORONHA (MTB 2759-ES) Editora/Jornalista Responsável EDU AGNI Projeto Gráfico / Diagramação NATHÁLIA TOREZANI Revisão COLABORADORES Alê Borba, Alvaro Vasques, Carine Roos, Cristian Gallegos, Daniel Filho, Flavio Flatschart, Kemel Zaidan, Leandro Vieira, Lina Lopes, Lucia Freitas, Pedro Gravena, Pedro Maciel, Reinaldo Ferraz, Vinicius Depizzol, Wagner Crivelini. Eskenazi Indústria Gráfica Gráfica Grupo imasters Organização > 1000 exemplares > ISSN 1981-0288

Alameda Santos, 2395 - 1º andar Cerqueira César, São Paulo/SP CEP: 01419-101 - Brasil www.imasters.com.br/revista redacao@imasters.com.br Twitter: @iMasters Facebook: /PortaliMasters Os artigos assinados são de responsabilidade dos autores e não refletem necessariamente a opinião da revista. É proibida a reprodução total ou parcial de textos, fotos e ilustrações, por qualquer meio, sem prévia autorização dos artistas ou do editor da revista.



Editorial Que a gente vive em um mundo onde todos estamos cada vez mais conectados, todo mundo sabe. Estamos interagindo todos os dias por meio das redes sociais, conversando com amigos, colegas de trabalho, conhecidos, amigos de amigos, mas será que temos uma relação mais próxima com essas pessoas ou toda essa conectividade nos afasta delas? Pare por um momento para observar o que estamos fazendo no nosso dia-a-dia. Vejam que um objeto adquiriu uma importância tão grande que ele agora não sai dos nossos bolsos. O celular (smart ou não) passa a ser nossa interface de contato com o mundo. Aonde quer que esteja, ele o deixará on-line e acessível para sua rede. E isso tem um preço: seus dados e todo o conteúdo que você gera e/ou consome estão em algum lugar. Sim, a nuvem existe e é exatamente dela que trataremos nesta edição. Falaremos da nuvem sob uma perspectiva que ninguém tem a coragem de falar: qual o risco de estarmos dependentes de uma estrutura na qual não temos o menor controle? Como isso pode afetar nossas vidas. Aonde entra a questão da privacidade e quais são as discussões

sobre sustentabilidade e quais os perigos que estamos sujeitos. Enfim, quero dedicar essa edição a todos os que tem a curiosidade, a vontade de aprender sobre todas as coisas, em especial dedico a um grande irmão que perdi este mês. Alberto Fabiano, hacker conhecido por muitos outros nicks (Aleph, Techberto, @alfacme, Voidberto, Fabiano, entre outros) e um dos fundadores do Garoa Hacker Clube. Ele representou para mim alguém que podia falar de qualquer coisa com propriedade e que sempre carregou consigo aquele lampejo de curiosidade e de tentar entender o mundo. Aleph sempre permanecerá na nuvem (com todos os seus nicks) e na lembrança daqueles que tiveram a oportunidade de conhecê-lo. Boa leitura! Luis Leão é desenvolvedor web que encontrou em APIs e hardware aberto novas formas de integrar a web com o mundo real. www.luisleao.com.br redacao@imasters.com.br


6 > Sumário

22 :: Capa > Nuvem Negra

</> 36 :: Front-End Front-End Ops: introdução a uma nova disciplina

48 :: Marketing Digital TI na propulsão do marketing

32 :: CMS WordPress sem Limites


7

08 :: Entrevista > Larry Wall 14 :: Conexão Vale do Silício > A figura da cultura inventada das startups 16 :: Banco de Dados > Índices: equilibrando os pratos da balança 26 :: Por dentro da W3C > Garantindo a acessibilidade do seu website 28 :: Cultura Hacker > Mitch Altman e a origem dos hackerspaces 35 :: +Interatividade > O Gorila, o supercapacitor e a reinvenção dos bancos 38 :: Design > Use design para melhorar seu código 42 :: Gerência de TI > Qual é a capacidade do seu time de tecnologia? 46 :: Comunidades > Interação a favor dos negócios: IxDA-SP 51 :: Código Livre > Informações e dicas sobre projetos Open Source 52 :: Conteúdo Digital > ePUB3: publicações multimídia interativas 54 :: Encontro 7Masters 62 :: Analytics > Mapeamento de ações telefônicas no Google Analytics 64 :: Review > Glass: o melhor “wearable” ou o melhor “gadget” nunca antes visto? 66 :: Criatividade Tecnológica > “How to make (almost) anything” 68 :: iMasters Box

A iMasters é uma revista de Tecnologia/Web aberta a novas ideias. Para colaborar envie o seu material por e-mail <revista@imasters.com.br>


Markdown A text-to-HTML 8 >-Entrevista > Larry Wall conversion tool for web writers Copyright (c) 2004 John Gruber <http://daringfireball.net/projects/markdown/>

ackage Text::Markdown; equire 5.006_000; se strict; se warnings;

se Digest::MD5 qw(md5_hex); se vars qw($VERSION); VERSION = ‘1.0.1’; Tue 14 Dec 2004

# Disabled; causes problems under Perl 5.6.1: use utf8; binmode( STDOUT, “:utf8” ); # c.f.: http://acis.openlib.org/dev/ erl-unicode-struggle.html Por @kemelzaidan Com tradução e

Global default settings: edição de @RinaPri

y $g_empty_element_suffix = “ />”; utput Lançada em 1987, Perl é y $g_tab_width = 4;

# Change to “>” for HTML

uma linguagem que tem como objetivo ser flexível e capaz de fazer códigos funcionais. Seu criador, Larry Wall, fez Globals:praticamente todo o processamento de texto em sistemas baseados em Unix, utilizando diversas ferramentas, como AWK, ‘sed’, C e linguagens shell Regex to match balanced [brackets]. See Friedl’s script. A ideia era juntar as principais “Mastering Regular Expressions”, 2nd Ed., pp. vantagens 328-331. y $g_nested_brackets; de todas essas linguagens: expressões regulares g_nested_brackets = qr{ do ‘sed’; a identificação de padrões #deAtomic AWK; matching a (?> [^\[\]]+ # Anything profundidade de C; além da sintaxe baseada tanto other han brackets em C quanto em Shell Script. |

\[ (??{ $g_nested_brackets }) ested brackets

# Recursive set of


}x; 9 # Table of hash values for escaped characters: my %g_escape_table; foreach my $char (split //, ‘\\`*_{}[]()>#+-.!’) { Há anos, no tempo em que as redes tinham uma Revista iMasters: Qual é a sua formação, o $g_escape_table{$char} = md5_hex($char); largura de banda muito pequena, as pessoas que você estudou na faculdade? } não podiam simplesmente enviar uma nova cóLarry Wall: Eu estudei muitas coisas, diversas, e quase não consegui concluir nada porque não tinha créditos suficientes para nenhum curso. Mas, final das contas,used conseguiby fazervarious com que a fa# Globalnohashes, culdade deixasse eu me formar. Entre as coisas my %g_urls; que estudei estão programação e linguística, dois my %g_titles; assuntos que foram primordiais para que eu chegasse ao Perl. Mas também fui bem além disso, my %g_html_blocks; passando por química e música, por exemplo.

pia dos recursos. Mas se isso fosse um arquivo de patch, as pessoas poderiam manter seus softwares sincronizados.

utility routines

Eu realmente não consegui fazer com que as pessoas aplicassem os patches na primeira versão que eu enviei. Eu enviava os patches e as pessoas não aplicavam um ou outro, porque não era necessário na máquina deles. Mas aí um terceiro patch viria e bagunçaria tudo, porque RiM:track Por que você decidiu estudar inside computa# Used to when we’re an ordered or o unordered list ninguém tinha aplicado outro anterior. Então ção? O que te chamava a atenção? eu percebi que precisava achar uma forma para # (see _ProcessListItems() for details): encorajar as pessoas a manterem seus softwaLW: Bom... você my $g_list_level = pode 0; conseguir que os res sincronizados, assim, quando um outro patch computadores façam coisas que as pessoas fosse enviado eles aplicariam a mesma versão. acham interessantes! Então, uma das coisas que foi internalizada pelo # Check to see if Markdown.pm has been loaded; if so we must be programa de patch desde o início foi um pré-reA verdade é que eu provavelmente estou em alloaded gum lugar dentro do espectro do autismo. Sendo quisito que determinava que uma certa versão do patch deveria estar instalada. # as a perl module. assim, eu tenho uma enorme dificuldade em lidar com pessoas. Eu consigo fazer isso, $INC{‘Text/Markdown.pm’}; mas é um my $g_perl_module = exists A segunda versão foi muito mais fácil de manter grande estresse para mim. Então, poder se relaporque que as pessoas já estavam usando, ao cionar através de algo que eu faço e que os outros menos até quando chegamos ao ponto delas covejam o que eu fiz, mas sem necessariamente ter #### Blosxom plug-in interface #################################### meçarem a colocar repositórios na rede e a fazer que discutir com alguém sobre o tempo ou outros isso de forma bastante automática. E o programa ##### assuntos assim, é uma forma de me tornar social. Patch ajudou a fazer o bootstrap, mais ou menos da mesma forma que o Perl ajudou a fazer

Meu pai é um pastor de igreja cristã e eu cres# Set $g_blosxom_use_meta to 1 to use Blosxom’s meta to o bootstrap na web do início; hoje, plug-in mesmo que ci nesse ambiente. Como o “filho do pastor”, eu muitos sites não usem mais a linguagem, muitos determine não podia ser tímido, mesmo sendo assim natuforam prototipados em Perl. ao longo dos should anos, eu aprendi a # which ralmente. postsEntão, Markdown process, using a “meta-markup: me relacionar com as pessoas, mas foi algo que Acho que sou uma dessas pessoas que escrevem markdown” eu tive que aprender, que desenvolver, e por isso protótipos para depois jogá-los fora! às vezes é fácil.set Para alguém eu, issodefault), Markdown will process all # header. If não it’s to 0como (the não é fácil. Para mim, é mais gratificante fazer alRiM: Por que você decidiu escrever o Perl? # entries. guma coisa que as pessoas vão achar útil. Por my $g_blosxom_use_meta = 0; LW: Para matar uma vontade! isso, eu tenho a tendência de medir o meu próprio

sub sub @_;

trabalho não pelo que eu vou conseguir com ele, mas pelo que eu posso oferecer a partir dele. E eu start { 1; } entendo que isso é o que define uma pessoa, não story { dinheiro ela tem. quanto

Na verdade, eu estava com um problema que precisava de processamento de texto para gerar relatórios.

my($pkg, $path, $filename, $story_ref, $title_ref, $body_ref) = Eu estava em um projeto para a NSA (National RiM: Por isso que o Perl entrou na sua vida?

Security Agency, a agência de segurança do governo americano), a empresa tinha um contrato lá LW: Foi quase um acidente. Eu apenas queria ofee eu estava desenvolvendo uma “rede segura” por recer uma coisa para os outros. E isso era bem ( (! $g_blosxom_use_meta) or toda a costa entre Santa Mônica, na Califórnia, e difícil porque não havia uma cultura desse tipo. a Pensilvânia. Nós trocávamos informações por Então eu pensei em uma forma de oferecer coisas and (defined($meta::markup) ($meta::markup =~ /^\s*markdown meio de arquivos de texto sobre o projeto, mas aos outros livremente. E algumas dessas coisas, eles queriam relatórios sobre os arquivos de texcomo o programa “patch”1, acabaram por ajudar a iniciar ){ o movimento de software livre, porque tos e o sistema Unix com o qual trabalhávamos tinha uma versão muito antiga do awk. muitas pessoas passaram a trocar patches.

if s*$/i)) } 1; }

$$body_ref

= Markdown($$body_ref);


Markdown A text-to-HTML 10-> Entrevista > Larry Wallconversion tool for web writers Copyright (c) 2004 John Gruber <http://daringfireball.net/projects/markdown/>

ackage Text::Markdown; equire 5.006_000; se strict; se warnings;

se Digest::MD5 qw(md5_hex); se vars qw($VERSION); VERSION = ‘1.0.1’; Tue 14 Dec 2004

# Disabled; causes problems under Perl 5.6.1: Imagem: http://bit.ly/11jS26r use utf8; binmode(A gente STDOUT, “:utf8” # c.f.: http://acis.openlib.org/dev/ estava fazendo um trabalho); de processade vista operacional torna-se um trabalho de temerl-unicode-struggle.html po integral. Nessa época meu cunhado me falou mento de textos e eu não conseguia fazer o que

queria nos relatórios. Então eu pensei: eu já havia escrito compiladores, eu sabia o que queria, então prototipei uma linguagem, algo como um Perl zero, e isso foi um laboratório secreto porque a gente trabalhava numa espécie de cofre, e alguns meses depois Global default settings: eu tive que discretamente tirar essa linguagem dali para chegar ao que seria o Perl 1, a versão que seria y $g_empty_element_suffix = “ />”; distribuída para o mundo. Eu queria apenas conseutput guir repassar alguns arquivos de texto e extrair algumas informações de algumas expressões regulares y $g_tab_width = 4; em um formato de texto meio aleatório e colocar no relatório e buscar por aquilo online. RiM: Como isso se transformou no Perl que temos hoje?

Globals:

“ah, você não quer se tornar um administrador de sistemas, isso é um trabalho morto”.

Mas enquanto eu estava fazendo isso, eu continuei desenvolvendo o Perl, então não era apenas uma linguagem para fazer análise de texto, eu decidi que queria também fazer uma parte de administração de sistema, como renomear # Change to “>” for HTML arquivos e todas as funções de um admin. Então eu tive isso bastante no Perl também. E nas várias interfaces do sistema. E aí as pessoas começaram a adicionar interfaces aos bancos de dados, através de versões especiais do Perl. Então havia o OraPerl, para o Oracle, o SybPerl para Sybase. E foi então que eu percebi que havia um problema: o que aconteceria se você quisesse usar Oracle e Sybase no mesmo programa? Seria preciso ter extensões que ajudassem a colocá-los juntos no mesmo programa.

LW: Quando eu comecei não existia ainda a noção de um administrador de sistemas. Havia o a IBM chamava de Programador Chefe – o Regex toque match balanced [brackets].Então, SeeachoFriedl’s cara número um, que sabia como tudo funcionaque o Perl mudou um pouco com “Mastering Regular Expressions”, pp. essa Ed., ideia de ter várias 328-331. caras, o que o levou a ter va. E eu meio que já havia estado nessa posição 2nd extensões que conversassem com vários backenem meu trabalho na Seattle Pacific University e y $g_nested_brackets; ds de bancos de dados. A ideia de fazer uma intambém quando trabalhei g_nested_brackets = qr{em uma empresa de terface com objetos de forma que fosse possível desenvolvimento de sistemas. Eu fui contratado falar mais sensivelmente com pessoas. (?> # Atomic matching para essa posição, mas o ideal desse cargo é [^\[\]]+ Anything meio diferente do que é um administrador de sisFoi dessa noção que o Perl#5 nasceu, com umaother temas, quando você tem outras pessoas fazendo boa dose de extensibilidade. Como resultado, eu han brackets descobri que muitas outras pessoas queriam fazer a programação e gerenciar o sistema de um ponto

|

\[ (??{ $g_nested_brackets }) ested brackets

# Recursive set of


#### Movable Type plug-in interface ############################### ##### 11 eval {require MT} unless $g_perl_module; # Test to see if we’re running in MT. unless ($g_perl_module || $@) { extensões, incluindo eu, e foi então que chegamos RiM: E por que você resolveu escolher uma require MT; linguagem de script? à questão de montarmos uma rede com milhões import de partesMT; do Perl para serem distribuídas (CPAN). require MT::Template::Context; LW: Porque é muito mais rápido em termos de tempo de programação. Pode não rodar tão rapiE isso tudo foi feito no Perl 5. Você poderia adiimport MT::Template::Context; damente, mas para operações de chamada, funcionar texto como em um programa em C – você até podia incluir texto em Perl 4, mas isso não fun-

ciona rápido o suficiente.

cionava direito para modelos de interface, e isso a # Test to see if we’re running >= eval {require MT::Plugin}; Em alguns benchmarks uma linguagem de script versão 5 tem. Não havia uma forma de fazer uma MT 3.0. interface para níveis mais baixos como códigos poderia até bater um programa em C mais bobo porque você teria que trabalhar muito para otimiem C e C++, então{isso começou com Perl 5. unless ($@) zá-lo e o Perl já tem isso, então pode fazer um RiM:require MT::Plugin; array associativo que provavelmente será mais Enquanto você criava o Perl, que linguaeficiente que uma tabela feita em C. Assim, em vocês tinha em mente? gensimport MT::Plugin; operações comuns, é possível otimizar o código LW: my $plugin = newas MT::Plugin({ em C para o código em Perl. A maioria delas. Basicamente linguagens com as quais eu era familiarizado – ou que eu pen name => “Markdown”, O problema primordial que queríamos resolver era sava que fosse – foram as que me influenciaram. description => “A plain-text-to-HTML formatting a perda de tempo dos programadores em ter que Algumas pessoas pensam que havia influência de manter anotações de ponteiros, strings, arrays, plugin. linguagens (Version: $VERSION)”, como SmallTalk, mas não é verdade. gerenciamento de memória e tamanhos de buffer; Ao menos até o Perl 6 – agora, sim, algu doc_link =>teremos ‘http://daringfireball.net/projects/ as ferramentas do Unix, na época, tinham limites ma influência do SmallTalk. muito arbitrários. markdown/’ SmallTalk foi a primeira linguagem RiM:}); Uma das maiores motivações para começar o Perl orientada a objetos, não é? foi “eu quero que as strings me digam o que elas MT->add_plugin( $plugin ); Não há limites arbitrários aí. E nós levamos } LW: Bom, você pode dizer que sim… Mas exis- são”. esse conceito para outras áreas também. Para

tiam outras antes. SmallTalk realmente levou isso começar, nós queríamos tipos de string que você para um outro extremo, do ponto de vista que um simplesmente não precisasse se preocupar. MT::Template::Context->add_container_tag(MarkdownOptions => su objeto é algo para o qual você envia uma mensagem, não apenas uma função de call engraça{ RiM: Quais são as maiores mudanças no Perl 6? dinha. Então, eles tinham uma visão mais global. my $ctx = shift; LW: Provavelmente a maior de todas é que finão havia uma influência direta da SmallTalk, Masmy $args = shift; zemos o Perl ser poderoso o suficiente para se não até o Perl 6. autocompilar. E eu espero que isso aconteça em ao menos my $builder = $ctx->stash(‘builder’); qualquer VM. Já temos compiladores de Perl 6 O Perl influenciou linguagens RiM:my $tokens = várias $ctx->stash(‘tokens’); para Mono e .Net, estamos trabalhando no Java. mais novas que têm sido muito usadas hoje, E existem algumas ideias para usar isso no LLVM. criando um paradigma para linguagens inter pretadas. if (defined ($args->{‘output’}) ) a {linguagem seja poderosa o sufiComo você enxerga isso? Queremos que ciente para isso e o seja eficiente, para $ctx->stash(‘markdown_output’, lcde forma $args->{‘output’}) LW: Com certeza Ruby e Python tiveram uma quebrar a si mesma, para que possa mudar a lin influência } inicial do Perl. Na verdade isso não foi guagem quando decidirmos mudá-la, para ter noplanejado no Python. vas versões de Perl e para ser capaz de escrever em outras linguagens de domínio específico que) O Perl defined (my $str = $builder->build($ctx, $tokens) meio que estabeleceu, ao menos no munsejam melhores que o Perl. do do Unix, esse de linguagens de script. orgênero return $ctx->error($builder->errstr); Havia Shell – e você podia escrever em Shell Script As gramáticas inseridas no Perl 6 são poderosas $str; # return value – mas na verdade isso sempre foi pensado como e muito expansíveis. Provavelmente se você tiver });uma forma de unir os programas em C. E porque que colocar uma única coisa no topo da lista, seria elas eram construídas dessa forma? Era bem difícil isso. Mas há muitas outras coisas que nós percede fazer um programa decente com elas. Era difícil bemos no Perl 5, e também várias outras coisas MT->add_text_filter(‘markdown’ =>adicionamos, { fazer com que as coisas se relacionassem. E como que como orientação a objetos, de todo mundo tinha um cliente Unix diferente, era forma que demos os princípios***, mas não for label => ‘Markdown’, bem difícil escrever um Shell Script naquela época. necemos nenhum tipo de padrão, de boas prá-

docs => ‘http://daringfireball.net/projects/ markdown/’, on_format => sub { my $text = shift;


if (defined $ctx) { my $output = $ctx->stash(‘markdown_output’); (defined 12 > Entrevistaif > Larry Wall $output && $output =~ m/^html/i) { $g_empty_element_suffix = “>”; $ctx->stash(‘markdown_output’, ‘’); } elsif (defined $output && $output eq ‘raw’) { $raw = 1; $ctx->stash(‘markdown_output’, ‘’); } else { $raw = 0; $g_empty_element_suffix = “ />”; } } $text = $raw ? $text : Markdown($text); $text; }, }); Imagem: http://bit.ly/1e6kJWY

# If SmartyPants is loaded, add a combo Markdown/SmartyPants tex mente da literatura de orientação a objetos, mais ticas. Então as pessoas fizeram as suas próprias lter: regras. Foi um ótimo laboratório de testes, mas do que de alguma linguagem específica. my $smartypants; então existiam 30, 40 formas de escrever objetos

{ ants’}; }

e eles não se comunicavam, não trabalhavam um com o outro.

RiM: Você acha que seu background em linguística ajuda nisso?

LW: Acho que sim, mas muito além disso é o senGostamos da flexibilidade de ter esses laborano warnings “once”; timento de que uma linguagem de programação tórios para os princípios, mas no Perl 6, quando $smartypants = $MT::Template::Context::Global_filters{‘smarty deve refletir a forma como falamos sobre isso, vemos que há muitas formas de se fazer algo no então se você quer falar que um objeto está rePerl 5, decidimos que vamos escolher uma deslacionado (has a relationship) a um determinado sas formas como padrão. Continuaremos com atributo, você deve realmente usar o termo “have” os princípios, mas eles ficarão por baixo de uma camada de padrões, então teremos uma forma para declarar isso no Perl 6. Se ele é um relacionapadrão de declarar classes,{de incorporar classes mento (is a relationship) você usa o “is”. if ($smartypants) abstratas, que chamamos “roles” genéricos, que MT->add_text_filter(‘markdown_with_smartypants’ => { É uma questão de sensibilidade linguística, então, são formas padrões de fazer várias cosias, que ao invés de chamar coisas por outros nomes, podem serlabel modificadas se você realmente quiser => ‘Markdown With SmartyPants’, usamos a construção que temos no Inglês. É ou precisar, mas esperamos que os padrões aju docs => ‘http://daringfireball.net/projects/ algo mais natural do que usar palavras funcionais, dem as pessoas a escreverem códigos melhores como acontece em outras linguagens. arkdown/’, quase que por acidente.

on_format => sub { RiM: Mas isso muda muito a sintaxe da linNão vai ser preciso entender porquê aquele é o myas $text = shift; guagem? O Perl 6 vai ser muito diferente? E padrão, mas quando pessoas tentam fazer suas coisas, na metade do tempo eles decidem my $ctx = shift;como fica a retrocompatibilidade? pela forma errada... então não é que queremos if (defined $ctx) { Há um grande número de diferenças. No geLW: chegar ao nível do Python, dizendo que há apea sintaxe do Perl 6 é um super set do Perl 5. nas uma forma de fazer aquilo,my mas vamos tentar $output =ral,$ctx->stash(‘markdown_output’); Se você escreve em Perl 5 e isso não funciona facilitar a forma correta, a melhor forma, para fazer $output eq ‘html’) { normalmente, vai&& estar bem perto de funcionar, aquilo, meio que por acidente. if (defined $output porque você pode escrever em Perl 6 dentro do $g_empty_element_suffix = “>”; Bom, eu meio que estou levando o processo do } é realmente “pe- sub set que é muito parecido com Perl 5. Python para o Perl 6. O modelo gar emprestado” o novo modeloelse de objetos { de vá- Não é exatamente a mesma coisa, mas o que fizemos no Perl 6 foi intencionalmente quebrar a rerias fontes. E na verdade, trata-se de pegar direta $g_empty_element_suffix = “ />”; } } $text = Markdown($text);


}

});

13 lsif (! $g_perl_module) { ### BBEdit/command-line text filter interface ######################### sesse “ah, nós não precisamos mais de Python ou o queBlosxom Needs totrocompatibilidade. be hiddenQueremos fromquebrar MT tudo (and when running in static algo assim”. Mas é claro que isso é um objetivo a for possível, essa foi a ideia inicial. Então, vamos ode). longo prazo. E provavelmente nunca chegaremos precisar de alguma estratégia de migração, uma

lá, mas, ainda assim, é bom ter objetivos impossícombinação de emulação, interpretação cooperaveis contanto você entenda que eles são impostiva ou tradução, por exemplo. Existem várias for# We’re only using $blosxom::version telltrabalhando Perl neles notdeto warn síveis. Euonce; quero continuar mas de fazer com que os códigos das versões 5 e qualquer forma. Mesmo que você saiba que o que s: 6 da linguagem interajam. Teremos aí um caminho. está fazendo irá, de alguma forma, falhar, você no warnings ‘once’; Mas quando você começar a ver as novidades que deve fazer tudo o que puder para isso. O mundo unlesso Perl ( 5defined($blosxom::version) ) {de coisas uteis que tiveram grandes fanão suporta diretamente, então vai comeestá cheio çar a usar a sintaxe, mas nós tentamos adicionar lhas e eu acho que Perl 6 vai ser muito útil! use warnings; as novidades de uma maneira bem sistemática, de Mas estamos realmente pensando no longo praforma que todas as declarações sejam similares. Desde que começamos, pensamos em fazer #### Check for command-linezo.switches: ################# parte do progresso no início. Mas o Perl 5 estava O Perl 6 tem muito mais sintaxe a ser declarada my o %cli_opts; reconhecidamente estável e tinha muito apoio da que Perl 5, mas funciona de uma forma bem o que nosin permitiu gastar um bom diferente. versãoGetopt::Long}; 5, você pode declarar as # comunidade, eval Na {use don’t load library mode tempo no redesenho. classes, mas tem que usar a palavra package. Getopt::Long::Configure(‘pass_through’); Você pode dizer que classes são pacotes, então RiM: Como é o relacionamento da comunidausa a palavra package. Isso também acontece no GetOptions(\%cli_opts, de de desenvolvedores brasileiros com Perl? Perl 6, uma classe é um pacote, mas você usa ‘version’, class. Então, em vez de ir para a palavra-chave do LW: Os brasileiros são envolvidos com Perl há bas ‘shortversion’, princípio, tendemos a distinguir a palavra-chave e tante tempo. Temos muita gente contribuindo com então falar que uma classe é um tipo. Isso torna ‘html4tags’, Perl 5 e 6 no Brasil. E os brasileiros têm a grande as coisas mais claras. vantagem do fuso horário: vocês estão entre EUA e ); Europa, o que facilita muito o trabalho! </> Ao mesmo tempo, muitas coisas que você faz ao

if ($cli_opts{‘version’}) { # Version info executar código no Perl 5 parecem declarações isumMarkdown, version $VERSION.\n”; no 6, mas print na verdade “\nThis não está rodando código por baixo, então quando você roda uma2004 de print “Copyright John Gruber\n”; Entrevista publicada originalmente na claração de classe, está na verdade fazendo uma print “http://daringfireball.net/projects/markdown/\ Revista Espírito Livre chamada do protocolo do meta objeto enquanto \n”; compila, e pode até fazer um hook se quiser. exit 0; Portanto, você ainda tem toda a flexibilidade, mas } a escondemos sob um nível de declaração. Asnós sim, há um mapeamento mais natural entre o que if ($cli_opts{‘shortversion’}) { # Just the version as pessoas pensam e o que a sintaxe se parece. umber string. Nesse nível, é uma linguagem mais complicada, print $VERSION; sintaticamente, mas em termos de conceito não exit 0; é, porque exitem os mesmos conceitos. } Então, o estado da arte da programação em Perl { # Use HTML tag styl 5if tem ($cli_opts{‘html4tags’}) um conjunto de conceitos que se encontram muito bem no Perl 6, mas na nova versão nstead of XHTML eles estão mais bem elaborados, como em “aqui = “>”; temos um $g_empty_element_suffix padrão que você deve usar, a não ser que } você realmente saiba o que está fazendo”. RiM: Qual a importância de Perl hoje, e como você espera que a linguagem esteja no futuro?

#### incoming text: ########################### LW: Bom, Process é claro que eu quero que Perl domine o mundo! Eu adoraria ver Perl 6 se tornar poderoso my $text; o suficiente de forma que o Google algum dia dis { local $/; # Slurp the whole file $text = <>;


14 > Conexão Vale do Silício

A figura da cultura inventada das startups Por @vdepizzol

Quando se fala em cultura de startups, é fácil imaginar ambientes descontraídos, pessoas jogando videogame, mesas de ping-pong e gente andando de patinete pelos escritórios. Pelo menos é essa a cara que muitas empresas tentam vender. E pelo que dá para notar, funciona: até reportagem meia-boca da Globo News se vê só focando nisso daí. O problema é que essas figuras — as salas de descanso, os ambientes temáticos e as mesas de ping-pong — não dizem muito sobre a cultura de uma startup. Não leve a mal, essas coisas todas são bem legais de se ter em um escritório; mas elas são simplesmente… superficiais demais. Não dá para saber como é a cultura de uma empresa simplesmente olhando para essas coisas. A cultura trata dos valores e os comportamentos compartilhados entre os funcionários da empresa. Não é se você tem cara de startup hype ou de multinacional quadrada, e também não é algo que é escrito numa letra bonita e emoldurada na parede do escritório. Ela é algo em constante evolução, e se mostra de verdade quando as pessoas estão lá, focadas trabalhando: é sobre o que as impulsiona, e sobre o compromisso de realizar o trabalho direito. E para que isso aconteça, é bom esperar que haja uma boa comunicação entre você e seu chefe e colegas de trabalho, que exista espaço para desafios e experimentação. E também, por que não, que a jornada de trabalho não seja infinita e que exista uma política definida de férias.

Quando tudo o que se ouve sobre a cultura de uma startup são suas regalias, as pessoas se esquecem que se trabalha demais, que as horas dentro da empresa são longas, que as coisas nem sempre dão certo. E que startups estão todas lutando para se destacar no meio da multidão, e que farão de tudo para que isso aconteça. Porque não existe essa coisa de almoço grátis. Da próxima vez que você lamentar não ter Super Mario Kart para jogar no escritório, pense na cultura que o rodeia, e não nas regalias que anunciam para você. Você pode descobrir que está numa posição melhor do que imagina. Trabalhar em uma startup é, sim, interessante, você aprende muita coisa e consegue se desenvolver profissionalmente em uma maneira que, talvez, não fosse possível em outro tipo de empresa. Mas é preciso lembrar que, mesmo com a mesa de ping-pong, o trabalho existe. E às vezes o tempo para usar os benefícios pode nem existir. </>

Vinicius Depizzol é designer de interface, e partiu com passagem só de ida de Vitória/ES para São Francisco/CA, em 2012, para trabalhar na Xamarin, uma start-up que está mudando a forma de criar apps multi-plataforma.


15


16 > Banco de Dados

Índices: equilibrando os pratos da balança Por @wcrivelini

Desde que inventaram os primeiros computadores, os profissionais da área de tecnologia da informação são pressionados a desenvolver aplicações em prazos cada vez menores. Não por acaso, as ferramentas de desenvolvimento evoluíram absurdamente, dando mais poder para os programadores dominarem todas as etapas do processo de criação de aplicações e sistemas. Mas esse poder tem um efeito colateral que nem sempre é avaliado com a atenção necessária. Se o programador passa a ter controle sobre mais e mais aspectos relacionados à criação dos sistemas, ele também recebe a responsabilidade e a obrigação de conhecer esses assuntos com maior profundidade. Um desses aspectos é a criação dos bancos de dados. Cada vez mais vemos empresas nas quais a modelagem da base e a estratégia de indexação das tabelas são de responsabilidade de programadores. E essas tarefas são fundamentais para a boa operação de um banco de dados e, consequentemente, de toda aplicação. Neste artigo, eu comento sobre algumas posturas em relação ao uso de índices e os erros mais comuns que são cometidos.

Veja a seguir os problemas que podem ocorrer com esses tipos de profissionais.

O programador otimista Ser otimista demais dá muito trabalho para o SGBD. Criar as tabelas é só o primeiro passo na construção da base de dados. É sempre muito importante definir chaves primárias em todas as tabelas, as chaves estrangeiras correspondentes e, principalmente, os índices que serão usados. Indexação é essencial para consulta dos dados. Você pode ter a falsa impressão de que é bom criar tabelas sem nenhum índice, já que isso vai ajudar seu banco de dados a ter uma performance um pouco melhor nas operações de alteração de dados (INSERT, DELETE, UPDATE). E esse efeito é real. Numa operação de inserção em uma tabela sem índices, por exemplo, a operação vai ser registrada no log do banco e em seguida o registro será gravado nas páginas de dados dessa tabela. E só.

Perfis dos profissionais

Porém, você nunca na sua vida vai trabalhar com um banco de dados em que só se insere/altera dados. Todo banco de dados precisa ser bom na recuperação dos dados, ou seja, precisa ter boa performance em operações SELECT. Afinal, para que serviria gravar dados que nunca seriam lidos?

Existem dois tipos de programadores que preocupam qualquer DBA: os otimistas, que acham que basta criar as tabelas e o banco de dados estará pronto; e os pessimistas, que têm medo de que a base tenha problemas com performance e resolvem tomar “providências” sobre o assunto por conta própria.

Em 99% dos casos, consultas filtram e/ou agrupam dados. E essas duas operações obrigam o SGBD a pesquisar por registros específicos. Se não houver nenhum índice na tabela, o SGBD terá que vasculhar todas as páginas de dados para localizar esses registros. É como procurar uma palavra dentro de um livro inteiro.


17

Um índice é um catálogo que funciona de forma muito parecida com aqueles índices remissivos que existem no final dos livros. Ali, o leitor pesquisa a palavra desejada e o índice mostra em que páginas ela é encontrada. E, grosseiramente, é assim que funciona o índice de uma tabela. É fácil entender por que um índice pode ajudar muito a performance das consultas em uma tabela, e que a falta de índices (ou existência de índices ruins) causará um enorme impacto na performance. Eu não me lembro de nenhum cenário em que seja recomendável criar uma tabela sem nenhum índice. É obrigação do proprietário da tabela criar ao menos um índice, e ele deve ter muito cuidado na escolha dos campos que farão parte desse índice.

O programador pessimista Outro comportamento desastroso é o do programador que não confia nos índices que ele definiu... e daí resolve criar um batalhão de índices em cada tabela. Vi muitas vezes profissionais tão pessimistas que até subestimaram a eficiência do otimizador de consultas do SGBD e definiram índices sobre as mesmas colunas, mudando apenas a ordem em que elas aparecem. Índices são, grosso modo, resumos dos dados. Assim sendo, é de se esperar que cada índice ocupe uma pequena fração do espaço ocupado pelos dados. É muito comum que se crie mais de um índice por tabela, mas é preciso ter muito cuidado com isso. Eu já vi ambientes de produção em que havia tabelas com centenas de milhões de registros que tinham tantos índices diferentes que os dados representavam menos de 20% do espaço ocupado em disco... os outros 80% eram usados para armazenar índices! Pense no impacto que isso causa para o banco de dados: cada novo registro que é inserido, atualizado ou excluído da tabela, precisa ser registrado primeiro no log do banco, depois nas páginas de dados da tabela e em seguida nas páginas de dados de cada um dos índices que estão associados à tabela. Se sua tabela tiver seis índices, por exemplo, uma única operação de INSERT precisará escrever dados em oito lugares! Evidente que qualquer alteração de dados será muito lenta numa tabela com tantos índices.

E ainda existe um risco escondido nessa história. Você até pode imaginar que suas operações de SELECT terão garantia de boa performance... Mas isso não é verdade. A boa performance depende da qualidade dos índices que você definiu. Portanto, índices ruins certamente vão impactar a alteração de dados, mas eles podem não funcionar bem na seleção de dados. Isso leva à outra questão: é preciso muito cuidado para definir os índices de cada tabela.

Bons índices Um bom índice deve ter alta cardinalidade, isto é, usar valores que são raramente repetidos. Dessa forma, um valor pesquisado vai selecionar um pequeno número de registros (e muitas vezes um único registro, como acontece quando temos índices do tipo UNIQUE). Por exemplo: nunca se devem indexar campos do tipo SIM ou NÃO, já que eles selecionam metade de toda tabela. Outra característica que se deve observar é o “comprimento” do índice, ou seja, a quantidade de campos e o tamanho dos campos usados no índice. Comprimento menor significa menos espaço para armazenamento do catálogo de dados e também maior facilidade de processamento pelo SGBD. A relevância do índice em termos de negócio também deve ser observada. Muitas vezes, temos problemas com índices que são tecnicamente bons, mas que não são relevantes do ponto de vista do negócio e por isso não apresentam boa performance. Uma chave substituta (leia-se: campo IDENTITY ou SEQUENCE) é um ótimo candidato a índice, considerando-se os aspectos técnicos. Mas ela não representa nada no mundo dos negócios. Ela foi criada apenas para facilitar a identificação do registro da tabela. Isso não quer dizer que chaves substitutas sejam sempre índices ruins. Existem muitos casos em que a chave candidata da tabela (aquela que identifica um registro e o torna único) é composta por oito ou mais colunas. Isso acontece, por exemplo, quando se trabalha com modelagem multidimensional (Business Intelligence). Nesses casos, é muito provável que a chave candidata seja uma chave muito longa e, eventualmente,


18 > Banco de Dados

seria vantajoso indexar a chave substituta em vez da chave candidata. Essa é uma escolha arriscada e exige que o DBA e/ou programador avalie caso a caso a estratégia a ser usada.

O que são índices clusterizados Por último, é preciso diferenciar dois tipos essenciais de índices. A grande maioria dos SGBDs relacionais usa ao menos dois tipos de índices que precisam ser conhecidos por todo profissional que lida com bancos de dados: os índices clusterizados e os não-clusterizados. Em geral, quando falamos de um índice, estamos pensando no que chamamos de índices não-clusterizados. Estes são catálogos construídos a partir dos dados da tabela, nos mesmos moldes do índice remissivo dos livros que eu descrevi anteriormente. Cada tabela pode ter quantos índices não-clusterizados que se deseje criar. Mas índices clusterizados funcionam de modo muito diferente. Em vez de criar um catálogo, esse índice redefine a ordenação física em que os dados são armazenados. Isso quer dizer que os dados são inseridos nas páginas de dados de tal maneira que sejam fisicamente gravados na ordem desejada. Por essa razão, cada tabela pode ter no máximo um índice clusterizado.

E também não se pode esquecer que o otimizador de consultas do SGBD decide pela utilização ou não de um dado índice em um determinada consulta baseando sua escolha nas estatísticas de utilização desse índice. São elas as estatísticas, que acabam por definir como será a interação entre o otimizador de consultas e os índices da tabela. É muito importante que se criem estatísticas de uso de índices e que elas sejam recicladas quando necessário. Estatísticas desatualizadas podem induzir o otimizador de consultas a tomar decisões erradas, comprometendo a performance das consultas.

Conclusão Indexação é de fundamental importância para o bom funcionamento de um banco de dados. Mas é um assunto complexo. É muito importante que o proprietário/administrador/desenvolvedor da base aja com bom senso na definição dos índices. Do mesmo modo como o remédio que pode curar ou matar, dependendo da dose que se ingere, os índices podem ser a salvação ou o pesadelo do seu banco de dados. E o caminho para evitar problemas é consultar um especialista... e ler a bula (documentação) para conhecer melhor esse remédio. </>

Por conta disso, todos os índices não-clusterizados de uma tabela criam catálogos baseados na ordenação definida pelo índice clusterizado (caso ele exista). Sendo assim, é fundamental que o índice clusterizado da tabela seja de boa qualidade, porque dele dependem todos os outros índices. Um bom índice clusterizado ajudará a melhorar performance dos índices não-clusterizados.

Manutenção de índices Apenas criar índices não é uma solução definitiva. Índices se fragmentam à medida que os registros da tabela são inseridos ou alterados. E precisam de manutenção periódica, para que o catálogo (ou seja, as páginas de dados do índice) seja reorganizado. Essa é a famosa operação de REBUILD.

Wagner Crivelini é DBA de SQL Server & DB2. Profissional certificado IBM IT Specialist Level 2 - Expert, publica o blog wCrivelini e o podcast Databasecast. Autor convidado de diversas comunidades técnicas no Brasil e no exterior, como SQL Server Central, iMasters, SQL Magazine e IBM DeveloperWorks.


19


20 > Capa

Nuvem Negra ou, computação em nuvem não são só flores Por @lufreitas para Revista iMasters


21

O cloud computing veio para ficar. E é importante conhecer, também, o outro lado dessa história – dos impactos às falhas. Todo desenvolvedor, hoje, usa a Nuvem. Aliás, todo mundo – desenvolvedor, usuário, empresas grandes e pequenas. Segundo Luli Radfahrer, professor de Comunicação Digital na ECA-USP, “rodar na Nuvem é tão obrigatório quanto ter um perfil nas redes sociais”. Nessa nova onda que estamos surfando, tudo parece lindo. Há disponibilidade de espaço, que nunca foi tão barato e acessível, há escalabilidade. E o efeito prático disso é a produção maciça de dados. “Para se ter uma ideia, em um dia do século XXI, produzimos três vezes o equivalente a tudo o que foi produzido até a década de 80”, diz Luli. Com uma horda de bilhões de usuários, todos a postos para compartilhar fotos, vídeos, blogs, reblogs, acesso móvel e experiências imersivas, sem falar no e-commerce, nas empresas, em todos os negócios online, o consumo de recursos é alto. Maior a produção, maior a preocupação – e a ansiedade com questões importantes de segurança e com o consumo de energia é gigantesco –, bem como as pilhas de lixo eletrônico. “Carros poluem, mas a gente reusa a matéria prima. Isso não acontece com os eletrônicos – que giram mais rápido e têm potencial muito mais tóxico para o meio ambiente”, diz Luli.

A Nuvem polui O Greenpeace concorda com Radfahrer. Único instituto a divulgar os impactos da tecnologia no meio ambiente, eles publicaram, em 2012, o estudo “Quão limpa é sua Nuvem?” (How Clean is your Cloud?, disponível para download em http://ow.ly/mDroH).

As conclusões fundamentais do estudo? 1. As três maiores empresas que constroem

negócios em torno da Nuvem, Amazon, Apple e Microsoft, se apoiam em fontes “sujas” de energia para abastecer suas estruturas. Yahoo! e Google lideram a inovação no setor, seja priorizando fontes limpas de energia para expandir suas nuvens, como investindo diretamente em fontes de energia renovável. 2. O Facebook, o principal destino dos mais de 800 milhões de usuários no mundo, se comprometeu a investir mais em energia limpa. O primeiro grande passo nessa direção foi dado com a construção de um novo datacenter na Suécia, que pode ser totalmente abastecido com energia limpa. 3. A concentração dos datacenters em determinados locais (principalmente Estados Unidos) tem impacto significativo no consumo de energia elétrica e na administração de suas fontes de produção. Se os novos equipamentos forem instalados nos mesmos lugares, fica cada vez mais difícil migrar os investimentos e as comunidades que os cercam para fontes limpas de eletricidade. 4. A Akamai (akamai.com) usou, no ano passado, o padrão de Eficiência de Uso do Carbono (Carbon Use Eficiency - CUE, em inglês). Ela foi a primeira e única empresa de TI a fazer isso. Já é um resultado da pressão ambientalista por tecnologias que sejam mais eficientes e menos poluentes. Há que prestar atenção também nisso. 5. Apesar das evidências, as empresas vendem a Nuvem como “verde”, mas não são transparentes a respeito do consumo de seus datacenters e avaliam muito mal seu impacto ambiental. 6. As comunidades de hardware e software deram sinais de compartilhar, no ótimo formato open source, as melhores práticas para que os novos equipamentos e programas tenham projetos mais eficientes.


22 > Capa

Tabela de uso de energia – fonte: How Clean is your Cloud?, Greenpeace


23

Luli concorda em gênero e grau com o estudo do Greenpeace. “Isso é o efeito colateral de uma ideia boa”, diz. Já Antonio Santos, especialista de Solução de Segurança da Oracle do Brasil, acha que a Nuvem usa melhor os recursos, porque acontece uma otimização do hardware em larga escala. Só que ninguém sabe exatamente o tamanho da Nuvem. O Greenpeace justifica que a falta de precisão se deve ao eterno crescimento dos negócios online, aos muitos aparelhos usados para acesso e à mudança rápida tanto da tecnologia como dos modelos de negócio. Mas a grande dificuldade é ter informações das empresas. Num ramo competitivo, em que os negócios exigem rapidez, segurança e sigilo, ninguém quer contar o que usa e como usa. De qualquer jeito, a Nuvem, em 2007, já era a quinta maior fonte de consumo de eletricidade no planeta - 623 bilhões de kwH. O Facebook consumiu, em 2011, cerca de 509 milhões de kWh. Em 2010, o Google consumiu dois bilhões de kWh. Repare nas datas: não, ninguém consegue consolidar a informação de um jeito uniforme! Graças à pressão ambientalista, no período de 2005 a 2010, em vez do aumento previsto de consumo (100%), a tecnologia aumentou o uso de energia elétrica em 56%. O que é paradoxal é que as empresas de TI estão mudando o mundo e a economia, mas ainda não começaram a inovar no uso de energia. Essa é a questão lá no front end. No back end, a coisa também não é simples. Segundo artigo do Datacenter Knowledge (aqui: http://ow.ly/ mDssD), a infraestrutura de todos está sendo muito mais requisitada. Exatamente por isso, é preciso ter maleabilidade e ser capaz de uma administração eficiente dos dados, principalmente se o negócio tiver um lado na Nuvem. Já existem soluções específicas para oferecer sistemas mais eficientes e atender às novas demandas tanto da tecnologia como dos negócios. Mais que isso: a Nuvem é capaz de oferecer todas as demandas do seu projeto, mas ela ficará de pé? Quem faz Internet sabe que nem só de

alegria se vive. Haja estômago e sangue frio para lidar não só com os ataques e com a disponibilidade e, no Brasil, com a infraestrutura da comunicação, que está sujeita a panes generalizadas e à falta de sinal em determinadas regiões.

Segurança é páreo duro Antonio e Luli chamam a atenção para outro lado obscuro da Nuvem: a segurança. Segundo Luli, a grande questão é que a facilidade de armazenamento cria um efeito cascata - você salva os mesmos dados em muitos lugares. “Como não existe uma dimensão física do que estão fazendo, há uma redundância de informação enorme. E isso prejudica a segurança dessa informação”, explica Luli. Com a facilidade de acesso da informação, os usuários tendem a relaxar com a segurança – “afinal, o que eu não posso pegar, não existe”, diz Luli. Antonio Santos, especialista em segurança da Oracle, ressalta que sempre é preciso pensar segurança de acordo com os três pilares: confidencialidade, disponibilidade, integridade. “A gente não deveria saber onde está a Nuvem, e esse é um dos pontos negativos: você confia seus dados, seu negócio a um fornecedor. Como essa informação será tratada?”, questiona. Em geral, todos se prendem à confidencialidade (sigilo dos dados colocados na Nuvem). Antonio diz que nenhum sistema é seguro se não pensar nos três pilares juntos. “Disponibilidade significa: o provedor de serviços consegue manter o serviço disponível 100% do tempo? As leis locais permitem o seu negócio? Haverá questões específicas de acesso à informação?”, explica Antonio. Integridade significa que seus dados estarão lá perfeitos, nada de corrupção. Para garantir isso, é preciso ter estrutura bem montada e a possibilidade de gerenciar usuários, para definir os usos e os limites de cada perfil que tem acesso à Nuvem. A insegurança está em todos os ambientes


24 > Capa

que frequentamos online. Basta coletar rapidamente as notícias sobre vazamento de dados de serviços – tanto gratuitos quanto pagos. Sony, Evernote e Apple são apenas três de muitos que perderam parte dos dados de seus usuários. No começo de julho, foi revelado um caso de vazamento maciço de dados do Facebook. Se a Nuvem é flexível, ela também pode ser privada. E a criptografia que temos já garante uma certa segurança às informações que precisam de sigilo. Antonio lembra que os funcionários vão levar seus dispositivos para o trabalho. Ao notebook juntaram-se smartphones, tablets, modems. A segurança dos dados envolve, também, o uso desses equipamentos (e das informações da empresa) dentro e fora do trabalho. Segundo Cezar Taurion, é preciso mudar o raciocínio da TI: “A própria consumerização gera a força necessária para a mudança de uma TI rígida e controlada por um departamento específico, como temos hoje, para approaches mais abertos, colaborativos e flexíveis, nos quais a TI passa a ser uma conselheira dos usuários”, diz (veja mais em http://ow.ly/mDtQB). Além disso, o Bring Your Own Device (BYOD) traz consigo a sua própria Nuvem, que Cezar chama de BYOC (Bring Your Own Cloud). Quem nunca colocou arquivos da empresa num Dropbox que jogue a primeira pedra... “É cada vez mais difícil separar nossa vida pessoal da profissional e, como a nuvem pessoal passa a ser nosso hub de conteúdo, como ignorar essa tendência dentro das corporações? Uma coisa é armazenarmos em um DropBox nossas fotos, músicas e vídeos das nossas férias, que pertencem a nós, e a decisão e o eventual risco é nosso. Outra é armazenar nessas nuvens conteúdo que pertence às empresas para as quais trabalhamos”, escreve o especialista aqui: http://ow.ly/mDu6U

Se a tecnologia muda, a TI tem que se repensar O que TI deverá proativamente desenvolver? Primeiro, quebrar paradigmas arraigados. Por

exemplo, considerar que plataformas sociais não são distração, mas sim a base para o aumento da produtividade. As pessoas estão cada vez mais interdependentes e conectadas, e trabalham de forma colaborativa. Impedir isso implica baixar a eficiência das empresas. Também é preciso entender que as informações internas são apenas um pequeno estrato do total de informações que os funcionários e executivos poderiam usar para efetuar suas tarefas e tomar decisões. As empresas usam em média 0,5% do total de informações, internas e externas, que de alguma forma podem ser úteis ao negócio. O conceito de Big Data se encaixa neste aspecto. A força de trabalho estará cada vez mais móvel, e dispor de dispositivos para acessar informações não deverá mais ser privilégio de alguns, mas essencial a todos os funcionários para efetuar as suas tarefas cotidianas. Mobilidade será a regra, e não a exceção. Por fim, redesenhar seus aplicativos para que eles se tornem plataformas onde as interfaces sejam desconectadas dos processos embutidos neles. Criar APIs que permitam aos usuários criarem suas próprias interfaces e customizar suas experiências, necessidades pessoais e preferências de uso. O modelo “one size fits all” para as interfaces propostas pelos modelos de aplicativos atuais, tipo ERPs, terá que ser repensado. Provavelmente o modelo de app store interna deverá ser o modelo que irá prevalecer na oferta de soluções para os usuários. (http://ow.ly/mDuP2)

Sem fronteiras, pero no mucho A Nuvem, essa linda, tem um lado não apenas sujo, mas também feio, ao violar os direitos das pessoas. Um exemplo é o paradoxo da localização ao usar um serviço na Nuvem. Conforme a rede vai conectando o mundo, os datacenters não são tão internacionais assim – e nem os negócios.


25

Afinal, a Nuvem obedece a qual lei? Em que é preciso se basear na hora de escolher um serviço de cloud computing para a sua empresa? E, sendo um usuário “da web”, e sendo a web “mundial”, por que alguns serviços de streaming não podem ser acessados em determinados países? Os usuários de Internet no Brasil vivem isso constantemente, com o Pandora, por exemplo. Comprar também é um mistério, por que, afinal, será que o gadget sonhado passará pela alfândega? O mesmo se aplica aos dados: a lei do país onde estão os datacenters vale para os dados. Não é à toa que ninguém sabe onde estão os servidores do Pirate Bay e de outros serviços de tor-

rent. E mais: em nome da segurança nacional, os governos também provam que podem, sim, invadir a privacidade não só de seus cidadãos, mas também dos cidadãos de outros países. Apavorou? Ótimo. Porque nem tudo é mansidão e maravilha no mundo da Nuvem. A gente ganha flexibilidade, extensão de poderes, arquivos sincronizados, sistemas que podem ser modulados de acordo com a necessidade. E precisa ter cuidado dobrado com os dados, a forma do tráfego, o gerenciamento de TI. Sejam bemvindos ao século XXI, ele promete uma enorme revolução na vida humana, mas está exigindo o sacrifício de nossas certezas e a inovação de um jeito nunca antes navegado. </>


26 > Por dentro da W3C

Garantindo a acessibilidade do seu website Por @reinaldoferraz

Escreva um código semântico Durante o processo de elaboração da arquitetura de informação e wireframes, identifique os elementos que têm significado em sua página (cabeçalhos, menus, rodapé, conteúdo principal etc.) e dê um significado a cada um deles. Cabeçalhos transformam-se em <H1>-<H6>, menus viram <nav> e <li>, conteúdos vão dentro de elementos <section> e <article>, rodapés viram <footer>, e assim por diante. É muito mais inteligível para a máquina identificar elementos com significado do que uma porção de <div> aninhadas.

Validando markUp Validação da sintaxe do seu código HTML pode identificar problemas primários em sua página, como elementos fechados incorretamente ou atributos que não fazem parte daquela tag específica. Faça a validação de HTML (http://validator.w3.org/) e CSS (http://jigsaw.w3.org/css-validator/) para ter certeza de que seu código está escrito corretamente segundo a especificação. É importante ressaltar que o validador automático vai identificar erros de sintaxe e não erros de semântica, como a falta de cabeçalhos ou rodapés das páginas. Por esse motivo, o passo anterior é fundamental.

Validação automática de acessibilidade Aqui vale um esclarecimento: validação de markup é diferente de validação de acessibilidade. Existem ferramentas que fazem verificação da sintaxe do HTML e do CSS e validação de acessibilidade com base nas diretrizes internacionais, as WCAG (Web Content Accessibility Guidelines). Normalmente, as ferramentas consideram erro de markup um problema de acessibilidade também, o que é uma

grande vantagem. Mas existem parâmetros específicos que os validadores de HTML não identificam. E é nesse momento que entra a validação automática de acessibilidade. O validador de HTML identifica, por exemplo, se uma imagem não tem o atributo alt, mas não consegue identificar se a estrutura de cabeçalhos de uma página foi feita de forma adequada com <h1>-<h6>, ou se o idioma da página foi declarado. Mesmo com certas limitações, os validadores são grandes auxiliadores na verificação de possíveis problemas de acessibilidade nas páginas e nos auxiliam a resolver de forma adequada e efetiva. Por isso mesmo, a validação automática é um fator importante na verificação da acessibilidade do código. A WAI, iniciativa de acessibilidade do W3C, disponibiliza em seu site uma lista de validadores que podem ser utilizados para testar suas páginas no link http://www.w3.org/WAI/RC/tools/complete. Outro ponto a se considerar é fazer a validação de acessibilidade sobre a ótica das diretrizes de acessibilidade WCAG 2.0 (http://www.w3.org/ TR/WCAG/). Muitos validadores ainda utilizam o WCAG 1.0 como referência, o que não é ruim. O problema é que o WCAG 1.0 é uma documentação de 1999, enquanto a versão 2.0 foi lançada em 2008. Isso significa que a forma como as duas documentações tratam determinados pontos como scripts ou elementos multimídia pode ter mudado e pode afetar a validação automática das páginas. Naquela mesma lista de validadores indicados no site do WAI, você pode encontrar validadores de acessibilidade para WCAG 2.0 (como o espanhol TAW http://www.tawdis.net/ e o português Access Monitor http://www.acessibilidade.gov.pt/ accessmonitor/). Você também pode incrementar a validação automática com ferramentas de validação de contraste e performance da sua página web. Mas o validador automático não é capaz de identificar certos pontos específicos de acessibilidade. Imagine uma página com uma foto do Cristo Redentor. Se o atributo alt não for declarado nessa


27

Verificar se um website está acessível vai muito além de colocar sua URL em um sistema de verificação automática de código. Validação de acessibilidade envolve uma relação muito próxima com o usuário, e os resultados são importantíssimos para o crescimento de uma web efetivamente para todos.

imagem, os validadores de acessibilidade acusarão o erro. Porém, ao adicionar qualquer valor dentro dele, como alt=” ” ou mesmo alt=”foto”, o validador considerará que o atributo foi preenchido e dará OK para esse ponto sem verificar se aquele texto representa ou não a imagem. O objetivo não é obter um “OK” de uma ferramenta automática, e sim garantir a acessibilidade das suas páginas. A maioria dos validadores exibe avisos sobre pontos que ainda não podem ser validados por uma máquina. Por esse motivo, é necessário fazer uma última etapa de validação de acessibilidade.

Validação manual Depois de passar por uma validação automática e identificar grande parte das barreiras de acessibilidade, é hora de passar pelo teste mais importante: verificar se seu website é acessível para pessoas. Sim, fazer verificações manuais é a melhor forma de identificar pequenos problemas na página - por exemplo, se o link para saltar conteúdo realmente salta para o ponto certo da página ou se as imagens ilustrativas têm sua descrição correta. Utilize os avisos (warnings) dados pelos validadores automáticos para identificar esses pontos e use as sugestões e as dicas que eles dão para correção dos erros. Vale a pena também instalar um software leitor de tela e navegar por atalhos de teclado, como pelos cabeçalhos de página (a maioria dos leitores de tela utiliza as teclas “H” ou os números de 1 a 6 para navegar por níveis de cabeçalhos). Existem softwares leitores de tela gratuitos ou com período limitado para testes, para os mais diversos sistemas operacionais. A navegação por teclado é valiosa para identificar possíveis barreiras que possam ser acessíveis somente utilizando o mouse. Validações manuais podem prevenir que a navegação da página via teclado tenha algum problema,

como identificar erros ao preencher um formulário ou comportamentos inesperados com scripts ou elementos multimídia em suas páginas.

Vantagens de considerar acessibilidade na web Promover boas práticas de acessibilidade na web beneficia o acesso de todas as pessoas. Em algum momento da nossa vida, podemos precisar de acessibilidade em nossas páginas e se não cuidarmos delas agora podemos ser barrados no futuro por problemas de acessibilidade em uma página que nós mesmos construímos. Quando consideramos essas técnicas em um projeto web, permitimos que pessoas com deficiência tenham cada vez mais autonomia na web. Essa autonomia é revertida em novos usuários e consumidores. Além de beneficiar o acesso de pessoas com deficiência, seu projeto web só tem a ganhar utilizando as técnicas descritas acima. Algumas delas são o carregamento melhor e mais rápido nos mais diversos dispositivos e a adição de elementos e informações que beneficiam SEO (Search engine optimization), entre muitos outros. </>

Reinaldo Ferraz é especialista em desenvolvimento web do W3C Brasil. Formado em Desenho e Computação Gráfica e pós graduado em Design de Hipermídia pela Universidade Anhembi Morumbi, em São Paulo. Trabalha há mais de 12 anos com desenvolvimento web. Coordenador do Prêmio Nacional de Acessibilidade na Web e do Grupo de Trabalho em Acessibilidade na Web e representante do W3C Brasil em plenárias técnicas do W3C.No Twitter é @reinaldoferraz


28 > Cultura Hacker

Mitch Altman e a origem dos hackerspaces Por @carineroos

Imagem: https://www.noisebridge.net/

Se pudesse resumir em uma frase o que de fato motiva o hacker e cofundador do Noisebridge (https://www.noisebridge.net/), hackerspace da cidade de São Francisco, seria incentivar pessoas a formar comunidades para fazer coisas que elas amam. E é exatamente isso que Mitch faz há muitos anos conhecendo hackerspaces pelo mundo todo, ensinando pessoas a fazerem coisas legais com eletrônica e promovendo oficinas de solda com os seus kits de hardware livre. Mitch Altman foi um dos pioneiros no trabalho com Realidade Virtual na VPL Research, também é conhecido por inventar o controle remoto universal, o TV B-Gone (http://tvbegone.com) um chaveiro que desliga qualquer TV em espaços públicos. A mensagem é simples: “You control when you see TV, rather than what you see”. Também é criador do “Brain Machine” (http://ow.ly/n8Jji), um dos projetos DIY mais populares da Make Magazine, além de presidente e CEO da empresa Cornfield Electronics.

Esse entusiasta da tecnologia esteve no Brasil, e a sua parada inicial, antes de palestrar no 14º Fórum Internacional de Software Livre (FISL), foi dar workshops de solda primeiramente no Mate Hackers (http://matehackers.org/), hackerspace de Porto Alegre, em 28 de junho, e posteriormente no Garoa Hacker Clube (https://garoa.net.br), hackerspace de São Paulo, em 30 de junho. Participei da sua oficina no Garoa, e foi um sucesso, com várias pessoas montando os seus kits e trocando ideias sobre eletrônica. Também pude conversar com ele sobre hackerspaces e as suas motivações. Para Mitch Altman, hackerspaces são espaços ímpares, não existe uma forma única de como esses espaços devem ser, e o que os caracteriza é serem espaços autênticos e anárquicos. Não há um centro de poder ditando o que você pode ou não fazer. Todos podem desenvolver projetos, compartilhar conhecimento e explorar os limites do que pode ser feito com qualquer tecnologia. Essa essência é


29

Foto de Nicohofmann/ Chaos Communication Camp 2011 Laser Show

o que o faz Mitch ajudar hackerspaces a crescerem e criarem as suas próprias raízes. A sua inspiração para fundar o Noisebridge, e como a de alguns outros hackers dos EUA, foi ter participado do Chaos Communication Camp (http://ow.ly/n8JCs) em 2007, na Alemanha, evento quadrienal organizado pelo Chaos Computer Club desde 1999, que reúne hackers do mundo todo acampados com acesso à Internet para discutirem assuntos técnicos e sociais como privacidade, liberdade de informação e segurança de dados. As palestras são feitas em hangares de um aeroporto desativado da ex-Alemanha soviética, no qual temporariamente hackerspaces se instalam de forma itinerante em um grande acampamento tecnológico. Pela primeira vez na vida, Mitch se sentiu à vontade para fazer parte de um grupo que compartilhava dos seus mesmos ideais e que queria aprender e trocar informações sobre tecnologia e afins. E foi

dessa experiência, resultante de uma caravana de entusiastas de tecnologia dos EUA que visitaram o Chaos Communication Camp e voltaram muito inspirados, que saíram os primeiros hackerspaces norte-americanos, como o Noisebridge, em San Francisco, o NYC Resistor, em Nova York, o Hacktory, na Filadélfia, e o HacDC, em Washington, DC. Durante os anos seguintes, estes serviram de inspiração para o surgimento de centenas de outros espaços similares, não só nos EUA, mas também em iniciativas como o Garoa Hacker Clube, no Brasil. Outro incentivo que fortaleceu esses espaços foi ter feito parte da rede hackerspaces.org - criada por Astera, uma integrante do hackerspace de Viena, na Áustria, o METALAB - um excelente repositório de informações do que dá e do que não dá certo em hackerspaces. Enquanto esses laboratórios comunitários estavam florescendo nos EUA, na Europa a cultura hacker já era forte desde a década de 80, com o pionei-


30 > Cultura Hacker

ro Chaos Computer Club. Ao contrário de muitos hackerspaces que apenas possuem o propósito de prover uma infraestrutura para que amantes da tecnologia desenvolvam os seus projetos de segurança, hardware, eletrônica, software e robótica, o Chaos Computer Club tem como objetivos principais a liberdade de acesso à informação, a liberdade de expressão, maior transparência no governo e acesso livre e universal à Internet. O CCC é mais conhecido por suas demonstrações públicas de vulnerabilidades de segurança. Em março de 2008, o CCC coletou e publicou as impressões digitais do ministro do interior alemão Wolfgang Schäuble. A revista do clube “Die Datenschleuder” (http://ow.ly/n8QL8) também incluía as impressões digitais em um filme que os leitores podiam usar para enganar leitores eletrônicos de impressões digitais. Isso foi feito em protesto ao uso de dados biométricos em dispositivos de identificação na Alemanha, como os passaportes eletrônicos. Um aspecto fundamental da cultura hacker e que permeia esses hackerspaces é a cultura de permissão, isto é, você não tem que pedir permissão para fazer as coisas, o mote é “faça primeiro e pergunte depois”. E é nesse ponto que surge a inovação dentro da cultura hacker: você faz algo porque você acha legal e considera um desafio, e a partir dessa ação resultam projetos interessantes. Por serem anarquistas por vocação, os fundadores do Noisebridge buscam ter o mínimo de regras possível. Sendo assim, o clube tem uma única conduta: “Be excellent to each other!”. Todas as decisões são feitas por consenso nas reuniões semanais, de modo a se evitar o que é conhecido como “a tirania da democracia”, em que em um grupo de 100 pessoas, 51 votam por algo que acaba desagradando as outras 49. Por meio da adoção do consenso, ninguém fica infeliz. Entretanto, a prática da decisão por consenso acaba sendo bastante conservadora, fazendo com que as coisas evoluam mais lentamente. Como forma de contrabalancear isso, é utilizado o conceito de doocracy (façocracia), no qual uma pessoa pode tomar a iniciativa de fazer algo por conta própria sem precisar alcançar consenso formal, desde que se tenha em mente a única regra de convívio: “Be excelent to each other!”. Hackerspaces podem ser vistos como uma ressignificação de espaços iniciais como o Tech Model Railroad Club (TMRC) do MIT, nas décadas de 50 e 60. O clube de ferromodelismo era composto de diversos grupos, alguns interessados em construir réplicas de trens históricos ou com algum tipo de valor sentimental, outros interessados em construir maquetes das paisagens onde andavam os ferromodelos, e outros que formavam o grupo conheci-

do como “Signals and Power Subcommittee”, que criava os circuitos eletrônicos que controlavam a operação dos trens. Foi entre os integrantes deste último grupo que se popularizaram diversos termos, entre eles, “hack”. Como exemplo do que pode ser considerado a essência do hacking (o entendimento tão profundo sobre o funcionamento de um sistema a ponto de conseguir utilizá-lo de uma maneira para a qual ele não foi originalmente projetado), conta-se a seguinte estória: Certa vez, os hackers do TMRC tinham em mãos um conjunto de trilhos muito grande que ocupava toda uma sala, e as centrais de comando de ferromodelo que eles possuíam na época não davam conta do tamanho da malha que eles tinham. Para resolver o problema, um dos membros do grupo achou uma central telefônica velha jogada no lixo e percebeu que essa central telefônica analógica, que apenas ligava e desligava circuitos, era exatamente o que era preciso para se comandar as máquinas de ferromodelo. Eles usaram essa central telefônica que foi projetada para funcionar como central telefônica, mas a adaptaram para comandar uma malha de ferromodelo que era do tamanho de uma sala, o que era um feito de incrível engenhosidade. Um verdadeiro “hack”, na gíria utilizada pelo grupo naquela época. Assim, podemos dizer que hackerspaces podem ser vistos como um retorno a esse espírito hacker de espaços iniciais como o TMRC e, mais tarde, o Homebrew Computer Club, na década de 70 no Vale do Silício. Muito do que é feito hoje em hackerspaces é genuinamente análogo a esses clubes, com a diferença de que hoje a tecnologia é mais sofisticada e há com certeza muito mais sucata eletrônica aguardando para ser explorada. </> “Este artigo é dedicado em memória ao Alberto Fabiano (Aleph Techberto), membro fundador do Garoa Hacker Clube, que ajudou a disseminar o conceito de hackerspaces no Brasil.”

Carine Roos é membro do Garoa Hacker Clube, entusiasta de tecnologia, especialista em mídias digitais e jornalista nas horas vagas.



32 > CMS

sem limites: desenvolvimento inusitado com a plataforma Por @leandrovieira

27 de maio de 2003 foi a data que marcou o nascimento da plataforma de gestão de conteúdo mais popular da atualidade – o WordPress tem, hoje, 18,9% de participação de mercado. São números expressivos e muito significativos que marcam esses dez anos de caminhada. A expressão é ainda maior ao se comparar dois de seus grandes concorrentes, Joomla! e Drupal, ambos com participação de mercado de 3,3% e 2,0%, respectivamente. (Dados coletados em 22/07/13, na W3Techs, em http://ow.ly/npZxx)


33

10 anos. 18,9% de participação de mercado. 58,7% de market share. Tantos números, inúmeras conquistas e ainda encontramos milhares de exemplos de uso do WordPress de forma limitada. Por quê? Por que não se pensa fora da caixa ao trabalhar com uma plataforma flexível, sem limites e com diversas facilidades para se criar, inovar e ousar com responsabilidade e segurança? Em junho de 2013 foi realizado o iMasters InterCon Dev +WordPress, uma edição do InterCon temática e focada na plataforma. Fui convidado para palestrar na abertura do evento e o assunto abordado foi o mesmo deste artigo. Dias antes, realizei um exercício à procura de indícios relacionados ao bloqueio e às limitação das mentes daqueles que desenvolvem para WordPress. A principal causa, segundo minhas próprias análises, foram os temas padrão que acompanham o pacote de instalação. Desde a versão 1.5 do WordPress, lançada em 2005, até a 2.9, lançada em 2009, o tema Kubrick o acompanhou e foi a inspiração - ou a falta dela - para muitas pessoas. O Kubrick foi lançado em setembro de 2006 e figurou entre os temas mais populares do WordPress com milhões de downloads. A criação foi do Diretor de Interfaces Michael Heilemann. Seu formato pouco arredondado, a coluna central e uma lateral à direita era comumente visto em vários sites baseados em WordPress. Essa referência largamente utilizada por mais de quatro anos despertou designs limitados e pouco criativos. É claro que tivemos boas exceções. Ainda bem. O lançamento da versão 3.0 foi um grande marco para a plataforma. Sua chegada, em junho de 2010, marcou a fusão de cores do WordPress e do WordPress MU e a iniciativa de ter um novo tema padrão por ano. O tema 2010 perdeu as bordas limitadoras, algo marcante no Kubrick, e assim começou a era de focar mais em recursos de CMS do que de blog. No entanto, a falta de ousadia inibiu inspirações que nos permitisse ir além. A mesma ideia se seguiu nos temas 2011 e 2012. Mas 2013 promete ser diferente.

O tema 2013 vem com uma proposta ousada em seu conjunto de cores, formatos e disposição. Vejo como um grande avanço e uma vontade de ir além inclusive com o tema padrão, afinal ele é o primeiro contato de muitos ao fazer uso do WordPress. É importante deixar claro que todos os temas padrão, desde o Kubrick, são excelentes referências de estudo em termos de código e exemplos de uso das funcionalidades oferecidas. Para mim, o melhor tema padrão que existe, e espero que a partir de agora você também o considere, é uma tela em branco. Sim, isso mesmo. Uma tela em branco. Já parou para pensar como os artistas iniciam suas criações? Sejam os digitais, com suas telas em branco no Photoshop, ou os que fazem uso das telas convencionais, a tela branca é comum entre eles e uma convite sem igual para ir além e pensar fora da caixa. Essa ideia de uma tela branca é muito empolgante se pensarmos que, através dela, podemos focar única e exclusivamente no projeto dos nossos clientes e não no tema padrão do WordPress. Isso permite focar na melhor experiência do usuário, ousar na criação e garante entregar os trabalhos de forma ousada e inovadora. Lembre-se, a partir de hoje uma tela branca será seu tema padrão WordPress. Para você ficar ainda mais confortável com essa idéia, vamos refletir sobre alguns pontos. A estrutura do WordPress trabalha para lhe entregar uma marcação HTML semântica e bem estruturada. A estilização dessa estrutura através do CSS fica por conta do artista, você. Da mesma forma para os comportamentos desejados através do JavaScript. Não há motivos para se limitar. Lembre-se do projeto CSS Zen Garden, no qual usávamos uma única marcação HTML e tínhamos liberdade de alterar o CSS e as imagens. O resultado foi a criação de sites incríveis e memoráveis. Ainda temos outros grandes e bons motivos para ir além. Faça uma análise, por exemplo, da API de hooks do WordPress: seus famosos ganchos, que nos permitem alterar praticamente tudo da plataforma sem mexer em uma única linha de código do seu core, evoluíram ao ponto de vermos uma curva crescente rela-


34 > CMS

cionada à quantidade que foram adicionados aos últimos releases. Perceba também que as novas versões já têm pouco espaço para novas adições, o sistema está praticamente todo mapeado. Em resumo, liberdade para agirmos onde precisarmos. A estrutura do banco de dados é simples, enxuta e muito flexível. Trabalhar com o conceito de dado e metadado relacionado é poderoso. Mas não se limite, há uma API para criar novas tabelas ao banco de dados do WordPress. E, mais uma vez, ir além. Já vemos casos de desenvolvimento de web apps baseados em WordPress, e um dos motivos é a grande facilidade de uso da plataforma e seu poder em dar liberdade aos desenvolvedores criarem sem limites. Outras três observações importantes dizem respeito às versões atualizadas do WordPress, do PHP e do MySQL nas instalações existentes da plataforma. Isso nos permite e dá segurança para fazermos uso das novidades e não ficarmos presos a um passado limitado e sem brilho. A versão 3.5 do WordPress, a última considerando a data de escrita deste artigo (julho/2013), é a mais utilizada, representando 39,1% de uso. A versão 5 do PHP está presente em todas as instalações, o uso da versão 4 é mínimo. Ufa! O mesmo cenário se repete em relação ao banco de dados MySQL. Você pode ver esses dados de forma visual aqui http://wordpress.org/about/stats/ WordPress sem limites. Considere o uso de uma tela branca a partir de agora e desenvolva de forma inusitada com essa plataforma. É possível ousar, inovar, ir além sem medo e com segurança. As oportunidades estão a sua frente e prontas para o uso. Lembrando, a partir de hoje a tela branca é seu tema padrão do WordPress e aguardo ansioso por novos casos de sucesso. </>

Leandro Vieira é uma das grandes referências de WordPress no Brasil. Sócio-fundador e Diretor de Tecnologia da Apiki WordPress, grande entusiasta e evangelista da plataforma. Adora compartilhar conhecimento através de seus cursos, palestras e bate-papos. leandro@apiki.com


+Interatividade > 35

O Gorila, o supercapacitor e a reinvenção dos bancos Por @pedrogravena

Existe uma experiência chamada Teste de Atenção Seletiva (quem não conhece dê uma olhada aqui: http://youtu.be/vJG698U2Mvo). Resumindo, é um teste para mostrar que, quando você está focado em algo, é capaz de não ver coisas que estão literalmente pulando na sua cara. No teste, seis pessoas ficam trocando passes com bolas de basquete, e seu objetivo é contar quantos passes são feitos em 30 segundos de vídeo. Enquanto você está entretido em contar os passes, não é capaz de ver um Gorila que entra em cena. Bom, já tirei toda a graça do teste, mas faça assim mesmo para ter uma noção da experiência. O fato é que existem mais Gorilas por aí do que imaginamos. Todas as profissões têm Gorilas, e basicamente todos os grandes inovadores são pessoas capazes de ver esses Gorilas antes de alguém contar que ele está lá. Um pequeno, mas bem significativo exemplo: pensem em quanto milhares de dólares são gastos por ano para se obter baterias mais duráveis, mais “verdes”, menores e mais flexíveis. Há indústrias gigantescas buscando isso - Motorola/Google, Apple, Samsung, e muitas outras. Até aí, tudo bem, nenhuma novidade, mas nesse mundo de tentativas, erros e acertos, surgiu algo realmente novo há poucos meses: uma menina indiana de 18 anos inventou uma maneira de recarregar a bateria em somente 20 segundos, usando um supercapacitor. Não viu nada sobre isso? Corre aqui http://ow.ly/mU5KX Aí você deve estar se perguntando: mas como? E por que nenhuma dessas grandes empresas pensou nisso antes? Bom, pra saber como, leia alguma das milhares de matérias sobre o assunto: http://migre.me/f9Ugh E pra saber por quê, lembre-se do Gorila. Estavam todos olhando para o mesmo lado, ninguém pensando em como recarregar mais rápido, todos pensando em como fazer durar mais.

Essa menina de 18 anos acabou de mudar o mundo um pouquinho. Ela viabilizou a existência e a melhoria do carros elétricos, por exemplo, entre muitas outras coisas. Lembra-me um pouco a história de um carinha que em 1905 trabalhava num escritório de patentes e, um dia, indo para o trabalho, olhou para a torre do relógio da cidade de Berna e mudou pra sempre o mundo, com a Teoria da Relatividade. Exageros à parte, tanto Einstein quanto a menina de 18 anos viram o Gorila antes dos outros, foi só isso. Temos que treinar nosso cérebro para ver Gorilas. Nesses anos, eu acho que descobri uma maneira de fazer isso: conversar. Quanto mais conversas se tem sobre o que vem por aí, mais se começa a pensar sobre isso e a achar os Gorilas. Então, fica aqui uma proposta: foca no Gorila! :)

Bancos Quanto tempo você acha que a instituição Banco vai continuar do jeito que está? Qual o futuro do dinheiro? Moeda social? BitCoins? Aqui há algumas propostas de Gorilas para o futuro dos bancos: •• GoBAnk - http://youtu.be/GMV0u96XSQc •• Bank Simple - https://simple.com/ •• Google Wallet send Money With Gmail: http:// www.google.com/wallet/send-money/ </>

Pedro Gravena é Diretor de Criação Digital da Wieden+Kennedy São Paulo, já foi arquiteto, músico, artísta plástico, e está estudando para ser um inventor frustrado. Conheça mais em @pedrogravena e pedrogravena.posterous.com


36 > Front-End

<Front-End Ops> introdução a uma nova disciplina Por @danielfilho

Quando se fala de Front-End, existe uma assimilação direta com três disciplinas, por assim dizer: HTML, CSS e JavaScript. Em uma visão bem pessoal, acredito que Front-End diz respeito a tudo que venha para a camada de renderização e tudo que envolva o conteúdo a ser apresentado, que além dos itens citados também inclui arquitetura de informação e design da página ou web app. Com o amadurecimento da área, é importante que cada vez mais o profissional da disciplina de Front-End tenha domínio de mais e mais técnicas e processos, para ter algum diferencial entre os concorrentes do mercado. Ei, você quer ser o melhor, certo? Então saia da zona de conforto! A disseminação do JavaScript em outros meios além da linguagem de script que todos estão acostumados - como NodeJS para servidores, utilização de JavaScript na programação de hardware (Node Copter, Johnny-Five e outros) - vem aproximando cada vez mais os mundos que, antes, eram relativamente distantes. Como consequência, novas disciplinas ou ramificações acabam surgindo naturalmente. Uma destas disciplinas que tenho dedicado algum tempo nos estudos é a chamada “*Front-End Ops*”, termo que vi pela primeira vez (mas já é praticada bem antes disso) em um artigo escrito por Alex Sexton para o site Smashing Magazine. Este artigo tem o mesmo nome.

Ops O termo Ops (no nosso caso) vem de Web Operations - em português, Operações Web. Segundo o verbete em inglês na Wikipedia (http://ow.ly/ nmGi4), significa “domínio de conhecimentos dentro da gestão de sistemas de Tecnologia da Informação, que envolve a implantação, operação, manutenção, ajustes e reparos de uma aplicação e/ou sistema baseado na web”.

Colocando isso no nosso cotidiano, sempre que você precisa de um acesso especial a um servidor, ou que algum caminho seja mapeado, um servidor seja configurado, ou aquela frase famosa de “reinicializar a aplicação”, é um profissional de operações que executa. Recentemente temos visto a ascenção do termo DevOps que, resumidamente, é o desenvolvedor que estreita o conhecimento de técnicas de operações, conhecendo além de linguagens de programação, também ambientes de operações.

Front-End Ops Desenvolvedores Front-End também são desenvolvedores, mas existe uma distância natural - e não imposta - desse mundo de operações. E o nosso objetivo aqui é fazer uma série de artigos com a vontade de estreitar mais estes dois mundos. Já existem ferramentas e processos que trazem o mundo de Operações Web pra perto do desenvolvedorFront-End. Dentre todas que existem, as que mais utilizo são Vagrant, GruntJS e Capistrano.

Vagrant Imagine a seguinte situação: você trabalha com vários projetos, desenvolvidos em diversas tecnologias diferentes. Um em NodeJS, outro em Ruby e outro em Python. Você tem duas opções para rodar seus projetos em ambiente de desenvolvimento (dev): 1. Instalar e configurar em sua máquina todos os ambientes necessários para desenvolvimento. 2. Instalar e configurar máquinas virtuais, com todos os ambientes necessários para o desenvolvimento.


37

O que o Vagrant faz é te ajudar na segunda opção. Configurar, distribuir e integrar máquinas virtuais em seu ambiente de desenvolvimento.

Rollback, em tecnologia de informação, significa voltar para a última versão funcional do código ou sistema (ou, voltar para uma versão específica).

GruntJS

Você configura sistema de versionamento, branches, diretórios, opções de ssh, endereço dos servidores, tarefas que o Capistrano deve executar antes e/ou depois de enviar os arquivos e muitas outras opções, com um simples comando:

Agora, pense que você quer ter no ambiente de desenvolvimento, seus scripts concatenados, mas não minificados. E em produção, você quer que eles sejam concatenados e minificados. Além disso, você precisa compilar seu CSS, porque usou SASS, precisa organizar as pastas e arquivos de maneiras diferentes para cada ambiente e, sempre que salvar algum arquivo JavaScript ou CSS, precisa fazer todo esse processo novamente pra testar. Cansa só de pensar! Mas o GruntJS está aí pra facilitar (quanta rima!). Fácil como listar os diretórios da sua máquina, basta rodar um comando para gerar a versão de desenvolvimento, outro para gerar uma versão pra produção, assim: $ grunt dev

Ou: $ grunt prod

Além disso, você também pode criar tarefas para ações específicas e únicas, como apenas rodar testes unitários utilizando sua ferramenta favorita, apagar pastas específicas e muito mais. Mas e agora que os arquivos foram gerados, como entregar em ambiente de produção?

Capistrano E depois que gerou sua versão para produção, você precisa fazer o deploy, certo? Certo. E como você faria isso? FTP? rsync? scp? WebDAV? Com o Capistrano você pode, com apenas um comando, gerar sua versão de produção com o GruntJS e entregar todos os arquivos, com um sistema de versionamento em produção inteligente e, se por acaso subir algo errado no ar, pode fazer rollback do deploy em questão de segundos. Isso mesmo, SEGUNDOS.

$ cap deploy

E se algo der errado, voltar apenas com um: $ cap deploy:rollback

O processo de rollback não precisa ser tortuoso como costumávamos fazer: duplicar uma pasta ou arquivo, alterar seu nome com um timestamp ou “_” no início, copiar todos os arquivos novos e, caso algo saia errado, remover e renomear tudo de novo. O Capistrano faz este processo de maneira muito mais inteligente. Agora que você já sabe do que se trata o termo OPS e, mais especificamente, Front-End Ops, você está preparado para seguir com esta série sobre o assunto. Nas próximas edições da Revista iMasters vamos nos aprofundar em cada uma das ferramentas que foram citadas, e você será capaz de servir, gerar e entregar sua aplicação web de maneira ágil e profissional. Saiba mais: •• Node Copter - http://nodecopter.com/ •• Johnny-Five - http://bit.ly/Hv09E8 •• Vagrant - http://www.vagrantup.com/ •• GruntJS - http://gruntjs.com/ •• Capistrano - http://www.capistranorb.com/ •• SASS - http://sass-lang.com/

Daniel Filho é especialista em desenvolvimento Front-End no iG e criador e co-apresentador do podcast Zone Of Front-Enders. daniel.filho+imasters@gmail.com


38 > Design

Use design para melhorar seu código Por @pedrozath

Existem muitos tipos de design, como o de produto, o de interiores ou ainda o de interfaces, mas se existe uma característica que muitos deles têm em comum é a tentativa de tornar a vida do usuário mais fácil. Falar de Design do Código no sentido do aprimoramento visual de um código de programação ou de marcação pode soar tanto como loucura, como a vulgaridade de alguém que aprecia esteticamente algo que deveria ser puramente funcional. Todavia, programar infelizmente ainda é uma skill para poucos, mas ainda assim, há de se pensar no conforto que um ser humano virá a ter ao ler determinado código, pois a atividade de desenvolvimento se torna cada vez mais social, por assim dizer, o que significa que aquilo de alguma forma terá de ser entendido por outros.

Nesse aspecto, o design gráfico tem muito a auxiliar, no sentido de tornar o código fonte limpo e fácil de se entender, elevando a compreensão e acabando assim por melhorar a funcionalidade. Algo aparentemente paradoxal, pois como poderia algo estético levar a uma melhoria de funcionalidade? Bem, responder a esta questão renderia um outro texto. Aos curiosos, sugiro que leiam O Design Emocional, de Donald Norman. E aos que se interessaram pelo conceito, explico melhor neste artigo.

Design do Código nas Linguagens de Programação Trabalhar de certas formas facilita a produção de um código claro e de fácil manutenção. Desde que não se encare como religião, é sempre bacana buscar estes approaches. Estes não vem diretamente do design, mas convém serem citados:

Variáveis claras

Procure usar variáveis claras e não abreviadas. Já se foi o tempo do MinhaStr_decontrole2 em vez de algo mais legível e humano, como minha_string_de_controle.

Não se repita (Don’t repeat yourself)

Prática já conhecida pela sigla DRY, significa evitar o máximo possível a repetição de código, o que muitas vezes pode ser dificultoso, pois geralmente envolve maior conhecimento da língua na qual se está programando, além de técnicas (que podem ser cada vez mais aprimoradas).

Arquivos grandes são distrativos

Claro, todo desenvolvedor já teve aquele projeto super complexo, de prazo curto, que acabou culminando naqueles códigos de 3 mil linhas num único arquivo. E, certamente, nesses momentos, acaba-se dependendo fortemente do recurso de busca por palavra do editor que se usa. Toda linguagem que se preza tem alguma forma de se incluir arquivos externos (require, include). Faça uso, usando de seu bom senso.

Design do Código nas Linguagens de Marcação

Neste terreno, o design brilha de verdade. Há muito a ser melhorado e facilitado nestas linguagens. Mas para tanto, se torna necessária a adição de uma nova camada de processo entre o usuário e


39

o código final em si, ora referida por renderização, ora por compilação. Enquanto muitos desenvolvedores advogam contra esta nova camada, eu particularmente acredito que, ainda que com esse custo (seja da implementação do processo ou de servidor), os benefícios são enormes. O único desafio real deste novo aspecto que emerge dentro do desenvolvimento de front-end é o treinamento dos profissionais envolvidos no projeto, pois estas novas linguagens, apesar de infinitamente mais simples, são desconhecidas em sua maioria.

HTML <!DOCTYPE html> <html> <head> <title>Meu site em HTML5</title> </head> <body> <h1>Bem vindo ao meu site</h1> </body> </html>

O HTML possui uma redundância inerente pela obrigatoriedade de se repetir quase todas as tags duas vezes. É curioso, pois seu ancestral, o GML, criado por três funcionários da IBM nos anos 60 não possuia esta mesma característica. Além disso, apesar de ser uma boa prática a indentação consistente de suas tags, esta frequentemente acaba sendo largada de mão por grande parte dos desenvolvedores. Nesse sentido, o HAML (Haiku Markup Language) surge:

%html

%head

%title Meu site em HTML5

O conteúdo de texto das tags pode ser descrito tanto na mesma linha, quanto embaixo, porém nunca misturando ambos. Mas por que não remover a porcentagem (%) antes das tags? Pensando nisso, foi criado o Slim, que segue os mesmos preceitos do HAML: doctype html html head title Meu em HTML5 body h1 | Bem vindo ao meu site

Como pode ver, o Slim considera a primeira palavra de cada linha sendo uma tag a menos que comece com um pipe (|). Além disso, ele dá a possibilidade de se usar livremente tags de HTML puro e flexibilidade na quantidade de caracteres de indentação. Ou seja, se você é um cara esquisito e gosta de indentar com dois espaços em vez de um tab, como seres humanos normais e saudáveis, sinta-se à vontade (e perdoe a minha completa arrogância)! Ok, mas se tratando de textos em si, considere que tenhamos algo como o texto abaixo:

Título: Pangramas 1. Zebras caolhas de Java querem mandar fax para moça gigante de New York.

!!!

por sua vez acaba-se internalizando como regra no desenvolvimento do aplicativo. Note que a quantidade de linhas cai quase que pela metade.

%body

%h1

Bem vindo ao meu site

As três exclamações iniciais simbolizam o doctype, que será configurado separadamente no sistema. Já as tags, todas obrigatoriamente devem começar com %. Note que elas não precisam ser fechadas, pois o sistema considera a identação como algo estrito nesse caso, interrompendo a renderização do documento caso a indentação esteja inconsistente. Isso pode, na teoria, parecer um defeito, mas na verdade é uma das maiores vantagens, já que assim torna-se obrigatório respeitar a indentação, o

2. Mas o juiz faz com que whisky de malte baixe logo preço de venda. Em HTML, seria algo como: <h1>Título: Pangramas</h1> <ol> <li>Zebras <strong>caolhas</strong> de Java querem mandar fax para moça gigante de<em>New York</em>.</li> <li>Mas o <em>juiz</em> faz com que <em>whisky</em> de malte baixe logo preço de venda</li> </ol>


40 > Design

Essa intrusão das tags de HTML no meio texto o tornam chato e desumano de ler. Para tal, foi criado o Markdown: # Título: Pangramas 1. **Zebras caolhas** de Java querem mandar fax para moça gigante de *New York*. 2. Mas o **juiz** faz com que *whisky* de malte baixe logo preço de venda.

Baseado na formatação de emails de texto plano, o Markdown interpreta # como título (## seria h2, ### seria h3 e assim sucessivamente), palavras entre * ou _ como ênfase e entre ** ou __ como strong (itálico e negrito, respectivamente, de acordo com o senso comum da web). Essa sintaxe pode ser misturada com as previamente citadas, tornando assim o HTML algo muito mais compreensível e até mesmo editável por leigos. Existem outras linguagens que estenderam mais ainda o Markdown, adicionando, por exemplo, tabelas: C1 | C2 | C3 |--|--|--| C4 | C5 | C6 |

Existe também o Wiki Markup, que não entrarei em detalhes, mas como o nome diz, é usado primariamente em Wikis.

CSS Reflita sobre o código à seguir: article { color: #02a420; font: 16px/1.4 Helvetica; } article a { color: #02a420; } article a:hover { color: #ff8855; } article a.button { background-color: #02a420; background-image: -webkitgradient(linear, left top, left

bottom, color-stop(0%,#02a420), color-stop(100%, #ff4422)); background-image: -webkit-lineargradient(#02a420, #ff4422); background-image: lineargradient(#02a420, #ff4422); } /* Para dispositivos mobile */ @media (min-width: 767px) { article { color: #02a420; font: 12px/1.4 Helvetica; } }

Um tanto quanto cansativo de ser lido e entendido, certo? É de fazer qualquer um pensar duas vezes antes de abandonar os editores WYSIWYG (What You See Is What You Get - editores visuais). Não é por menos, o código é altamente distrativo, redundante e cheio de minúcias feitas para serem lidas por um computador. Bom, mas como podemos melhorá-lo? Para começar, se pudesse aninhar os seletores, como numa linguagem de programação onde por exemplo um if pode conter outros ifs subsequentes. Nesse conceito, entra o SASS (Syntactically Awesome Stylesheets), introduzindo também os mixins que são basicamente funções que tornam o código altamente DRY. Estes por sua vez, deram a chance para que outros desenvolvedores criassem bibliotecas de mixins, nas quais você pode simplesmente dar um include no começo do CSS. Por fim, o SASS possibilita o uso de variáveis ainda agregando operações matemáticas. É possível até mesmo somar cores ou torná-las mais claras ou ainda transparentes com o uso de funções específicas. Com tudo isso, nosso código CSS poderia ficar assim: // importando a biblioteca bourbon @import “bourbon” // nossa paleta de cores $preto: #02a420; $vermelho: #ff4422; // mixin que gera a media query =mobile { @media (min-width: 767px) { @content } } article { color: $preto;


41

font: 16px/1.4 Helvetica; a { color: $preto; &:hover { color: lighten($vermelho, 20%); &.button { // função incluída pelo bourbon, gera os prefixos de navegador +background-image(lineargradient($preto, %vermelho)); } } +mobile { color: $preto; font: 12px/1.4 Helvetica; } }

Note que, com isso, foi possível introduzir a media query dentro do seletor em vez de fora, o que facilita enormemente a criação de sites responsivos. Ao ser compilado, o CSS terá a media query colocada no final do documento, completamente nos padrões da W3C. Agora vamos reduzir o nível de distração: // importando a biblioteca bourbon @import “bourbon” // nossa paleta de cores $preto: #02a420 $vermelho: #ff4422 // declarando a media query =mobile @media (min-width: 767px) @content article color: $preto font: 16px/1.4 Helvetica a color: $preto &:hover color: lighten($vermelho, 20%) // a função lighten() gera um vermelho mais claro &.button +background-image(lineargradient($preto,

%vermelho)) +mobile color: $preto font: 12px/1.4 Helvetica

Essa seria a sintaxe pura do SASS, que se baseia inteiramente na indentação, assim como HAML e o Slim, previamente citados. Muitos desenvolvedores utilizam o SASS, mas na sintaxe SCSS, que é a que ainda preserva as chaves e os pontos-e-vírgulas. Outros são mais radicais e usam o Stylus, que possui mais flexibilidade ainda, como por exemplo mixins transparentes, ou seja, que não possui nenhum tipo de caractere inicial, fazendo-se passar por atributos de CSS completamente normais.

Conclusões gerais Outra vantagem de se usar esses template handlers - uma camada na sua aplicação que vai traduzir o código de uma linguagem pra outra que o navegador consiga ler - é o fato de que em muitos casos eles emitirão erros que vão lhe impedir de gerar código-fonte inválido. Além disso, dependendo do seu setup, eles podem encodar caracteres em UTF-8, gerar compressão automática de todo código, inclusive de um mesmo arquivo se necessário, reduzindo o número de requisições e o tempo do download. </>

Pedro Maciel trabalha com web design, motion graphic design, desenvolve em Ruby on Rails e escreve sobre tudo isso no impulso.hiperativo.co pedro.maciel@hiperativo.co


42 > Gerência de TI

Qual é a capacidade do seu time de tecnologia? Por @AlexTatiyants

Você sabe qual é a capacidade do seu time de tecnologia? Como você determina as capacidades dele? Em que você presta atenção? Quando me fizeram essas perguntas recentemente, minha primeira resposta foi “o teste do Joel, claro!”. Afinal, ele é curto, fácil de entender e vai rapidamente ao X da questão: pode o seu time entregar um produto confiável? Bem, o teste do Joel já tem 12 anos. Apesar de os princípios por trás das perguntas continuarem relevantes, alguns pontos específicos já evoluíram. O patamar em que um time de tecnologia deve operar subiu, assim como subiu o nível do que seria o patamar ideal. Então, para responder como determinar a capacidade de um time de tecnologia hoje, eu escrevi alguns pensamentos.


43

Então você diz que pode entregar? Um time de tecnologia é tão bom quanto sua capacidade de, progressivamente, entregar um produto. No que isso leva? Primeiro, vamos falar sobre programação de software. A forma mais rápida de entender as qualidades do seu time é provavelmente olhando para as práticas dele. Há, é claro, o básico: •• Todas as peças do código estão (inclusive a base de dados e o código de infraestrutura) fazendo uso de algum controle de versão? •• Eles escrevem testes de integração/unitários/funcionais para o código? •• Os deploys e builds estão totalmente automatizados? •• Eles praticam integração contínua? •• Todo o código do produto está sendo revisado, tanto via pareamento quanto por uma revisão formal do código? Uma vez que o básico estiver sendo feito, a próxima coisa a se considerar é o quanto os processos de desenvolvimento podem estar restringindo o trabalho do time. Em outra palavras, há algum passo do processo de build/entrega que auxilia o time a se manter “na linha” e ajuda a manter a base de código limpa? Algumas questões para serem feitas: •• Eles estão medindo a cobertura do código¹? Ele é medido em todas as camadas, incluindo frontend, middleware e base de dados? Eles estão parando os builds se a medida cair abaixo de um certo percentual? •• Eles estão realizando análise de código em todas as checagens? Quais implicações existem para os builds se surgir alguma questão? (ex.: o build para se sur-

girem alertas do compilador, se o estilo do código for violado, se a complexidade de uma função exceder certos níveis, etc). •• Eles estão realizando testes de desempenho/carga/estresse como parte do fluxo de desenvolvimento? E quanto a testes de invasão? Mas, espere, ainda há mais. Note que qualifiquei “habilidade de entregar” com “progressivamente”. Isso foi intencional porque o time deve manter o custo das mudanças baixo e constante. Em outras palavras, desenvolver rapidamente às custas de uma perda do lado técnico, sem se preocupar jamais com ele, não costuma ser uma estratégia muito sustentável. Para isso, você deve procurar pela cultura de desenvolvimento e por sinais de bom direcionamento da base de código. •• Com qual frequência é feito “refactoring”? •• Há uma comissão de resolução de problemas técnicos prioritários e mais visíveis? •• O processo de desenvolvimento permite explicitamente que haja tempo para lidar com problemas técnicos? No que diz respeito à cultura desse time, pode haver alguns defeitos: •• Os defeitos estão sendo priorizados apropriadamente (ex.: dando tanta importância para a correção de bugs quanto para os novos recursos)? •• Há uma análise formal das prováveis causas (5 porquês) que é realizada para cada defeito encontrado? •• Há um sistema automatizado de monitoramento de defeitos que alerta o time proativamente? E, finalmente, precisamos considerar como o software está sendo de fato entregue aos clientes.


44 > Gerência de TI

•• O time está praticando a entrega contínuo? E deployment contínuo? •• Cada feedback negativo ou positivo está sendo registrado? •• Há monitoramento automático? Como é o processo de escalonamento? •• Há um sistema para remediar problemas (tal qual rebalanceamento de servidores, rollbacks automatizados etc.) em uso? Por favor, perceba que as perguntas acima não são exaustivas. Tenho certeza absoluta de que há outras coisas muito importantes para se prestar atenção. Na verdade, se você tiver outras ideias eu adoraria ouvi-las.

Referências •• The Joel Test: 12 Steps to Better Code (http://bit.ly/9JWklR); •• Continuous deployment in 5 easy steps (http://oreil.ly/13EPgd); •• Continuous Improvement - GroupOn, Palo Alto 2013 (http://slidesha.re/ TZCyAW) </> ¹ Nota de tradução: code coverage é a medida de quanto do código é submetido a testes.

Artigo traduzido pela Redação iMasters, com autorização do autor. Publicado originalmente em http://bit.ly/1b9GJk8

Alta tecnologia Ser capaz de entregar um grande produto é crucial para qualquer time de tecnologia. De qualquer maneira, para alguns, isso talvez não seja o suficiente. Dependendo da área de negócios em que você estiver, talvez seja necessário um conhecimento mais aprofundado em uma área em particular, o que eu chamaria de “alta tecnologia”. Com “alta tecnologia” eu quero dizer o tipo de habilidade que não é encontrada normalmente “no jardim” dos desenvolvedores da sua empresa (mesmo entre os grandes). Isso inclui especialistas em semântica, aprendizado de máquina, NLP (programação neuro-linguística, na sigla em inglês), processamento de sinais, e assim por diante. Alguns ainda acrescentariam as habilidades necessárias para otimização de desempenho ou escalonabilidade extrema no mesmo caldeirão. Novamente, não é qualquer time que precisa de tais especializações, mas alguns necessitam. E, para esses times, essas capacidades adicionais certamente precisam de um destaque.

Alex Tatiyants gosta de escrever coisas engraças sobre tecnologia. É criador do JS.js e do movimento MoreSQL, além de inventor do Guilt Driven Development.



46 > Comunidades

Interação a favor dos negócios: IxDA-SP Por @lufreitas para Revista iMasters

Imagem: http://www.sketchinginteractions.com/

Quem trabalha com desenvolvimento sabe: a experiência é fundamental para a qualidade de vida das pessoas. A partir dessa premissa, nasceu, em 2004, o IxDA (Interaction Design Association - http://ixda.org), uma organização baseada no voluntariado e na coesão da comunidade. A organização foi fundada por quatro profissionais que trabalhavam com design e interatividade e não se sentiam atendidos pelas comunidades e organizações de Arquitetura da Informação ou Usabilidade. Eles não cobram por associação, mas pedem contribuições de cada indivíduo com aquilo que lhes é mais precioso: tempo e conhecimento. Há mais de dez mil membros e cerca de setenta grupos em todo o mundo.


47

2008 – 2009, os anos de ouro “A gente começou em 2008, com o primeiro Congresso, sem nenhum patrocínio”, diz Amyris Fernandez, que foi Presidente do IxDA-SP entre 2009/2012 e é membro honorário do Board do IxDA International. O Congresso foi bom, segundo Amyris, porque lá fora eles não conseguiam ver a realidade de outros países e perceber que não são o centro do universo. A questão é que os estrangeiros não reconheciam o Brasil como um lugar para negócios. Depois do Congresso, em que viram, entre outras coisas, interações vestíveis, o mundo reconheceu que havia horizonte profissional além de Estados Unidos e Europa. O sucesso foi tanto que americanos e ingleses se mudaram para o Brasil, entusiasmados com as oportunidades de trabalho e desenvolvimento. Segundo Amyris, “eles vieram trabalhar para empresas brasileiras ou montar seus negócios por aqui”. Resultado: a comunidade de design de interação aumentou um pouco mais. Os encontros continuaram, depois dessa fundação bem sucedida, no Museu da Imagem e do Som, em São Paulo, com reuniões mensais. A cada encontro, um tema específico e cerca de trinta profissionais. Entre 2010 e 2012, o movimento paulista minguou. Segundo Amyris, os outros grupos brasileiros continuaram ativos. Em 2013, o IxDA SP está se reativando para participar do ISA (Interaction South America), o Congresso Sul Americano da área (http://isa.ixda.org/2013/). As inscrições para participação e trabalhos estão abertas, e a programação promete atender tanto a quem estuda como a profissionais formados em busca de aperfeiçoamento.

Uma comunidade em renovação constante Aqui no Brasil, a comunidade de São Paulo, segundo Amyris Fernandez, reúne cerca de duzentas pessoas. “Os voluntários ativos se alternam, um grupo trabalha muito, outro assume, e assim vamos”, conta. Agora, os planos são investir fortemente na produção de trabalhos acadêmicos. “Funcionou muito bem no último congresso (2012), em Belo Horizon-

te, apresentar trabalhos que dão suporte teórico à nossa prática”, conta Amyris. Mas, afinal, o que faz um designer de interação? “Vamos além da arquitetura de informação e da questão de usabilidade, que estão fortemente centradas na questão da interface entre humanos e computador”, explica a profissional. A ideia é pensar em como o negócio funciona, sempre atento aos resultados práticos. Amyris tem uma definição interessante da função: “trabalhamos para aumentar o bônus de toda a empresa”, diz. São bem-vindos à roda de produtores de conteúdo a desenvolvedores, além de designers, criadores e profissionais de marketing. Para se associar, basta entrar na plataforma do IxDA (a mesma para todos os grupos): http://ixda.org. Com um cadastro, o profissional passa a participar da lista e pode começar a contribuir para a comunidade como puder: trabalhos acadêmicos, voluntariado, organização de encontros. No IxDA-SP, o foco é a divulgação da prática, educação do mercado, educação acadêmica de indivíduos e de criar uma relação saudável com os profissionais, independentemente de formação e cargo. O desafio, hoje e sempre, é criar parâmetros para o surgimento de uma nova disciplina, o design de interação. Os profissionais pensam desde resultados de produtos digitais, como em interfaces vestíveis (olá, Google Glass), e outras novidades. “É importante publicar trabalhos em congressos para criar esse corpo de conhecimento do interaction design, uma área mais ampla que a questão da interação entre humano e computador”, explica Amyris. A profissional foi responsável pela coordenação da produção da nova plataforma do IxDA, com um time de 26 países reunido para a empreitada. Este é o espírito da comunidade: voluntariado, trabalho conjunto, construção de conhecimento. A manutenção é garantida pelo congresso internacional de design de interação, que dá lucro. Aqui no Brasil, os congressos não dão lucro, mas servem para estimular a profissão. </>


48 > Marketing Digital

TI na propulsão do marketing Por @cgalls

Análise, velocidade, produtividade e controle “extremos” são as novas competências exigidas do profissional de marketing.


49

Desde o tempo de faculdade, sempre que surgia o assunto entre familiares e amigos, gastava saliva e verbo para explicar o que era o marketing. No senso geral, o marketing acabava reduzido a um de seus mais famosos e aclamados “Ps”, o da comunicação (“promotion”). Isso sempre me deixou intrigado, até perceber que, entre os próprios autointitulados profissionais de marketing, as tarefas cotidianas acabavam resvalando mais para o ato de comunicar. Essa era de marketing como publicidade atrofiou diversos cérebros que temiam “fazer contas” e dedicavam-se à inspiração de criar textos e administrar campanhas de agências. No entanto, para o bem geral do marketing, entra agora sob os holofotes o profissional apoiado no lado esquerdo do cérebro: o cientista, o analítico, o gestor e de processos. E quem está potencializando esse surgimento é a TI.

O marketing em sua essência A inovação tecnológica tem nos permitido aproximar a operação de marketing do seu conceito original. Com o passar do tempo, a essência, cujo objetivo é detectar e atender a demandas que gerem satisfação por meio de algum tipo de troca, não mudou. Mas, ao longo dos anos, considerando a massificação, nos distanciamos da forma ideal de fazer negócios. Por um período, tornou-se inviável atender e entender clientes de forma personalizada. No entanto, com os novos ciclos tecnológicos, ensaiamos uma reaproximação com a possibilidade de conhecer o perfil dos clientes tão profundamente quanto jamais imaginaríamos. E, com isso, conseguir estabelecer diálogos que nos remetem à ideia original do relacionamento ideal para atender a necessidades. A essência do marketing pode ser representada pelos negócios de bairro, nos quais o negociante conhecia detalhadamente a clientela, sua história e seus hábitos. Isso permitia a criação de uma relação inspiradora entre cliente e comerciante. No entanto, os processos de produção em escala adiantaram-se à capacidade de comunicação. O foco voltou-se para a grande massa. O que antes era uma comunicação um-

-para-um, passou para um-para-muitos. Surge a era da publicidade e comunicação de massa de que falamos no início. O marketing, no afã de um equilíbrio, buscou evoluir os conceitos de CRM, segmentação, marketing one-to-one, entre outros – mas sempre com limitantes de aplicação prática. Faltava a última milha, a obtenção precisa de dados e a capacidade de comunicação personalizada. O que faltava, de fato, eram ferramentas tecnológicas para trabalhar a informação.

A TI e suas soluções maravilhosas Tímida, a TI surge sob os olhos atentos do diretor financeiro, a quem se reportava inicialmente por ser algo novo, de custos elevados e sem um valor comprovado. No entanto, rapidamente ocupou seu espaço e tornou-se estratégica, automatizando processos e criando infinitas opções. E agora, a cada nova solução, um novo mundo de possibilidades se revela frente aos olhos dos profissionais de marketing. Temos à nossa disposição tecnologias e conceitos emergentes como o Big Data, o cloud computing, as redes sociais, a automação de marketing, crowdsourcing e tantas outras. A TI aplicada a antigos conceitos de relações humanas criou as redes sociais. Com isso, mudou-se a forma de como acessar a informação, partilhar e engajar. As empresas e suas equipes de comunicação, até então, não estavam preparadas para conversar com o mercado na velocidade e profundidade que temos agora. A comunicação era um grande megafone sem sistemas de retorno. Essas interações, às quais as empresas estão buscando se adaptar, muitas vezes são espontâneas e surgem fora dos limites da companhia. As respostas devem ser rápidas e, muitas vezes, imediatas, a fim de evitar que crises se alastrem e saiam do controle. Demanda-se velocidade. A análise de dados não é novidade para o marketing, mas em sua grande maioria, sobretudo no Brasil das médias empresas, sempre esteve em um canto da sala sem janelas. No entanto, com a invasão da tecnologia na propaganda, diga-se


50 > Marketing Digital

Google AdWords e similares, o profissional de marketing viu-se com uma demanda de análise estatística pouco comum para o seu dia-a-dia. Terceirizou para agências especializadas. Porém, vieram também os dados de mídias sociais, de acesso ao site, de processos de compras perfil de clientes como nunca antes havia obtido e, então, tudo se complicou. O Big Data busca ocupar a posição de solução para todos esses dados em caótico estado bruto. Segundo pesquisa da The Economist em 2013 com executivos de marketing, a principal estratégia de campanha de marketing há cinco anos era de “comunicação personalizada”. Hoje, são “ofertas personalizadas”. Sutil, porém com grande significado – “oferta” exige entender necessidades. Adequadamente utilizado, o Big Data permitirá conhecermos tão detalhadamente o perfil de consumo individual da população, que corremos o risco de termos mais conhecimento dos hábitos de uma pessoa do que ela própria. Hábitos não raro são atos inconscientes, portanto dificilmente detectados em pesquisas padrão. E aqui vale a máxima: “Seus atos falam tão alto, que não ouço o que você diz.” Segundo pesquisa do CMO Council, 71% esperam realizar análises preditivas a respeito do ciclo de vida do cliente usando Big Data. Demanda-se capacidade analítica. A vida do profissional de marketing está claramente mais atribulada pelo ritmo que a tecnologia vem imponto ao seu dia-a-dia. E a TI, que trouxe a mazela, também trouxe a solução. Vemos surgindo com imponência nos primos norte-americanos soluções de Automação de Marketing que prometem agilizar processos, assim como os CRMs e os ERPs fazem há anos. Estão contempladas obtenção e análise de dados, criação e execução de campanhas multicanais, elaboração de relatórios de desempenho e geração de oportunidades de negócios, incluindo gestão de funil de vendas (pipe). Segundo a Marketo, o uso de um sistema de gestão de pipeline aumenta em 29% os resultados em vendas sem alterar qualquer outra variável. Demanda-se produtividade. Da mesma forma, temas como cloud computing, impressão 3D e os meios eletrônicos têm nos permitido entender, testar e executar abordagens no mercado de maneira cirúrgica, a fim de validar modelos de negócio. Isto é, se um produto ou serviço, de fato, atende às neces-

sidades de determinado perfil de clientes, assim como o que deve ser corrigido ou adaptado para se obter uma boa aderência ao mercado. E, nesse cenário, o diálogo, que sempre ocupou posição fundamental no processo, ganhou escala por meio das mídias digitais.

A TI e o marketing em harmonia A evolução, cuja natureza é um processo de mudança, mantém qualquer profissional que esteja em seu raio de ação, fora da zona de conforto. A dinâmica impressa por esses ciclos tecnológicos tem exigido agilidade para ações em tempo real, uma imensa capacidade de gestão e análise de volumes obscenos de dados, além, é claro, de uma relação muito mais estreita com indicadores de desempenho e métricas de retornos sobre investimento. Isto é, um perfil mais técnico é exigido do profissional de marketing e, o que obtiver maior controle sobre essas variáveis, terá maior controle sobre o negócio, seu departamento e sua carreira. O fundamental é termos em mente de que se trata de uma evolução e, como tal, há o choque inicial, o período de adaptação e, por fim, o equilíbrio – que representa o melhor estado de produtividade. Todos estão passando por essa mesma etapa, e o grande desafio do profissional de marketing é assumir seu lado analítico e metódico sem nunca perder a sua capacidade inata de comunicação, de empatia e da grande sacada. </>

Cristian Gallegos é consultor, palestrante e professor de Marketing em Ambiente Digital na HSM Educacional. Fanático por TI, atuou como executivo em companhias como Locaweb, Tecla Internet e Mandic. É formado em Publicidade e Propaganda, com MBA em Marketing pela ESPM e com cursos de gestão no IBMEC e Fundação Dom Cabral.


Código Livre > 51

Informações e dicas sobre projetos Open Source Por @ale_borba

Pomodoro Extension for Gnome

Para onde foi o meu dinheiro?

Esta extensão, totalmente aberta e open source, permite que os usuários do ambiente de desktop Gnome controlem o seu tempo de trabalho, facilitando o uso da Técnica Pomodoro. É um timer bastante básico, que possui controles para configurar coisas do tipo, intervalo curto, intervalo longo, tempo do pomodoro, contagem de pomodoros etc. Para mais: https://extensions. gnome.org/extension/53/pomodoro/

É um projeto feito em Perl que tem como finalidade ajudar o cidadão a monitorar a execução dos orçamentos Municipal, Estatual e Federal. Além disso, permite saber quais empresas e/ou pessoas físicas receberam os valores pagos pelo Governo. Para saber mais do projeto: http://www. paraondefoiomeudinheiro.org.br

Radar Parlamentar Um aplicativo, desenvolvido em Django, que faz uma análise matemática dos dados de votações de Projetos de Lei nas casas legislativas. Com essa análise, é gerado um gráfico bidimensional de semelhanças entre partidos políticos. Para saber mais, http://radarparlamentar.polignu.org

AudioLazy Um projeto escrito totalmente em Python, que permite o processamento linear, não linear, variante e invariante no tempo. Isso tudo pode ser aplicado em análise, síntese e processamento de áudio, permitindo várias brincadeiras utilizando o som. Para saber mais: https://github.com/danilobellini/audiolazy </>

Vindula Sistema de Intranet Open Source, escrito em Python. Neste sistema, que está na versão 2.0 LTS, você consegue fazer editais, criar e remover campos, criar álbuns de fotos e classificados. Para saber mais, visite http://www.vindula.com.br/sobre

Alê Borba é Gerente de TI e Comunidades do iMasters, e desenvolve projetos como o 7Masters, Dojos e outros.


52 > Conteúdo Digital

ePUB3: publicações multimídia interativas Por @fabioflat

Em um mercado onde inúmeros players brigam pela primazia de estabelecer novos formatos e novas soluções, aqueles baseados em padrões abertos, interoperáveis e modulares ganham força para se afirmarem como referência. Esse é o caso do ePUB3, a fronteira final da multimídia e da interatividade nos livros digitais. Como uma especificação oficial do IDPF (International Digital Publishing Forum) desde outubro de 2011, o ePUB3 é o formato padrão para a distribuição de publicações e documentos digitais. Ele padroniza a codificação e o empacotamento de conteúdo Web estruturado semanticamente, permitindo a integração de documentos HTML5, CSS, SVG, XML e JavaScript, entre outros, em um formato de arquivo único. É compatível (em alguns casos ainda parcialmente) com todos os leitores, dispositivos e sistemas, menos com aqueles que distribuem o ecossistema Amazon/Kindle que, apesar de pioneiro e também baseado em HTML/CSS, caminha na contramão do mercado adotando os formatos proprietários .mobi, .azw e .kf8.

Apresentação •• Todo o poder do CSS3. •• Recursos visuais de layout como efeitos de texto, colunas, transparência e bordas personalizadas. •• Utilização de Media Queries. •• Layouts dinâmicos horizontais ou verticais .

Multimídia e interatividade •• Uso dos elementos <audio> e <vídeo>. •• Suporte para <canvas> e <svg>. •• JavaScript. •• Media Overlays para sincronização de texto, áudio e vídeo. •• MathML (Mathematical Markup) para representar fórmulas e símbolos matemáticos.

Enquanto a especificação ePUB2 é estruturada a partir de XHTML 1.1 e CSS2, na especificação ePUB3 temos (X)HTML5 e CSS3, o que abre um novo leque de recursos, entre eles:

A estrutura do ePUB3

Semântica

•• EPUB Publications 3.0: Define os aspectos semânticos e os requisitos de conformidade da especificação.

•• O uso dos novos elementos <section> <footer> <article> <header> e <aside> aproxima o mundo editorial da Web, pois são termos de fácil compreensão para autores e editores. •• A construção do TOC (table of contents) do livro é marcada pelo elemento <nav>, o que faz todo sentido em se tratando de navegar pelo conteúdo através do sumário. •• O atributo epub:type permite múltiplas inflexões semânticas que são associadas a um vocabulário específico (EPUB 3 Structural Semantics Vocabulary).

De acordo com o IDPF, a especificação do ePUB3 prevê quatro subespecificações menores que formam o pacote final do formato:

•• EPUB Content Documents 3.0: Define as particularidades dos formatos HTML5, SVG e CSS para uso dentro de publicações no formato ePUB. •• EPUB Open Container Format (OCF) 3.0: Define o processo de encapsulamento do conteúdo em um arquivo único (ZIP). •• EPUB Media Overlays 3.0: Define formatos e processos para sincronização de texto e áudio. O conteúdo principal de um livro ePUB3 é um do-


53

ePUB3 : A fronteira final. Estas são as viagens da revolução digital, prosseguindo em sua missão de explorar novos mundos, procurar novos formatos editoriais, novos leitores e novos mercados, para audaciosamente ir aonde ninguém jamais esteve.

ePUB3

mimetype // application/epub+zip META_INF container.xml // é o arquivo que agrupa todo pacote - XML

áudio

OEBPS cap1.xhtml // conteúdo do livro - XHTML5 cap2.xhtml // conteúdo do livro - XHTML5 cap3.xhtml // conteúdo do livro - XHTML5 content.opf // lista e descreve o conteúdo - XML cover.xhtml // capa do livro - XHTML5 nav.xhtml // navegação do livro a partir do sumário (TOC) - XHTML5 toc.ncx // arquivo de navegação compatível com a versão ePUB2

cumento de extensão XHTML, mas na prática renderizado como (X)HTML5 - uma serialização XML do HTML5 -, no qual é permitido usar a sintaxe XML/XHTML para exibir, por exemplo, conteúdo MAthML e SVG. No quadro que você vê no topo da página, temos um possível exemplo de estruturação para um pacote ePUB3.

Experimentando o ePUB3 Apple, Kobo e Google eBooks são referências no suporte para as especificações do formato ePUB3, e o próprio IDPF desenvolveu um leitor, o Readium - uma aplicação open source que funciona como uma extensão do navegador Chrome. Vários exemplos de ePUB3 estão disponíveis gratuitamente no site https://code.google.com/p/ epub-samples, e para abrir e estudar os arquivos basta renomear a extensão .epub para .zip. O formato ePUB3 é um dos frutos da Open Web Platform. Formada por tecnologias, serviços e formatos que orbitam ao redor do HTML5, ela permite soluções que dão uma nova vida ao conteúdo: plasticidade, organicidade, modularidade, interatividade e ubiquidade.

css fontes imagens scripts vídeo

Leia o livro, ouça o livro, converse com o livro, rabisque o livro, brinque com o livro, estique o livro, amplie o livro, mergulhe no livro, compartilhe o livro, altere o livro, seja coautor do livro, traduza o livro, projete o livro como um holograma, vista o livro!

Não são apenas metáforas, são ações reais que estão ao alcance do leitor no mundo digital, e muitas delas já podem ser experimentadas hoje com ajuda do ePUB3! Para saber mais, acesse http://www.idpf.org, http://ibm.co/GPi6sZ e http://bit.ly/11JH3n6 </>

Fábio Flatschart é Gerente de Marketing e Inovação da Soyuz Sistemas e Sócio da Flatschart Consultoria LTDA, empresas com as quais participou do desenvolvimento e implantação de projetos pioneiros nas áreas de Open Web Platform e Marketing Semântico no Brasil. É autor do livro HTML5 - Embarque Imediato, uma das primeiras publicações em português sobre o assunto.Atua como colunista do portal iMasters e é professor convidado dos mais importantes cursos de MBA do Brasil (FGV, FIA, Trevisan).


54 > Encontro 7Masters

O imposto do XML Clécio Bachini - 7Masters Open Data

<otorrinolaringologista> Jacinto Drama Aquino Bairro </otorrinolaringologista>

No caso da representação em mark-up, demos abrir e fechar a tag, repetindo a marcação. Assim, eu duplico o tamanho da meta-informação. E neste exemplo não falamos dos atributos, cujo uso é menos pior, mas ainda grave. Se pensarmos em vários níveis hierárquicos em árvore, é de arrepiar. Quem já fez parse em XML sabe.

A ideia de dados abertos é sempre legal. Mas será que todos os dados abertos, mesmo que em formatos consagrados e homologados, são úteis?

Incentivar o governo a usar XML é antiecológico. Às vezes, tudo o que precisamos é de bons dados em tabelas e um dicionário de dados simples. Viva à simplicidade! Assista à palestra em http://ow.ly/n8TQw

Eu acho temerário, por exemplo, que o XML se torne um padrão para abertura de dados. O XML é um dos maiores desperdícios de espaço eletrônico que a humanidade já produziu. A quantidade de energia utilizada para transportar, armazenar e processar XML até hoje poderiam levar o homem a Marte. Mentira. Na verdade só Jonas Abreu sabe calcular isto. Mas é muita coisa.

Pra que fazer uma visualização de dados?

E por quê? Vamos dar um exemplo simples: se eu tenho um profissional de saúde de uma determinada classe médica, como geralmente eu represento isto em XML?

Com a lei de acesso à informação (12.527/11) e o aumento da disponibilidade de dados governamentais, muitas pessoas começaram a transformar esses dados para conseguir entender o que eles

Jonas Abreu - 7Masters Open Data


55

O 7Masters - Encontro iMasters de Especialistas, acontece todos os meses, na última quarta-feira de cada mês, no iMasters Lab. São 7 profissionais que apresentam assuntos inovadores e diferentes em lightning talks de sete minutos. O tema é definido pela equipe iMasters, mas você pode dar sua sugestão. Escreva para setemasters@ imasters.com.br e opine, sugira um tema ou o nome de um profissional para participar. Aqui você confere uma seleção dos últimos 7Masters. E pode se preparar para os próximos – ainda este ano falaremos sobre Django, Zend, Redes & Servidores, Android, Usabilidade, Inovação e FOI (otimização para front end). Acompanhe as datas em setemasters.imasters.com.br.

de criar mais uma visualização que fica abandonada, porque não é útil para ninguém. Assista à palestra em http://ow.ly/mSgTX

Acessibilidade e a Open Web Vanessa Tonini - 7Masters Open Web

significam. Uma das ferramentas mais utilizadas para isso é a visualização de dados. A visualização de dados é uma ferramenta com um potencial muito grande. Quando bem feita, pode auxiliar decisões, educar pessoas, enfim, melhorar um pouco o mundo. Mas a visualização, por ela mesma, não costuma ser útil. Simplesmente apresentar os dados de uma forma diferente não significa que ficou mais fácil de entendê-los. É preciso que essa visualização ajude a transformar esses dados em informação. Um jeito simples de fazer isso é montar a visualização de forma que ela responda a uma pergunta feita por uma pessoa. Dessa forma, você não está apresentando dados, você está respondendo a perguntas. Pessoas não entendem dados: elas entendem respostas. Com isso, você reduz a chance

A Open Web, como plataforma aberta da web, é o resultado da união de todas as novas tecnologias que estão surgindo para a web, somadas à criatividade e à necessidade de cada um. Ela vem com o intuito de nos fazer pensar fora da caixa no quesito do desenvolvimento e de uso das novas tecnologias que concebem a web. Dentro da Open Web, a presença da acessibilidade


56 > Encontro 7Masters

não passa por despercebida: basta pensarmos na quantidade de recursos que existem hoje disponíveis para pô-la em prática. A questão é: o que está faltando então para que a acessibilidade seja uma realidade na web? Prover a acessibilidade não é só uma questão de projeto, mas sim de interesse, que deve ser iniciado pelo desenvolvedor. É com ele que está a principal responsabilidade para prover a acessibilidade básica de uma aplicação web. Claro que existem vários fatores que influenciam a escolha. Então, o que você está esperando para ajudar a web ser melhor? É preciso trabalhar para reafirmar uma de suas principais características, conforme o mestre Tim Berners-Lee nos disse: “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect”. Assista à palestra em http://ow.ly/mShCw

O impacto da personalização de informações em serviços online nos usuários Carine Roos - 7Masters Open Web Estamos vivenciando hoje uma mudança no modo como recebemos as informações online e essa mudança, de certa forma, tem sido quase imperceptível. Por exemplo, o algoritmo do Facebook, o Edgerank, observa os links nos quais clicamos mais e, por consequência, nos entrega resultados personalizados a partir das interações que fazemos com os outros usuários. Como resultado, visualizamos com menor frequência em nossa timeline informações de perfis que potencialmente teriam opiniões contrárias às nossas ou que apresentariam um novo ponto de vista.

O Facebook não é a única plataforma que está fazendo com que ocorra essa invisibilidade das informações em função do seu algoritmo. O Google também o faz. Se eu consulto alguma informação na Web e você também, por que os nossos resultados são tão diferentes? Para te entregar um resultado personalizado, isto é, filtrado, o Google se baseia em algumas frentes, como localização geográfica, endereço de IP, browser utilizado e sistema operacional. Isto é, não existe mais um Google Padrão. O problema disso tudo é que esses algoritmos mostram aquilo que eles pensam que queremos ver, mas não necessariamente o que precisamos ver. O ativista Eli Pariser chama isso de “filtro bolha”. E esse filtro bolha é o nosso único universo de informação. Ou seja, o que está dentro dele depende de quem somos e do que fazemos. Dessa forma, não decidimos as informações que “entram” e, o mais importante, não sabemos aquelas que ficam “de fora” do nosso universo de informações. Embora a personalização leve a uma melhor experiência do usuário, ela também levanta preocupações quanto à questão da privacidade, especificamente que tipo e quais dados seus estão sendo usados para que esse conteúdo chegue até você de forma personalizada. Uma pesquisa interessante apresentada na WWW2013, “Measuring Personalization of Web Search” (faça o download do pdf em http://ow.ly/ mSkru), aponta que pelo menos 11,7% dos resultados de busca contêm diferenças devido às per-


57

sonalizações, sendo que essa personalização varia caso o usuário esteja logado em uma conta do buscador (como uma Google Account) e também se as buscas são efetuadas diversas vezes por meio de um mesmo endereço IP. Como alternativa a esse mundo de bolhas, existem motores de busca como o DuckDuckGo e o StartPage, cujas principais vantagens são os resultados não serem enviesados, bem como serem serviços que buscam proteger a nossa privacidade. Há também uma startup chamada Personal.com, que fornece mecanismos de armazenamento de dados criptografados na rede, tendo como foco principal a proteção da privacidade dos seus usuários. Assista à palestra em http://ow.ly/mSk87

Para que serve uma web aberta? Kemel Zaidan – 7Masters Open Web

vedores e pessoas comuns deveriam preocupar-se em garantir uma web aberta? Na tentativa de responder a esta pergunta, devemos parar por um momento e pensar nas profundas transformações que a Internet e sua face mais visível, a web, ocasionaram nos últimos 15 ou 20 anos. A rede mudou tudo: educação, cultura, economia, administração pública, comunicações, relações pessoais, etc. É muito difícil, hoje em dia, pensar em um só aspecto de nossa vida social que não tenha sido profundamente transformado pela tecnologia recente. Mas o que torna a web realmente disruptiva é que ela talvez seja a primeira mídia na história da humanidade que nos oferece iguais condições tanto de criação, quanto de consumo de conteúdo. E tudo isso em uma escala global. Para usufruirmos de tudo isso, basta que possamos ter acesso à web: uma vez lá podemos tanto consumir quanto criar conteúdos. Contudo, para que isso se transforme definitivamente em realidade, devemos manter a web aberta, pois esta é a única forma de garantirmos que todo esse potencial seja convertido em realidade. Dessa forma, a web continuará sendo um potente instrumento de voz a todos aqueles que, de outra maneira, não teriam possibilidade alguma de expressar suas ideias. Isso porque muitos são os atores que desejam que tenhamos com esta nova mídia, a mesma relação que tínhamos com as anteriores: passiva, receptiva e de simples consumo. Garantir uma web aberta é garantir que as pessoas tenham acesso à informação, educação, cidadania, cultura, conhecimento, dignidade e renda.

O que define o termo web aberta? Pesquisando na Internet é possível encontrar algumas definições. Entre elas, a de Tantek Çelik, parece ser amplamente difundida. Tantek é CEO do Technorati e autor de diversas das principais especificações do CSS. Segundo ele, a web aberta é aquela cujas características são opostas a uma web proprietária, exclusiva e privada; ou seja: a web aberta é pública, cooperativa e padronizada. Mas porque desenvol-

Assista à palestra em http://ow.ly/n11xL

Fonticons e SVG Richard Duchatsch - 7Masters Open Web Quando falamos em performance, o que mais temos que levar em consideração é a quantidade e


58 > Encontro 7Masters

colocados ícones vetoriais. Font Icons são fontes estáveis e organizadas. Uma vez feitos os ícones vetoriais e portados para arquivos de fontes, utiliza-se o CSS para carregar esta fonte no documento através do @font-face. Para fazer o cross-browser, é preciso gerar os fallbacks de extensões (.ttf, .woff, .svg, .eot).

o peso dos itens que estão sendo carregados no site. Uma das coisas que mais pesa em uma página web são as imagens, em relação ao resto do conteúdo que é composto por código, elas estão em formato de arquivos (png, gif, jpg, bmp etc). Levando isso em consideração, existem técnicas inteligentes que conseguem otimizar essa parte. São o caso das Images Sprites - uma imagem cheia de ícones, posicionados lado a lado, que por sua vez, com ajuda do CSS, como se fosse por coordenadas, utiliza o ícone sem maiores problemas. O interessante das Images Sprites é a rapidez de sua renderização, porque uma vez carregado, ele não sofre delays comumente vistos em images replacements. As Images Sprites tem um calcanhar de Aquiles, que é sua manutenção. Toda vez que um ícone é adicionado ou retirado, pode haver ou não algum retrabalho, dependendo de como está organizado. Mas existem algumas ferramentas que ajudam neste processo: •• Spritecow: http://www.spritecow.com; •• Stitches: http://bit.ly/18ZHOhj; •• CSS Sprites Generator: http://css-sprit.es. Uma outra abordagem que está cada vez sendo mais utilizada, são os Font Icons, que são um arquivo de fontes tipográficas “hackeado”, no qual em vez de caracteres alfabéticos e numéricos são

Além disto os Font Icons têm um truque na manga: eles suportam efeitos de CSS3 e, usando os pseudo-elementos de forma inteligente, eles abrem um leque de possibilidades. O ponto fraco dos Font Icons é que eles são arquivos pesados, e por fazer o cross-browser, precisam fazer arquivos extras. Em conta partida, há casos de uso de dataURIs para resolver este problema de performance. Algumas ferramentas ajudam neste processo: •• Icomoon - http://icomoon.io/ •• Fontello - http://fontello.com/ •• Pictonic - https://pictonic.co/fontbuilder/ •• Pictos - https://my.pictos.cc/builder/ •• Zurb Icon Font - http://bit.ly/17eQUjN Uma outra abordagem possível é usar os SVG Icons. Parecidos com os Font Icons, eles são baseados em imagens vetoriais. O legal do SVG Icons é que eles são feitos em um formato aberto, o SVG. Como os Font Icons, o SVG Icons são estáveis e organizados. Uma vez feitos os ícones vetoriais e portados para arquivos ou no código fonte, utiliza-se o CSS para carregar o ícone. Para fazer o cross-browser, existem algumas técnicas, mas são muito complexas para navegadores antigos. Os SVG Icons têm um segredo: assim como os Font Icons, eles suportam efeitos de CSS3 e usan-


59

do os pseudo-elementos de forma inteligente, eles abrem um leque de possibilidades. Um dos maiores pontos fracos dos SVG Icons é o suporte cross-browser. Há também casos de uso de SVG Icons com dataURIs, arquivos .svg e inseridos diretamente no código fonte. Algumas ferramentas ajudam neste processo: •• http://jefff.co/misc/svg/ •• Raphäel SVG icons - http://bit.ly/cxaM3Z •• Zurb Social SVG icons - http://bit.ly/PgK07c •• SVG Icon Generator - http://bit.ly/vGgq9h Confira alguns artigos que falam sobre SVG Icons: •• http://bit.ly/18ZCTwQ •• http://bit.ly/13x7oGs

página pensada para humanos o entendimento necessitava de conhecimentos prévios, em virtude da complexidade do processo legislativo. Mas, por mais conhecimentos que uma pessoa tenha, fazer uma análise sistêmica e ampla, comparando todas as votações de todos os projetos, voto a voto, partido por partido, ao longo do tempo é algo que foge à capacidade humana. Seria necessário que uma pessoa visitasse todas as páginas de votação, tornando as análises impraticáveis.

O projeto Radar Parlamentar (RP) é um projeto desenvolvido pelo PoliGNU (Grupo de estudos de Software Livre da Poli-USP), um grupo de extensão universitária da Escola Politénica da USP composto do estudantes, ex-alunos, pessoas de outros cursos e pessoas de fora da universidade.

No início de 2012, buscando se adequar à Lei de Acesso à Informação (LAI), Lei 12.527, a Câmara dos Deputados decidiu lança seu portal de dados abertos e disponiblizar seus dados por meio de WebServices (WS). Ao se realizar uma determinada consulta, o WS retorna um arquivo XML com todos os votos de uma determinada votação. Este arquivo é passível de ser tratado e analisado por um programa de computador e, além disso, o acesso aos arquivos XML pode ser feito por meio de endereços web (URL) que utilizam parâmetros que permitem que estes mesmos programas de computador possam buscar os arquivos que forem necessários de forma automatizada. Com essas duas características, dos formatos processáveis e do acesso automatizado, é possível criar um programa de computador que faça análises e avaliações de grandes volumes de dados.

Inicialmente, a Câmara dos Deputados disponibilizava os dados das votações ocorridas na casa em seu website, numa página pensada para ser vista e lida por humanos. Claro que mesmo sendo uma

De posse dos dados da Câmara, Leonardo Leite, um dos membros do PoliGNU, pensou que seria importante que os dados disponibilizados fossem efetivamente utilizados pela sociedade, e de todos

•• http://bit.ly/OreEgu Assista à palestra em http://ow.ly/n1sP2

Radar Parlamentar Diego Rabatone Oliveira - 7Masters Open Data


60 > Encontro 7Masters

os dados disponibilizados ele optou por utilizar os das votações da casa para gerar índices de similaridade entre os partidos políticos baseando a análise única e exclusivamente no resultado concreto das ações do parlamentares, que é o voto dos mesmos, comparando os partidos entre si. Assim surgiu o projeto CamaraWS, que posteriormente, durante o hackathon da Câmara Municipal de São Paulo, foi rebatizado de Radar Parlamentar por meio de uma votação pública realizada no site do PoliGNU. Hoje a análise das votações é realizada por meio de um algoritmo matemático chamado PCA (Análise de Componentes Principais). Este algoritmo é capaz de reduzir a quantidade de dados (número de votações analisadas) a apenas dois valores, o que nos permite gerar um gráfico bidimensional de semelhança entre os partidos. Neste gráfico o tamanho de cada circunferência é proporcional ao tamanho da bancada do partido, e quanto mais próximos dois partidos estão no gráfico, mais semelhantes eles são. Como próximos passos do projeto, pretende-se adicionar a possibilidade de se realizar análises com base em temas específicos (educação, saú-

de, etc), e também permitir que o usuário dê seus votos nos projetos e se posicione no gráfico, comparando-se com os partidos. Todo código fonte do projeto está disponível no Github e contamos com novas pessoas que desejem colaborar com o desenvolvimento do projeto. Para grande parte das pessoas envolvidas com o projeto, para além da relevância pública do mesmo enquanto ferramenta de análise política, também foi importante a possibilidade de utilizar conhecimentos técnicos e teóricos adquiridos durante a graduação numa Universidade Pública para gerar algum resultado concreto que possa ser utilizado pela sociedade, pois de nada adiantam os conhecimentos técnicos e teóricos, sejam eles advindos de um curso de graduação, sejam eles advindos da prática hacker, se eles não são utilizados para gerar melhorias coletivas. •• Radar Parlamentar: http://bit.ly/13DLRYL •• PoliGNU: http://polignu.org •• GitHub do projeto: http://bit.ly/1189VkS Assista à palestra em http://ow.ly/n8TLX </>



62 > Analytics

Mapeamento de ações telefônicas no Google Analytics Por @alvarovasques

Por sempre ouvir nas reuniões sobre o quando o atendimento telefônico influencia no processo de compra online, decidi fazer uma análise mais profunda e percebi uma lacuna nos dados: quanto o atendimento telefônico realmente impacta e o quanto ele assiste a outras fontes de tráfego?

Será necessário construir um Gerador de URL no sistema de atendimento, onde o operador informa a URL, o nome e o e-mail do cliente.

Esse insight me levou a uma imersão no setor de atendimento e ao mapeamento que vou descrever neste artigo. Ele não é nenhuma descoberta da roda, mas pode ajudar a entender um pouco mais sobre o processo que leva seu cliente à compra. Vamos lá! Vou usar um e-commerce como modelo para ajudar a organizar a linguagem utilizada. No call center, temos alguns tipos de interações, utilizarei as principais: •• Receptivo: recebe as ligações gerais (informações, dúvidas, sugestões, reclamações...) •• Ativo: abordagem mais proativa. Ex.: um cliente fez seu cadastro, colocou o produto no carrinho e o abandonou. Isso leva esse cliente para uma lista de pendência que é o combustível do Ativo - ele tentará fechar a venda com todos da lista. •• Retenção: no caso de um pedido de cancelamento, a retenção argumenta para que o cliente reconsidere e desista do cancelamento e sugere a compra de outro produto. •• Cobrança: em caso de inadimplência, a cobrança é acionada. Como acontece com o Ativo, a cobrança também recebe uma lista para abordagem. Essas interações têm duas ações básicas: informação ou pagamento. Para realizar o mapeamento de ações utilizando o Google Analytics, primeiramente, será necessário um aculturamento da equipe para substituir o “pode, por favor, acessar a URL X” por “Por favor, acesse seu e-mail e clique no link que acabei de enviar”.

O primeiro botão gera o link, caso o atendimento seja via chat. O segundo gera o link e envia para o e-mail informado. O e-mail enviado é customizado de acordo com a URL enviada: caso seja uma URL de produto, será enviado um texto padrão + dados do produto, formas de pagamento, taxas, fretes, descontos etc. Optei por utilizar a tag de campanha do Google para fazer esse mapeamento, transformando o call center em uma fonte de tráfego. A tag de campanha fica assim: URL/?utm_source=SOURCE&utm_ medium=MEDIUM&utm_term=TERM&utm_ content=CONTENT&utm_campaign=NAME •• URL = Endereço de link completo (http ou https) a ser enviado •• SOURCE = Origem de tráfego que no caso do será -> CALLCENTER •• MEDIUM = Tipos de mídia, que no caso serão -> CALL-RECEP, CALL-ATIV, CALL-RET, CALL-COB


63

•• TERM = Termos utilizados - > vamos utilizar essa variável para informar o ID-OPERADOR •• CONTENT = Tipo de link - > LINK-PGTO , LINK-INFO •• NAME = Nome da campanha - > NOME DA CAMPANHA/AÇÃO No Google Analytics, teremos os dados de acompanhamentos por origem de tráfego, campanhas, conforme a imagem abaixo:

Acompanhamos a produtividade de cada operador e é possível calcular a taxa de conversão de cada um deles (links enviados/transações). Abre-se um leque de novos dados que podem ser acompanhados e certamente novos KPIs. Podemos utilizar os segmentos avançados e principalmente a ferramenta de multicanal, que nos proporciona uma visão macro do nosso negócio. E falando em multicanal, chegamos ao ponto mais importante desse artigo: ver o quanto o call center auxilia as outras fontes. Na figura abaixo customizei o relatório de multicanais, adicionando aos canais padrões os canais de atendimento do call center. Assim, conseguimos analisar as conversões em que a última interação foi feita pelo call center e também todas em que ele esteve presente auxiliando no processo de compra.

Relatório de origem de tráfego origem/mídia

Como pode observar, o call center passou a ser uma origem de tráfego e seus subdepartamentos, mídias.

Relatório de origem de tráfego Campanha

Podemos acompanhar e medir todas as campanhas.

Relatório de origem de tráfego Id do operador

Nas próximas edições, vou continuar o assunto, indo mais a fundo na ferramenta multicanal e demais relatórios, de um passo a passo na configuração a insights de análises.

Álvaro Vasques é Analista de Web Analytics no Portal Educação - alvarovasques@gmail.com


64 > Review

Glass: o melhor “wearable” ou o melhor “gadget” nunca antes visto? Por @luisleao

Este ano, pude participar do Google I/O, o principal evento da empresa que fala sobre os lançamentos e as novidades dos seus produtos e tecnologia. No ano passado, eles lançaram o Google Glass, uma espécie de dispositivo “vestível” no formato de óculos, no qual você pode receber informações e avisos sobre sua conta, tirar fotos, gravar vídeos e conversar com amigos. Num primeiro momento, a ideia é simplesmente genial, não pelo fato de colocar um display na sua cara, mas pela quebra de um paradigma a que estamos acostumados há muito tempo: o uso das mãos para operar um aparelho. Com o Glass, praticamente tudo pode ser operado utilizando comandos de voz! Além disso, você tem um dispositivo que pode exibir informações contextuais, que têm a ver com o local onde você está de uma forma simples, prática e sem precisar tirar o celular do bolso. Veja algumas considerações sobre o Google Glass.


65

Áudio: não é muito bom em um ambiente com ruídos. Quando estava em um local mais calmo, podia ouvir bem. O microfone capta qualquer som e não sabe exatamente de onde vem. Imagine pessoas numa conferência que fala sobre Glass. ;)

tenderam o propósito do dispositivo ou que a bateria não está acompanhando a necessidade de uso). Mas quem nunca teve problemas com bateria em smartphones ou não teve que aprender “na marra” uma nova tecnologia?

Vídeo: apesar de não ser uma resolução muito grande, a imagem projetada dá uma boa leitura. A posição do visor deve ficar acima da linha de visão. No início, incomoda ter a tela apenas em um olho.

Do ponto de vista de desenvolvedor, a maioria das pessoas que perguntei sobre o que estão fazendo com o Glass respondeu que só participaram de um hackathon que foi organizado pelo Google e que não estava desenvolvendo nada. O que me preocupa é que ninguém tem uma ideia concreta do que fazer com o dispositivo ainda, e as pessoas estão apenas usando-o como um “gadget” caro e de luxo. É comum encontrar pessoas usando o Glass no metrô em San Francisco, mas não surgiu nada ainda que revolucionasse o dispositivo.

Conectividade: geralmente via bluetooth, mas funciona com wi-fi (desde que pré-configurado). O sistema de reconhecimento de voz precisa de acesso a nuvem e não vi a opção para funcionar offline (como acontece no Android), com exceção da chamada “OK Glass...”. Bateria: dura um dia numa utilização normal ou muito menos (se gravar vídeos e utilizar muito os demais serviços). Usabilidade: você precisa indicar quais contatos/círculos estarão disponíveis no Glass, sendo necessário abrir a interface de configuração fora do dispositivo (no celular ou no computador). Há possibilidade de atender ligações utilizando o Glass e por meio dos hangouts, que são a única opção que você não precisa pré-configurar.

Infelizmente, as decisões tomadas pela Google impedem que outros desenvolvedores possam testar aplicativos. Além disso, eles ainda não se posicionaram em relação a um “emulador” que pudesse ser utilizado em ambiente de testes (embora desenvolvedores tenham criado um emulador próprio: http://glass-apps.org/ google-glass-emulator). Só nos resta aguardar para ver como será a próxima versão desse dispositivo e quando ele estará disponível para o resto do mundo. </>

API: utiliza REST e é muito bem documentada! Uma pena não estar disponível para qualquer desenvolvedor (apenas os usuários que adquiriram o Glass podem ativar e consumir a API). Apesar de ser um produto ainda no começo e de que muito do que foi falado até agora não mostrar um cenário muito otimista, eu pessoalmente acredito no potencial do Glass. Se você comparar com todos os dispositivos vestíveis no mercado, como Nike FuelBand, FitBit, Jawbone UP etc., vai perceber que o Glass foi um avanço em design e funcionalidade. Até o momento, não vi nenhum dispositivo que possa chegar ao nível dele: ser um device Android, com capacidade boa de processamento, com GPS e acelerômetro, com visor e no formato de um dispositivo vestível. Acredito que ele muda a forma como nos relacionamos com tecnologia, e isso leva tempo: vi muita gente no I/O usando o Glass e atendendo o telefone pelo celular (isso indica que não en-

Luis Leão é desenvolvedor web que encontrou em APIs e hardware aberto novas formas de integrar a web com o mundo real. www.luisleao.com.br


66 > Criatividade Tecnológica

“How to make (almost) anything” ou com quantos paus se faz uma cadeira Por #linalopes

Na história do homo sapiens, imagino que ele, em seu processo de sedentarização, dominou o fogo e depois, com a lenha que sobrou, criou a cadeira. De fato, eu não saberia dizer, ou precisar, quando a primeira cadeira foi criada, contudo o trono mais antigo, que chegou aos dias de hoje, é o do palácio de Cnossos, na ilha de Creta. Isso significa que a ideia de cadeira como símbolo de quem detém o poder é mais antiga que a invenção da escrita e da História. E quem fazia todos os tipos de cadeiras eram os artesãos e carpinteiros. Jesus Cristo provavelmente deve ter feito várias. Já a história da cadeira elétrica é bem mais recente. No fim do século XIX, Thomas Edison patenteou a lâmpada e os dispositivos cinematográficos nos EUA, enquanto fazia lobby junto ao governo americano para dar início ao mercado da eletrocussão. A execução de prisioneiros usando eletricidade é um marco da vida moderna, de uma sociedade em plena Revolução Industrial e exemplo de uma evolução tecnológica, econômica e social (“God bless America”). Nesse momento histórico, os artesãos deixam de produzir cadeiras e passam a operar máquinas. A tecnologia traz consigo a separação entre aqueles que fazem as máquinas funcionarem (funcionários) e aqueles que patrocinam as máquinas (patrões). Os patrões também detêm o conhecimento científico aplicado na produção de cadeiras, desde a escolha e pesquisa da madeira e materiais adequados, passando pela produção serializada, e chegando à venda do produto final, distribuída em escala mundial. Os funcionários sabem se sentar na cadeira e apertar botões. Contudo, outra revolução surgiu de tanto apertar botão: a Revolução Digital. Com ela, veio o computador, a interface gráfica, a Internet, as redes sociais e, também, o motivo deste texto, a fabricação digital. Alguns talvez tenham em mente a tão comentada impressora 3D, como exemplo do que vem a ser a tal fabricação digital. Na realidade, o conceito é um pouco mais robusto e abarca todo um novo tipo de produção que usa ferramentas controladas por computador para transformar

projetos digitais em objetos físicos. É a exploração da fronteira entre a Ciência da Computação e a Ciência Física, como gosta de definir o Prof. Neil Gershenfeld, diretor do Center for Bits and Atoms do MIT. Gershenfeld é professor e coordena a disciplina How to Make (Almost) Anything. Desde 2001, trabalha com o tema de fabricação digital e é um dos pioneiros do projeto FabLab. Inicialmente, a computação revolucionou o modo de produção com as ferramentas CAD (computer-aided design). Era possível representar o desenho de uma cadeira em um mundo gráfico de bits. A computação passou de representação do projeto para ferramenta do projeto com o advento das ferramentas CAM (computer-aided manufacturing), incluindo as instruções para as máquinas de Computer Numerical Control (CNC). Essas máquinas recebem uma informação numérica a partir do arquivo de design e são capazes de cortar e fresar o material para chegar à forma almejada. Esse tipo de produção é conhecida como substrativa e conta também com outros tipos de maquinário, como cortadora a laser, a plasma (para chapas metálicas) ou a jato de água. Essas tecnologias, de modo geral, não estão facilmente disponibilizadas para o público em geral, pelo menos não tanto quanto uma outra, cujo modo de produção ocorre por adição de material, a impressora 3D. Para adquirir uma impressora 3D, basta entrar em uma das páginas dos fabricantes, como o MakerBot (http://www.makerbot.com/) e a Felix (http://www.felixprinters.com/) ou a da versão brasileira Metamáquina (http://metamaquina. com.br/). Nós, aqui em casa, montamos a nossa junto com a comunidade RepRap (http://reprap. org/wiki/Main_Page), de Barcelona. A ideia geral é que a impressora possa imprimir suas peças-chave e ser autorreplicante. Independentemente do tipo de produção escolhida, se aditiva ou substrativa, é possível construir uma cadeira a partir de um modelo 3D feito no computador. Aliás, esse modelo pode ser elaborado à mão por designers e engenheiros ou também


67

fazer o upload do seu modelo e receber em casa o seu produto. Para quem é designer e estiver interessado, é possível também vender seu produto por demanda nesse site para outras pessoas interessadas de qualquer lugar com acesso à Internet.

Folding Chair and Ottoman, por Brainstream

pode contar com a ajuda de um processo conhecido como 3D scanner. Nesse caso, o modelo é construído a partir de imagens tomadas do objeto real. Recentemente, a Autodesk lançou o 123D Catch (http://www.123dapp.com/), um aplicativo grátis para criar modelos 3D a partir de captura de 20-40 imagens em torno do objeto. O que há de tão revolucionário em tudo isso? Segundo Gershenfeld, em seu artigo Foreign Affairs (2012), a inovação está na capacidade de transformar dados em coisas e as coisas em dados. É possível deter novamente os conhecimentos da fabricação de uma cadeira, é possível produzir cadeiras em menor escala e de modo mais personalizado e compartilhá-las com o restante do mundo. Tudo isso porque a fabricação digital permite maior flexibilidade, simulação, customização e de maneira descentralizada e consciente. Trata-se da recapacitação e do fortalecimento de criadores e produtores locais em nível global. O projeto FabLab foi criado e disseminado com esse intuito. São pequenos pontos de produção e inovação completamente equipados com CNCs, cortadoras a laser, impressoras 3D etc., para produção em pequena e média escala. Nesses espaços, novos designers e interessados em geral podem dar forma a suas ideias. E mais que espaços físicos ao redor do mundo, o FabLab é uma rede de trocas de conhecimento. Faz parte do pensamento da fabricação digital, um design open source, aberto e compartilhado. A plataforma Thingiverse (http://www.thingiverse. com/) dispõe de vários arquivos de modelagem 3D de objetos e projetos diversos para quem quiser baixar, modificar e imprimir. E se você ainda não tem uma impressora 3D em casa (apenas uma questão de tempo), pode contar com a plataforma Shapeways (http://www.shapeways.com/) para

A fabricação digital propõe uma democratização na área de inovação e produção e, como tudo que tem alta acessibilidade, tem todo tipo de projeto. Polêmico é o Defense Dist (http://defdist. org/), que disponibiliza projetos para a impressão de armas de fogo, alegando a liberdade do uso de armas entre civis para autodefesa nos EUA. Por outro lado, há projetos como o Magic Arms (http://magicarms.org/), que possibilita a crianças, como Emma de 3 anos, terem um exoesqueleto para ajudá-las em seus movimentos, de outro modo, limitados por patologias neuromusculares. O acesso e o número de projetos em fabricação digital pessoal vêm crescendo ano a ano e apontam uma tendência. Ainda não é tão comum ter uma impressora 3D quanto ter um computador pessoal, mas Chris Anderson, escritor americano que trabalhou como editor da revista WIRED e hoje dirige a companhia de drones 3DRobotics, já fala em uma nova revolução industrial. Em seu mais recente livro, Makers - a nova revolução industrial (Editora Campus-RJ, 2012), ele comenta como novas tecnologias democratizadas mudaram o mundo: primeiro, os computadores, depois, a Internet e, para os próximos 10 anos, a fabricação digital. Ele mesmo empreendeu seus drones, pequenos robôs aéreos autônomos, a partir da experiência da fabricação em casa de um brinquedo para o filho. A palavra de ordem junto à ideia de fabricação pessoal é “Faça você mesmo”. Impressoras 3D e redes sociais virtuais de comunicação e compartilhamento de informação, bem como espaços dedicados à produção personalizada são o tripé de um novo empreendedorismo. E, hoje, cadeiras são como... a Wiki. :P •• Impressora 3D delta: http://bit.ly/Lkbp3T •• Impressora 3D de cerâmica: http://bit.ly/N0oSk3 </>

Lina Lopes é graduada no curso superior de audiovisual da universidade de São Paulo (ECA/ USP), está cursando engenharia da computação (FIAP) e se especializando em iluminação e design (IPOG). Pesquisa a relação entre corpo, espaço cênico, linguagem da fotografia, do vídeo e das artes&tecnologias. - lina@blab.art.br


68 > iMasters Box

iMasters Box Seleção: João Antônio - joao.antonio@imasters.com.br - envie suas sugestões de ferramentas!

Zoho Wiki

MODx Revolution

Gliffy

Zoho Wiki é uma ferramenta de registro de processos com recursos wiki, que também permite a criação de áreas de trabalho individuais. Nelas, o usuário pode organizar aplicativos e funcionalidades que deseje utilizar dentre as soluções da suíte Zoho (ferramenta para CRM, recrutamento, gestão de projetos, organização de reuniões, compartilhamento de documentos, criação de aplicativos e várias outras) e incorporá-las a produtos das suítes Google, Office e Sharepoint. Suas páginas permitem a edição coletiva, monitoramento de páginas e controle de versões.

É um sistema de gestão de conteúdo de código aberto. A ferramenta é segura, maleável e escalável, possui seções completamente customizadas e pode ser usada para o desenvolvimento de websites específicos. O sistema é bastante ágil e rápido, desenhado para ser utilizado em websites de qualquer tamanho e permitir uma rápida expansão. É fácil criar novos temas e páginas visualizadas de forma diferente conforme seu contexto. Isso permite a criação de websites específicos para projetos, clientes ou fornecedores, com permissões de acesso e funcionalidades customizadas. As extensões podem ser instaladas diretamente de seu painel de administração.

Ferramenta online para análise. Conta com suporte, por exemplo, a UML, DER e vários outros diagramas. Com uma interface amigável e rápida, de arrastar-e-soltar, combina o poder do software de desktop tradicional com a leve curva de aprendizagem, baixa e características flexíveis de hoje e o aplicativos mais populares baseados em navegador. Gliffy funciona através de seu navegador.

http://ow.ly/mUGJf

http://ow.ly/mUGXl

http://ow.ly/mUGZ9


69

O iMasters Box é um agregador de serviços voltado para desenvolvedores web, que reúne ferramentas úteis para esses profissionais e que já estão disponibilizadas na rede. Aqui na Revista, vamos selecionar sempre algumas das ferramentas mais interessantes para você. Conheça mais o iMasters Box em http://imasters.com.br/box e participe! Sua sugestão de ferramenta pode vir parar também na Revista!

MySQL Workbench

Laravel

Subversion

Ferramenta multi-plataforma de design visual de banco de dados desenvolvido pela MySQL. Está disponível como uma ferramenta nativa GUI no Windows, Linux e OS X em diferentes edições.

Framework PHP com uma sintaxe elegante e expressiva, focado em trazer uma experiência de programação agradável, criativa e reconfortante. Laravel tenta remover todas as partes desagradáveis da programação através da apresentação de alternativas simples e efetivas de atividades comuns a quase todos os sistemas web, como autenticação, rotas, sessões, caches etc. Fornece ferramentas poderosas que podem ser utilizadas em aplicações grandes e/ou robustas.

Também conhecido por svn, o Subversion é um sistema de controle de versão desenhado especificamente para ser um substituto moderno do CVS, que se considera ter algumas limitações. Ele é desenvolvido como um projeto da Apache Software Foundation, e como tal é parte de uma rica comunidade de desenvolvedores e usuários. Ele gerencia arquivos e diretórios ao longo do tempo. Esses arquivos ficam armazenados em um repositório central sob o cuidado desse sistema. Esse repositório se parece muito com um servidor genérico de arquivos, exceto que todas as mudanças feitas em seu conteúdo são devidamente registradas. Além de você ter sempre a versão mais atual disponível, o sistema permite recuperar versões antigas dos seus dados, examinar o histórico para saber que modificações foram feitas ou ainda, quem executou a alteração.

http://ow.ly/mUH0Z

Oferece um incrível controle de containers, migrations para bancos de dados, um sistema de testes unitários, além de várias outras ferramentas para facilitar o desenvolvimento de qualquer aplicação web. http://ow.ly/mUH2X

http://ow.ly/mUH4n





Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.