revista imasters #07

72
Front-End Ops: introdução a uma nova disciplina #frontend #pág36 Nuvem Negra ou, computação em nuvem não são só flores TI na propulsão do marketing #mktdigital #pág48 #cms #pág32 Wordpress sem limites R$24,00 Nós fazemos a Internet no Brasil Agosto 2013 / Ano 02 / Edição 07

Upload: imasters-redacao

Post on 14-Mar-2016

228 views

Category:

Documents


8 download

DESCRIPTION

Nuvem Negra - ou, computação em nuvem não são só flores Revista iMasters n.7, Ano 2

TRANSCRIPT

Page 1: Revista iMasters #07

Front-End Ops: introdução a uma nova disciplina#frontend #pág36

Nuvem Negra

ou, computação em nuvem não são só flores

TI na propulsão do marketing#mktdigital #pág48

#cms #pág32

Wordpress sem limites

R$24

,00

Nós

faze

mos

a In

tern

et n

o Br

asil

Agos

to 2

013

/ A

no 0

2 /

Edi

ção

07

Page 2: Revista iMasters #07
Page 3: Revista iMasters #07

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, Pe-dro 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 [email protected] 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.

Page 4: Revista iMasters #07
Page 5: Revista iMasters #07

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 bol-sos. O celular (smart ou não) passa a ser nos-sa 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 ques-tã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 en-tender 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 [email protected]

Page 6: Revista iMasters #07

22 :: Capa > Nuvem Negra

32 :: CMS WordPress sem Limites

</>36 :: Front-End

Front-End Ops: introdução a uma nova disciplina

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

6 > Sumário

Page 7: Revista iMasters #07

A iMasters é uma revista de Tecnologia/Web aberta a novas ideias. Para colaborar envie o seu material por e-mail <[email protected]>

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

7

Page 8: Revista iMasters #07

#!/usr/bin/perl

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

package Text::Markdown;require 5.006_000;use strict;use warnings;

use Digest::MD5 qw(md5_hex);use 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/perl-unicode-struggle.html

## Global default settings:#my $g_empty_element_suffix = “ />”; # Change to “>” for HTML outputmy $g_tab_width = 4;

## Globals:#

# Regex to match balanced [brackets]. See Friedl’s# “Mastering Regular Expressions”, 2nd Ed., pp. 328-331.my $g_nested_brackets;$g_nested_brackets = qr{ (?> # Atomic matching [^\[\]]+ # Anything other than brackets | \[ (??{ $g_nested_brackets }) # Recursive set of nested brackets \]

8 > Entrevista > Larry Wall

Lançada em 1987, Perl é uma linguagem que tem como objetivo ser flexível e capaz de fazer códigos funcionais. Seu criador, Larry Wall, fez praticamente todo o processamento de texto em sistemas baseados em Unix, utilizando diversas ferramentas, como AWK, ‘sed’, C e linguagens shell script. A ideia era juntar as principais vantagens de todas essas linguagens: expressões regulares do ‘sed’; a identificação de padrões de AWK; a profundidade de C; além da sintaxe baseada tanto em C quanto em Shell Script.

Por @kemelzaidan

Com tradução e edição de @RinaPri

Page 9: Revista iMasters #07

)*}x;

# Table of hash values for escaped characters:my %g_escape_table;foreach my $char (split //, ‘\\`*_{}[]()>#+-.!’) { $g_escape_table{$char} = md5_hex($char);}

# Global hashes, used by various utility routinesmy %g_urls;my %g_titles;my %g_html_blocks;

# Used to track when we’re inside an ordered or unordered list# (see _ProcessListItems() for details):my $g_list_level = 0;

# Check to see if Markdown.pm has been loaded; if so we must be loaded# as a perl module.my $g_perl_module = exists $INC{‘Text/Markdown.pm’};

#### Blosxom plug-in interface ##########################################

# Set $g_blosxom_use_meta to 1 to use Blosxom’s meta plug-in to determine# which posts Markdown should process, using a “meta-markup: markdown”# header. If it’s set to 0 (the default), Markdown will process all# entries.my $g_blosxom_use_meta = 0;

sub start { 1; }sub story { my($pkg, $path, $filename, $story_ref, $title_ref, $body_ref) = @_;

if ( (! $g_blosxom_use_meta) or (defined($meta::markup) and ($meta::markup =~ /^\s*markdown\s*$/i)) ){ $$body_ref = Markdown($$body_ref); } 1;}

9

Revista iMasters: Qual é a sua formação, o que você estudou na faculdade?

Larry Wall: Eu estudei muitas coisas, diversas, e quase não consegui concluir nada porque não ti-nha créditos suficientes para nenhum curso. Mas, no final das contas, consegui fazer com que a fa-culdade deixasse eu me formar. Entre as coisas que estudei estão programação e linguística, dois assuntos que foram primordiais para que eu che-gasse ao Perl. Mas também fui bem além disso, passando por química e música, por exemplo.

RiM: Por que você decidiu estudar computa-ção? O que te chamava a atenção?

LW: Bom... você pode conseguir que os computadores façam coisas que as pessoas acham interessantes!

A verdade é que eu provavelmente estou em al-gum lugar dentro do espectro do autismo. Sendo assim, eu tenho uma enorme dificuldade em lidar com pessoas. Eu consigo fazer isso, mas é um grande estresse para mim. Então, poder se rela-cionar através de algo que eu faço e que os outros vejam o que eu fiz, mas sem necessariamente ter que discutir com alguém sobre o tempo ou outros assuntos assim, é uma forma de me tornar social.

Meu pai é um pastor de igreja cristã e eu cres-ci nesse ambiente. Como o “filho do pastor”, eu não podia ser tímido, mesmo sendo assim natu-ralmente. Então, ao longo dos anos, eu aprendi a me relacionar com as pessoas, mas foi algo que eu tive que aprender, que desenvolver, e por isso às vezes não é fácil. Para alguém como eu, isso não é fácil. Para mim, é mais gratificante fazer al-guma coisa que as pessoas vão achar útil. Por isso, eu tenho a tendência de medir o meu próprio trabalho não pelo que eu vou conseguir com ele, mas pelo que eu posso oferecer a partir dele. E eu entendo que isso é o que define uma pessoa, não quanto dinheiro ela tem.

RiM: Por isso que o Perl entrou na sua vida?

LW: Foi quase um acidente. Eu apenas queria ofe-recer uma coisa para os outros. E isso era bem difícil porque não havia uma cultura desse tipo. Então eu pensei em uma forma de oferecer coisas aos outros livremente. E algumas dessas coisas, como o programa “patch”1, acabaram por ajudar a iniciar o movimento de software livre, porque muitas pessoas passaram a trocar patches.

Há anos, no tempo em que as redes tinham uma largura de banda muito pequena, as pessoas não podiam simplesmente enviar uma nova có-pia dos recursos. Mas se isso fosse um arquivo de patch, as pessoas poderiam manter seus sof-twares sincronizados.

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 ninguém tinha aplicado o outro anterior. Então eu percebi que precisava achar uma forma para encorajar as pessoas a manterem seus softwa-res sincronizados, assim, quando um outro patch fosse enviado eles aplicariam a mesma versão. Então, uma das coisas que foi internalizada pelo programa de patch desde o início foi um pré-re-quisito que determinava que uma certa versão do patch deveria estar instalada.

A segunda versão foi muito mais fácil de manter porque que as pessoas já estavam usando, ao menos até quando chegamos ao ponto delas co-meçarem a colocar repositórios na rede e a fazer isso de forma bastante automática. E o programa Patch ajudou a fazer o bootstrap, mais ou me-nos da mesma forma que o Perl ajudou a fazer o bootstrap na web do início; hoje, mesmo que muitos sites não usem mais a linguagem, muitos foram prototipados em Perl.

Acho que sou uma dessas pessoas que escrevem protótipos para depois jogá-los fora!

RiM: Por que você decidiu escrever o Perl?

LW: Para matar uma vontade!

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

Eu estava em um projeto para a NSA (National Security Agency, a agência de segurança do go-verno americano), a empresa tinha um contrato lá e eu estava desenvolvendo uma “rede segura” por toda a costa entre Santa Mônica, na Califórnia, e a Pensilvânia. Nós trocávamos informações por meio de arquivos de texto sobre o projeto, mas eles queriam relatórios sobre os arquivos de tex-tos e o sistema Unix com o qual trabalhávamos tinha uma versão muito antiga do awk.

Page 10: Revista iMasters #07

#!/usr/bin/perl

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

package Text::Markdown;require 5.006_000;use strict;use warnings;

use Digest::MD5 qw(md5_hex);use 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/perl-unicode-struggle.html

## Global default settings:#my $g_empty_element_suffix = “ />”; # Change to “>” for HTML outputmy $g_tab_width = 4;

## Globals:#

# Regex to match balanced [brackets]. See Friedl’s# “Mastering Regular Expressions”, 2nd Ed., pp. 328-331.my $g_nested_brackets;$g_nested_brackets = qr{ (?> # Atomic matching [^\[\]]+ # Anything other than brackets | \[ (??{ $g_nested_brackets }) # Recursive set of nested brackets \]

10 > Entrevista > Larry Wall

A gente estava fazendo um trabalho de processa-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 traba-lhava numa espécie de cofre, e alguns meses depois eu tive que discretamente tirar essa linguagem dali para chegar ao que seria o Perl 1, a versão que seria distribuída para o mundo. Eu queria apenas conse-guir repassar alguns arquivos de texto e extrair algu-mas informações de algumas expressões regulares 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?

LW: Quando eu comecei não existia ainda a no-ção de um administrador de sistemas. Havia o que a IBM chamava de Programador Chefe – o cara número um, que sabia como tudo funciona-va. E eu meio que já havia estado nessa posição em meu trabalho na Seattle Pacific University e também quando trabalhei em uma empresa de desenvolvimento de sistemas. Eu fui contratado para essa posição, mas o ideal desse cargo é meio diferente do que é um administrador de sis-temas, quando você tem outras pessoas fazendo a programação e gerenciar o sistema de um ponto

de vista operacional torna-se um trabalho de tem-po integral. Nessa época meu cunhado me falou “ah, você não quer se tornar um administrador de sistemas, isso é um trabalho morto”.

Mas enquanto eu estava fazendo isso, eu con-tinuei desenvolvendo o Perl, então não era ape-nas uma linguagem para fazer análise de texto, eu decidi que queria também fazer uma parte de administração de sistema, como renomear arquivos e todas as funções de um admin. En-tã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 espe-ciais do Perl. Então havia o OraPerl, para o Oracle, o SybPerl para Sybase. E foi então que eu perce-bi que havia um problema: o que aconteceria se você quisesse usar Oracle e Sybase no mesmo programa? Seria preciso ter extensões que aju-dassem a colocá-los juntos no mesmo programa.

Então, acho que o Perl mudou um pouco com essa ideia de ter várias caras, o que o levou a ter extensões que conversassem com vários backen-ds de bancos de dados. A ideia de fazer uma in-terface com objetos de forma que fosse possível falar mais sensivelmente com pessoas.

Foi dessa noção que o Perl 5 nasceu, com uma boa dose de extensibilidade. Como resultado, eu descobri que muitas outras pessoas queriam fazer

Imagem: http://bit.ly/11jS26r

Page 11: Revista iMasters #07

#### Movable Type plug-in interface #####################################eval {require MT} unless $g_perl_module; # Test to see if we’re running in MT.unless ($g_perl_module || $@) { require MT; import MT; require MT::Template::Context; import MT::Template::Context;

eval {require MT::Plugin}; # Test to see if we’re running >= MT 3.0. unless ($@) { require MT::Plugin; import MT::Plugin; my $plugin = new MT::Plugin({ name => “Markdown”, description => “A plain-text-to-HTML formatting plugin. (Version: $VERSION)”, doc_link => ‘http://daringfireball.net/projects/markdown/’ }); MT->add_plugin( $plugin ); }

MT::Template::Context->add_container_tag(MarkdownOptions => sub { my $ctx = shift; my $args = shift; my $builder = $ctx->stash(‘builder’); my $tokens = $ctx->stash(‘tokens’);

if (defined ($args->{‘output’}) ) { $ctx->stash(‘markdown_output’, lc $args->{‘output’}); }

defined (my $str = $builder->build($ctx, $tokens) ) or return $ctx->error($builder->errstr); $str; # return value });

MT->add_text_filter(‘markdown’ => { label => ‘Markdown’, docs => ‘http://daringfireball.net/projects/markdown/’, on_format => sub { my $text = shift; my $ctx = shift;

extensões, incluindo eu, e foi então que chegamos à questão de montarmos uma rede com milhões de partes do Perl para serem distribuídas (CPAN).

E isso tudo foi feito no Perl 5. Você poderia adi-cionar texto como em um programa em C – você até podia incluir texto em Perl 4, mas isso não fun-cionava direito para modelos de interface, e isso a versão 5 tem. Não havia uma forma de fazer uma interface para níveis mais baixos como códigos em C e C++, então isso começou com Perl 5.

RiM: Enquanto você criava o Perl, que lingua-gens vocês tinha em mente?

LW: A maioria delas. Basicamente as linguagens com as quais eu era familiarizado – ou que eu pen-sava que fosse – foram as que me influenciaram. Algumas pessoas pensam que havia influência de linguagens como SmallTalk, mas não é verdade. Ao menos até o Perl 6 – agora, sim, teremos algu-ma influência do SmallTalk.

RiM: SmallTalk foi a primeira linguagem orientada a objetos, não é?

LW: Bom, você pode dizer que sim… Mas exis-tiam outras antes. SmallTalk realmente levou isso para um outro extremo, do ponto de vista que um objeto é algo para o qual você envia uma men-sagem, não apenas uma função de call engraça-dinha. Então, eles tinham uma visão mais global.

Mas não havia uma influência direta da SmallTalk, ao menos não até o Perl 6.

RiM: O Perl influenciou várias linguagens mais novas que têm sido muito usadas hoje, criando um paradigma para linguagens inter-pretadas. Como você enxerga isso?

LW: Com certeza Ruby e Python tiveram uma influência inicial do Perl. Na verdade isso não foi planejado no Python.

O Perl meio que estabeleceu, ao menos no mun-do do Unix, esse gênero de linguagens de script. Havia Shell – e você podia escrever em Shell Script – mas na verdade isso sempre foi pensado como uma forma de unir os programas em C. E porque elas eram construídas dessa forma? Era bem difícil de fazer um programa decente com elas. Era difícil fazer com que as coisas se relacionassem. E como todo mundo tinha um cliente Unix diferente, era bem difícil escrever um Shell Script naquela época.

RiM: E por que você resolveu escolher uma linguagem de script?

LW: Porque é muito mais rápido em termos de tempo de programação. Pode não rodar tão rapi-damente, mas para operações de chamada, fun-ciona rápido o suficiente.

Em alguns benchmarks uma linguagem de script poderia até bater um programa em C mais bobo porque você teria que trabalhar muito para otimi-zá-lo e o Perl já tem isso, então pode fazer um array associativo que provavelmente será mais eficiente que uma tabela feita em C. Assim, em operações comuns, é possível otimizar o código em C para o código em Perl.

O problema primordial que queríamos resolver era a perda de tempo dos programadores em ter que manter anotações de ponteiros, strings, arrays, gerenciamento de memória e tamanhos de buffer; as ferramentas do Unix, na época, tinham limites muito arbitrários.

Uma das maiores motivações para começar o Perl foi “eu quero que as strings me digam o que elas são”. Não há limites arbitrários aí. E nós levamos esse conceito para outras áreas também. Para começar, nós queríamos tipos de string que você simplesmente não precisasse se preocupar.

RiM: Quais são as maiores mudanças no Perl 6?

LW: Provavelmente a maior de todas é que fi-zemos o Perl ser poderoso o suficiente para se autocompilar. E eu espero que isso aconteça em qualquer VM. Já temos compiladores de Perl 6 para Mono e .Net, estamos trabalhando no Java. E existem algumas ideias para usar isso no LLVM.

Queremos que a linguagem seja poderosa o sufi-ciente para isso e o seja de forma eficiente, para quebrar a si mesma, para que possa mudar a lin-guagem quando decidirmos mudá-la, para ter no-vas versões de Perl e para ser capaz de escrever em outras linguagens de domínio específico que sejam melhores que o Perl.

As gramáticas inseridas no Perl 6 são poderosas e muito expansíveis. Provavelmente se você tiver que colocar uma única coisa no topo da lista, seria isso. Mas há muitas outras coisas que nós perce-bemos no Perl 5, e também várias outras coisas que adicionamos, como orientação a objetos, de forma que demos os princípios***, mas não for-necemos nenhum tipo de padrão, de boas prá-

11

Page 12: Revista iMasters #07

my $raw = 0; if (defined $ctx) { my $output = $ctx->stash(‘markdown_output’); if (defined $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; }, });

# If SmartyPants is loaded, add a combo Markdown/SmartyPants text filter: my $smartypants;

{ no warnings “once”; $smartypants = $MT::Template::Context::Global_filters{‘smarty_pants’}; }

if ($smartypants) { MT->add_text_filter(‘markdown_with_smartypants’ => { label => ‘Markdown With SmartyPants’, docs => ‘http://daringfireball.net/projects/markdown/’, on_format => sub { my $text = shift; my $ctx = shift; if (defined $ctx) { my $output = $ctx->stash(‘markdown_output’); if (defined $output && $output eq ‘html’) { $g_empty_element_suffix = “>”; } else { $g_empty_element_suffix = “ />”; } } $text = Markdown($text); $text = $smartypants->($text, ‘1’);

12 > Entrevista > Larry Wall

ticas. Então as pessoas fizeram as suas próprias regras. Foi um ótimo laboratório de testes, mas então existiam 30, 40 formas de escrever objetos e eles não se comunicavam, não trabalhavam um com o outro.

Gostamos da flexibilidade de ter esses labora-tórios para os princípios, mas no Perl 6, quando vemos que há muitas formas de se fazer algo no Perl 5, decidimos que vamos escolher uma des-sas formas como padrão. Continuaremos com os princípios, mas eles ficarão por baixo de uma camada de padrões, então teremos uma forma padrão de declarar classes, de incorporar classes abstratas, que chamamos “roles” genéricos, que são formas padrões de fazer várias cosias, que podem ser modificadas se você realmente quiser ou precisar, mas esperamos que os padrões aju-dem as pessoas a escreverem códigos melhores quase que por acidente.

Não vai ser preciso entender porquê aquele é o padrão, mas quando as pessoas tentam fazer suas coisas, na metade do tempo eles decidem pela forma errada... então não é que queremos chegar ao nível do Python, dizendo que há ape-nas uma forma de fazer aquilo, mas vamos tentar facilitar a forma correta, a melhor forma, para fazer aquilo, meio que por acidente.

Bom, eu meio que estou levando o processo do Python para o Perl 6. O modelo é realmente “pe-gar emprestado” o novo modelo de objetos de vá-rias fontes. E na verdade, trata-se de pegar direta-

mente da literatura de orientação a objetos, mais do que de alguma linguagem específica.

RiM: Você acha que seu background em lin-guística ajuda nisso?

LW: Acho que sim, mas muito além disso é o sen-timento de que uma linguagem de programação deve refletir a forma como falamos sobre isso, então se você quer falar que um objeto está re-lacionado (has a relationship) a um determinado atributo, você deve realmente usar o termo “have” para declarar isso no Perl 6. Se ele é um relaciona-mento (is a relationship) você usa o “is”.

É uma questão de sensibilidade linguística, então, ao invés de chamar coisas por outros nomes, usamos a construção que temos no Inglês. É algo mais natural do que usar palavras funcionais, como acontece em outras linguagens.

RiM: Mas isso muda muito a sintaxe da lin-guagem? O Perl 6 vai ser muito diferente? E como fica a retrocompatibilidade?

LW: Há um grande número de diferenças. No ge-ral, a sintaxe do Perl 6 é um super set do Perl 5. Se você escreve em Perl 5 e isso não funciona normalmente, vai estar bem perto de funcionar, porque você pode escrever em Perl 6 dentro do sub set que é muito parecido com Perl 5.

Não é exatamente a mesma coisa, mas o que fi-zemos no Perl 6 foi intencionalmente quebrar a re-

Imagem: http://bit.ly/1e6kJWY

Page 13: Revista iMasters #07

}, }); }}elsif (! $g_perl_module) {#### BBEdit/command-line text filter interface ########################### Needs to be hidden from MT (and Blosxom when running in static mode).

# We’re only using $blosxom::version once; tell Perl not to warn us: no warnings ‘once’; unless ( defined($blosxom::version) ) { use warnings;

#### Check for command-line switches: ################# my %cli_opts; eval {use Getopt::Long}; # don’t load in library mode Getopt::Long::Configure(‘pass_through’); GetOptions(\%cli_opts, ‘version’, ‘shortversion’, ‘html4tags’, ); if ($cli_opts{‘version’}) { # Version info print “\nThis is Markdown, version $VERSION.\n”; print “Copyright 2004 John Gruber\n”; print “http://daringfireball.net/projects/markdown/\n\n”; exit 0; } if ($cli_opts{‘shortversion’}) { # Just the version number string. print $VERSION; exit 0; } if ($cli_opts{‘html4tags’}) { # Use HTML tag style instead of XHTML $g_empty_element_suffix = “>”; }

#### Process incoming text: ########################### my $text; { local $/; # Slurp the whole file $text = <>;

trocompatibilidade. Queremos quebrar tudo o que for possível, essa foi a ideia inicial. Então, vamos precisar de alguma estratégia de migração, uma combinação de emulação, interpretação coopera-tiva ou tradução, por exemplo. Existem várias for-mas de fazer com que os códigos das versões 5 e 6 da linguagem interajam. Teremos aí um caminho.

Mas quando você começar a ver as novidades que o Perl 5 não suporta diretamente, então vai come-çar a usar a sintaxe, mas nós tentamos adicionar as novidades de uma maneira bem sistemática, de forma que todas as declarações sejam similares.

O Perl 6 tem muito mais sintaxe a ser declarada que o Perl 5, mas funciona de uma forma bem diferente. Na versão 5, você pode declarar as classes, mas tem que usar a palavra package. Você pode dizer que classes são pacotes, então usa a palavra package. Isso também acontece no Perl 6, uma classe é um pacote, mas você usa class. Então, em vez de ir para a palavra-chave do princípio, tendemos a distinguir a palavra-chave e então falar que uma classe é um tipo. Isso torna as coisas mais claras.

Ao mesmo tempo, muitas coisas que você faz ao executar código no Perl 5 parecem declarações no 6, mas na verdade não está rodando um có-digo por baixo, então quando você roda uma de-claração de classe, está na verdade fazendo uma chamada do protocolo do meta objeto enquanto compila, e pode até fazer um hook se quiser.

Portanto, você ainda tem toda a flexibilidade, mas nós a escondemos sob um nível de declaração. As-sim, há um mapeamento mais natural entre o que as pessoas pensam e o que a sintaxe se parece.

Nesse nível, é uma linguagem mais complicada, sintaticamente, mas em termos de conceito não é, porque exitem os mesmos conceitos.

Então, o estado da arte da programação em Perl 5 tem um conjunto de conceitos que se encon-tram muito bem no Perl 6, mas na nova versão eles estão mais bem elaborados, como em “aqui temos um 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?

LW: Bom, é claro que eu quero que Perl domine o mundo! Eu adoraria ver Perl 6 se tornar poderoso o suficiente de forma que o Google algum dia dis-

sesse “ah, nós não precisamos mais de Python ou algo assim”. Mas é claro que isso é um objetivo a longo prazo. E provavelmente nunca chegaremos lá, mas, ainda assim, é bom ter objetivos impossí-veis contanto você entenda que eles são impos-síveis. Eu quero continuar trabalhando neles de qualquer forma. Mesmo que você saiba que o que está fazendo irá, de alguma forma, falhar, você deve fazer tudo o que puder para isso. O mundo está cheio de coisas uteis que tiveram grandes fa-lhas e eu acho que Perl 6 vai ser muito útil!

Mas estamos realmente pensando no longo pra-zo. Desde que começamos, pensamos em fazer parte do progresso no início. Mas o Perl 5 estava reconhecidamente estável e tinha muito apoio da comunidade, o que nos permitiu gastar um bom tempo no redesenho.

RiM: Como é o relacionamento da comunida-de de desenvolvedores brasileiros com Perl?

LW: Os brasileiros são envolvidos com Perl há bas-tante tempo. Temos muita gente contribuindo com Perl 5 e 6 no Brasil. E os brasileiros têm a grande vantagem do fuso horário: vocês estão entre EUA e Europa, o que facilita muito o trabalho! </>

Entrevista publicada originalmente na Revista Espírito Livre

13

Page 14: Revista iMasters #07

A figura da cultura inventada das startups Por @vdepizzol

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.

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 empre-sas tentam vender. E pelo que dá para notar, funciona: até reportagem meia-boca da Glo-bo 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 so-bre 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 simplesmen-te… superficiais demais. Não dá para saber como é a cultura de uma empresa simples-mente olhando para essas coisas.

A cultura trata dos valores e os comporta-mentos 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 mos-tra de verdade quando as pessoas estão lá, focadas trabalhando: é sobre o que as impul-siona, 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 tam-bém, por que não, que a jornada de trabalho não seja infinita e que exista uma política de-finida 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 re-galias 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 profissionalmen-te 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. </>

14 > Conexão Vale do Silício

Page 15: Revista iMasters #07

15

Page 16: Revista iMasters #07

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 fer-ramentas de desenvolvimento evoluíram absurda-mente, 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 programa-dores. E essas tarefas são fundamentais para a boa operação de um banco de dados e, consequente-mente, de toda aplicação.

Neste artigo, eu comento sobre algumas posturas em relação ao uso de índices e os erros mais co-muns que são cometidos.

Perfis dos profissionais

Existem dois tipos de programadores que preocu-pam 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 re-solvem tomar “providências” sobre o assunto por conta própria.

Índices: equilibrando os pratos da balança

16 > Banco de Dados

Por @wcrivelini

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 im-portante definir chaves primárias em todas as ta-belas, 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 da-dos (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 regis-trada no log do banco e em seguida o registro será gravado nas páginas de dados dessa tabela. E só.

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?

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 vascu-lhar todas as páginas de dados para localizar esses registros. É como procurar uma palavra dentro de um livro inteiro.

Page 17: Revista iMasters #07

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 mui-to 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 re-comendá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 progra-mador 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 pessimis-tas que até subestimaram a eficiência do otimiza-dor de consultas do SGBD e definiram índices so-bre 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 ta-belas com centenas de milhões de registros que tinham tantos índices diferentes que os dados re-presentavam menos de 20% do espaço ocupado em disco... os outros 80% eram usados para ar-mazenar í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 da-dos 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 índi-ces que você definiu. Portanto, índices ruins certa-mente 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 pe-queno número de registros (e muitas vezes um úni-co 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 “com-primento” do índice, ou seja, a quantidade de cam-pos 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 tam-bé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: cam-po IDENTITY ou SEQUENCE) é um ótimo candi-dato a índice, considerando-se os aspectos téc-nicos. 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 (Bu-siness Intelligence).

Nesses casos, é muito provável que a chave candi-data seja uma chave muito longa e, eventualmente,

17

Page 18: Revista iMasters #07

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 essen-ciais de índices. A grande maioria dos SGBDs re-lacionais 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 an-teriormente. Cada tabela pode ter quantos índices não-clusterizados que se deseje criar.

Mas índices clusterizados funcionam de modo mui-to diferente. Em vez de criar um catálogo, esse ín-dice 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 deseja-da. Por essa razão, cada tabela pode ter no máxi-mo um índice clusterizado.

Por conta disso, todos os índices não-clusterizados de uma tabela criam catálogos baseados na orde-nação definida pelo índice clusterizado (caso ele exista). Sendo assim, é fundamental que o índice clusterizado da tabela seja de boa qualidade, por-que dele dependem todos os outros índices. Um bom índice clusterizado ajudará a melhorar perfor-mance 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 reorgani-zado. Essa é a famosa operação de REBUILD.

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 con-sulta baseando sua escolha nas estatísticas de uti-lizaçã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 ne-cessá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 (documen-tação) para conhecer melhor esse remédio. </>

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.

Page 19: Revista iMasters #07

19

Page 20: Revista iMasters #07

Nuvem Negraou, computação em nuvem

não são só floresPor @lufreitas

para Revista iMasters

20 > Capa

Page 21: Revista iMasters #07

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á dispo-nibilidade 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 em-presas, em todos os negócios online, o consu-mo de recursos é alto.

Maior a produção, maior a preocupação – e a ansiedade com questões importantes de segu-ranç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 es-tudo “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

21

O cloud computing veio para ficar. E é importante conhecer, também, o outro lado dessa história – dos impactos às falhas.

negócios em torno da Nuvem, Amazon, Ap-ple e Microsoft, se apoiam em fontes “sujas” de energia para abastecer suas estruturas. Yahoo! e Google lideram a inovação no se-tor, 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 com-prometeu a investir mais em energia limpa. O primeiro grande passo nessa direção foi dado com a construção de um novo data-center na Suécia, que pode ser totalmente abastecido com energia limpa.

3. A concentração dos datacenters em de-terminados locais (principalmente Estados Unidos) tem impacto significativo no consu-mo 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 cer-cam para fontes limpas de eletricidade.

4. A Akamai (akamai.com) usou, no ano passa-do, o padrão de Eficiência de Uso do Car-bono (Carbon Use Eficiency - CUE, em in-glê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 trans-parentes a respeito do consumo de seus da-tacenters e avaliam muito mal seu impacto ambiental.

6. As comunidades de hardware e software de-ram sinais de compartilhar, no ótimo formato open source, as melhores práticas para que os novos equipamentos e programas tenham projetos mais eficientes.

Page 22: Revista iMasters #07

22 > Capa

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

Page 23: Revista iMasters #07

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 tec-nologia como dos modelos de negócio. Mas a grande dificuldade é ter informações das empre-sas. Num ramo competitivo, em que os negóci-os 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 con-sumiu, 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 ino-var 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 ad-ministração eficiente dos dados, principalmente se o negócio tiver um lado na Nuvem. Já exis-tem 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 to-das 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 disponibili-dade e, no Brasil, com a infraestrutura da comu-nicaçã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 armaze-namento 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 fazen-do, 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 in-formaçã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: con-fidencialidade, 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 à confidenciali-dade (sigilo dos dados colocados na Nuvem). Antonio diz que nenhum sistema é seguro se não pensar nos três pilares juntos. “Disponi-bilidade significa: o provedor de serviços con-segue manter o serviço disponível 100% do tempo? As leis locais permitem o seu negócio? Haverá questões específicas de acesso à infor-maçã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

Page 24: Revista iMasters #07

24 > Capa

que frequentamos online. Basta coletar rapida-mente 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 vaza-mento maciço de dados do Facebook.

Se a Nuvem é flexível, ela também pode ser pri-vada. 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, tam-bém, o uso desses equipamentos (e das infor-mações da empresa) dentro e fora do trabalho.

Segundo Cezar Taurion, é preciso mudar o raci-ocínio da TI: “A própria consumerização gera a força necessária para a mudança de uma TI rígi-da 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 de-cisão e o eventual risco é nosso. Outra é arma-zenar 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 au-mento da produtividade. As pessoas estão cada vez mais interdependentes e conectadas, e tra-balham de forma colaborativa. Impedir isso im-plica baixar a eficiência das empresas.

Também é preciso entender que as informações internas são apenas um pequeno estrato do to-tal de informações que os funcionários e execu-tivos 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 ex-ternas, 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 ex-periências, necessidades pessoais e preferências de uso. O modelo “one size fits all” para as inter-faces propostas pelos modelos de aplicativos at-uais, tipo ERPs, terá que ser repensado. Provav-elmente 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.

Page 25: Revista iMasters #07

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 em-presa? 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 de-terminados países? Os usuários de Internet no Brasil vivem isso constantemente, com o Pan-dora, por exemplo. Comprar também é um mis-té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 servi-dores 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 gan-ha flexibilidade, extensão de poderes, arquivos sincronizados, sistemas que podem ser modu-lados de acordo com a necessidade. E precisa ter cuidado dobrado com os dados, a forma do tráfego, o gerenciamento de TI. Sejam bem-vindos 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. </>

Page 26: Revista iMasters #07

Garantindo a acessibilidade do seu websitePor @reinaldoferraz

Escreva um código semântico

Durante o processo de elaboração da arquitetura de informação e wireframes, identifique os ele-mentos que têm significado em sua página (ca-beç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 ele-mentos <section> e <article>, rodapés viram <footer>, e assim por diante. É muito mais inteli-gível para a máquina identificar elementos com sig-nificado 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 corre-tamente 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 pro-blema de acessibilidade também, o que é uma

26 > Por dentro da W3C

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 declara-do. 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 au-xiliam a resolver de forma adequada e efetiva. Por isso mesmo, a validação automática é um fator im-portante na verificação da acessibilidade do código. A WAI, iniciativa de acessibilidade do W3C, disponi-biliza em seu site uma lista de validadores que po-dem 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 do-cumentaçõ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 Ac-cess 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 iden-tificar certos pontos específicos de acessibilidade. Imagine uma página com uma foto do Cristo Re-dentor. Se o atributo alt não for declarado nessa

Page 27: Revista iMasters #07

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

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=”&nbsp;” 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 pon-tos 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 acessibili-dade, é 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 avi-sos (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 na-vegar por níveis de cabeçalhos). Existem softwares leitores de tela gratuitos ou com período limitado para testes, para os mais diversos sistemas ope-racionais. A navegação por teclado é valiosa para identificar possíveis barreiras que possam ser aces-sí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 cuidar-mos 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 pro-jeto web, permitimos que pessoas com deficiência tenham cada vez mais autonomia na web. Essa auto-nomia é revertida em novos usuários e consumidores.

Além de beneficiar o acesso de pessoas com defi-ciê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 diver-sos dispositivos e a adição de elementos e informa-ções que beneficiam SEO (Search engine optimiza-tion), entre muitos outros. </>

Page 28: Revista iMasters #07

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á mui-tos 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 é co-nhecido 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 proje-tos DIY mais populares da Make Magazine, além de presidente e CEO da empresa Cornfield Electronics.

Mitch Altman e a origem dos hackerspaces

28 > Cultura Hacker

Por @carineroos

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 Ha-ckers (http://matehackers.org/), hackerspace de Porto Alegre, em 28 de junho, e posteriormente no Garoa Hacker Clube (https://garoa.net.br), ha-ckerspace de São Paulo, em 30 de junho. Partici-pei 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 ím-pares, 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 cen-tro 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 é

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

Page 29: Revista iMasters #07

29

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 Compu-ter Club desde 1999, que reúne hackers do mundo todo acampados com acesso à Internet para discu-tirem 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 tem-porariamente 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 Ha-cktory, na Filadélfia, e o HacDC, em Washington, DC. Durante os anos seguintes, estes serviram de inspiração para o surgimento de centenas de ou-tros espaços similares, não só nos EUA, mas tam-bém em iniciativas como o Garoa Hacker Clube, no Brasil. Outro incentivo que fortaleceu esses es-paç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-

Foto de Nicohofmann/ Chaos Communication Camp 2011 Laser Show

Page 30: Revista iMasters #07

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 segu-rança, hardware, eletrônica, software e robótica, o Chaos Computer Club tem como objetivos princi-pais a liberdade de acesso à informação, a liberda-de 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 Da-tenschleuder” (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 im-pressõ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 permis-são, isto é, você não tem que pedir permissão para fazer as coisas, o mote é “faça primeiro e pergun-te 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 pos-sível. Sendo assim, o clube tem uma única condu-ta: “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 pes-soas, 51 votam por algo que acaba desagradando as outras 49. Por meio da adoção do consenso, nin-guém fica infeliz. Entretanto, a prática da decisão por consenso acaba sendo bastante conservadora, fa-zendo com que as coisas evoluam mais lentamente. Como forma de contrabalancear isso, é utilizado o conceito de doocracy (façocracia), no qual uma pes-soa pode tomar a iniciativa de fazer algo por conta própria sem precisar alcançar consenso formal, des-de que se tenha em mente a única regra de convívio: “Be excelent to each other!”.

Hackerspaces podem ser vistos como uma ressig-nificaçã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 ferro-modelos, 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 ter-mos, entre eles, “hack”.

Como exemplo do que pode ser considerado a essência do hacking (o entendimento tão profun-do sobre o funcionamento de um sistema a pon-to 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 fer-romodelo 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ógi-ca, 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 ha-ckerspaces é genuinamente análogo a esses clu-bes, com a diferença de que hoje a tecnologia é mais sofisticada e há com certeza muito mais su-cata 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.

Page 31: Revista iMasters #07
Page 32: Revista iMasters #07

32 > CMS

sem limites: desenvolvimento inusitado

com a plataformaPor @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)

Page 33: Revista iMasters #07

33

10 anos. 18,9% de participação de merca-do. 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 blo-queio e às limitação das mentes daqueles que desenvolvem para WordPress. A princi-pal 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 mar-cante 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 ins-piraçõ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 dispo-sição. Vejo como um grande avanço e uma vontade de ir além inclusive com o tema pa-drão, afinal ele é o primeiro contato de muitos ao fazer uso do WordPress. É importante dei-xar 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 é co-mum entre eles e uma convite sem igual para ir além e pensar fora da caixa.

Essa ideia de uma tela branca é muito empol-gante se pensarmos que, através dela, pode-mos 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 ga-rante 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 pon-tos. A estrutura do WordPress trabalha para lhe entregar uma marcação HTML semântica e bem estruturada. A estilização dessa estru-tura através do CSS fica por conta do artista, você. Da mesma forma para os comporta-mentos desejados através do JavaScript. Não há motivos para se limitar. Lembre-se do pro-jeto 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 pratica-mente 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-

Page 34: Revista iMasters #07

cionada à quantidade que foram adicionados aos últimos releases. Perceba também que as novas versões já têm pouco espaço para no-vas 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 con-ceito de dado e metadado relacionado é po-deroso. 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á ve-mos 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 desenvolve-dores 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 ex-istentes 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 últi-ma considerando a data de escrita deste artigo (julho/2013), é a mais utilizada, representando 39,1% de uso. A versão 5 do PHP está pre-sente 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 desenvol-va 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 pa-drã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. [email protected]

34 > CMS

Page 35: Revista iMasters #07

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

Existe uma experiência chamada Teste de Aten-ção Seletiva (quem não conhece dê uma olhada aqui:  http://youtu.be/vJG698U2Mvo). Resumin-do, é um teste para mostrar que, quando você está focado em algo, é capaz de não ver coisas que es-tã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. En-quanto 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: pen-sem em quanto milhares de dólares são gastos por ano para se obter baterias mais duráveis, mais “ver-des”, menores e mais flexíveis. Há indústrias gigan-tescas 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 in-diana de 18 anos inventou uma maneira de recar-regar 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 assun-to: http://migre.me/f9Ugh

E pra saber por quê, lembre-se do Gorila. Estavam todos olhando para o mesmo lado, ninguém pen-sando em como recarregar mais rápido, todos pen-sando em como fazer durar mais.

Essa menina de 18 anos acabou de mudar o mun-do 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 pen-sar sobre isso e a achar os Gorilas.

Então, fica aqui uma proposta: foca no Gorila! :)

BancosQuanto 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

+Interatividade > 35

Page 36: Revista iMasters #07

Quando se fala de  Front-End, existe uma assimi-lação direta com três disciplinas, por assim dizer: HTML, CSS e JavaScript. Em uma visão bem pes-soal, 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 infor-maçã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 con-correntes 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 har-dware (Node Copter, Johnny-Five e outros) - vem aproximando cada vez mais os mundos que, an-tes, eram relativamente distantes. Como consequ-ência, novas disciplinas ou ramificações acabam surgindo naturalmente.

Uma destas disciplinas que tenho dedicado al-gum 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.

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

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

36 > Front-End

Por @danielfilho

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 “rei-nicializar 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 progra-mação, também ambientes de operações.

Front-End OpsDesenvolvedores Front-End também são desenvol-vedores, 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 desenvol-vedorFront-End. Dentre todas que existem, as que mais utilizo são Vagrant, GruntJS e Capistrano.

VagrantImagine 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 to-dos os ambientes necessários para o desenvol-vimento.

Page 37: Revista iMasters #07

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

GruntJSAgora, 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, sem-pre 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:

37

$ grunt dev

$ cap deploy

$ cap deploy:rollback

$ grunt prod

Ou:

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?

CapistranoE 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 inteligen-te e, se por acaso subir algo errado no ar, pode fazer rollback do deploy em questão de segundos. Isso mesmo, SEGUNDOS.

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).

Você configura sistema de versionamento, bran-ches, 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:

E se algo der errado, voltar apenas com um:

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 ter-mo OPS e, mais especificamente, Front-End Ops, você está preparado para seguir com esta série so-bre 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 pro-fissional.

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. [email protected]

Page 38: Revista iMasters #07

Use design para melhorar seu código

38 > Design

Por @pedrozath

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 aparen-temente paradoxal, pois como poderia algo estéti-co 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çãoTrabalhar 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 bus-car estes approaches. Estes não vem diretamente do design, mas convém serem citados:

Variáveis clarasProcure 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 distrativosClaro, todo desenvolvedor já teve aquele proje-to 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 lin-guagem que se preza tem alguma forma de se in-cluir 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á mui-to 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

Existem muitos tipos de de-sign, como o de produto, o de interiores ou ainda o de inter-faces, mas se existe uma ca-racterí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 aprimora-mento 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 puramen-te funcional.

Todavia, programar infelizmente ainda é uma skill para poucos, mas ainda assim, há de se pen-sar no conforto que um ser hu-mano virá a ter ao ler determi-nado código, pois a atividade de desenvolvimento se torna cada vez mais social, por assim dizer, o que significa que aquilo de al-guma forma terá de ser entendi-do por outros.

Page 39: Revista iMasters #07

39

o código final em si, ora referida por renderização, ora por compilação. Enquanto muitos desenvol-vedores 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 de-safio 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>

doctype html html head title Meu em HTML5 body h1 | Bem vindo ao meu site

!!!

%html

%head

%title Meu site em HTML5

%body

%h1

Bem vindo ao meu site

<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>

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.

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 dis-so, 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:

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 inconsist-ente. 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

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

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:

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 flexibi-lidade na quantidade de caracteres de indentação. Ou seja, se você é um cara esquisito e gosta de in-dentar 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:

Em HTML, seria algo como:

Page 40: Revista iMasters #07

Essa intrusão das tags de HTML no meio texto o tornam chato e desumano de ler. Para tal, foi criado o Markdown:

40 > Design

# 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.

C1 | C2 | C3 |--|--|--| C4 | C5 | C6 |

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: -webkit- gradient(linear, left top, left

// 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;

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 ain-da o Markdown, adicionando, por exemplo, tabelas:

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

CSSReflita sobre o código à seguir:

bottom, color-stop(0%,#02a420), color-stop(100%, #ff4422)); background-image: -webkit-linear- gradient(#02a420, #ff4422); background-image: linear- gradient(#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 enten-dido, 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 ex-emplo um if pode conter outros ifs subsequentes. Nesse conceito, entra o SASS (Syntactically Awe-some Stylesheets), introduzindo também os mix-ins 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:

Page 41: Revista iMasters #07

Pedro Maciel trabalha com web design, motion graphic design, desenvolve em Ruby on Rails e escreve sobre tudo isso no impulso.hiperativo.co - [email protected]

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(linear- gradient($preto, %vermelho)); } } +mobile { color: $preto; font: 12px/1.4 Helvetica; } }

// 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(linear- gradient($preto,

Note que, com isso, foi possível introduzir a me-dia query dentro do seletor em vez de fora, o que facilita enormemente a criação de sites respon-sivos. Ao ser compilado, o CSS terá a media query colocada no final do documento, complet-amente nos padrões da W3C.

Agora vamos reduzir o nível de distração:

%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 nen-hum tipo de caractere inicial, fazendo-se passar por atributos de CSS completamente normais.

Conclusões geraisOutra vantagem de se usar esses template han-dlers - uma camada na sua aplicação que vai tra-duzir 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, depen-dendo do seu setup, eles podem encodar carac-teres 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. </>

41

Page 42: Revista iMasters #07

Qual é a capacidade do seu time de tecnologia?

42 > Gerência de TI

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 pon-tos 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.

Page 43: Revista iMasters #07

43

Então você diz que pode entregar?Um time de tecnologia é tão bom quanto sua capacidade de, progressivamente, en-tregar um produto. No que isso leva?

Primeiro, vamos falar sobre programação de software. A forma mais rápida de en-tender as qualidades do seu time é prova-velmente olhando para as práticas dele. Há, é claro, o básico:

• Todas as peças do código estão (inclu-sive a base de dados e o código de in-fraestrutura) fazendo uso de algum con-trole de versão?

• Eles escrevem testes de integração/uni-tá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 re-visado, 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 proces-so 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 cama-das, 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 impli-caçõ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 desem-penho/carga/estresse como parte do fluxo de desenvolvimento? E quanto a testes de invasão?

Mas, espere, ainda há mais. Note que qua-lifiquei “habilidade de entregar” com “pro-gressivamente”. Isso foi intencional porque o time deve manter o custo das mudanças baixo e constante. Em outras palavras, de-senvolver rapidamente às custas de uma perda do lado técnico, sem se preocupar jamais com ele, não costuma ser uma es-tratégia muito sustentável.

Para isso, você deve procurar pela cultura de desenvolvimento e por sinais de bom di-recionamento da base de código.

• Com qual frequência é feito “refactoring”?

• Há uma comissão de resolução de proble-mas 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 im-portância para a correção de bugs quan-to 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 moni-toramento de defeitos que alerta o time proativamente?

E, finalmente, precisamos considerar como o software está sendo de fato entre-gue aos clientes.

Page 44: Revista iMasters #07

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.

Alta tecnologiaSer capaz de entregar um grande produto é crucial para qualquer time de tecnologia. De qualquer maneira, para alguns, isso tal-vez não seja o suficiente. Dependendo da área de negócios em que você estiver, tal-vez 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 nor-malmente “no jardim” dos desenvolvedores da sua empresa (mesmo entre os gran-des). Isso inclui especialistas em semân-tica, aprendizado de máquina, NLP (pro-gramaçã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 pre-cisa de tais especializações, mas alguns necessitam. E, para esses times, essas ca-pacidades adicionais certamente precisam de um destaque.

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 origi-nalmente em http://bit.ly/1b9GJk8

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.

Page 45: Revista iMasters #07
Page 46: Revista iMasters #07

46 > Comunidades

Interação a favor dos negócios: IxDA-SPPor @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 comu-nidades e organizações de Arquitetura da Informação ou Usabilidade. Eles não cobram por associação, mas pedem contribuições de cada indi-ví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.

Page 47: Revista iMasters #07

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, in-terações vestíveis, o mundo reconheceu que havia horizonte profissional além de Estados Unidos e Eu-ropa. 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 em-presas brasileiras ou montar seus negócios por aqui”. Resultado: a comunidade de design de inte-raçã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 Sou-th 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, se-gundo Amyris Fernandez, reúne cerca de duzen-tas 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 cen-tradas na questão da interface entre humanos e computador”, explica a profissional. A ideia é pen-sar em como o negócio funciona, sempre atento aos resultados práticos. Amyris tem uma definição interessante da função: “trabalhamos para aumen-tar 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 comuni-dade como puder: trabalhos acadêmicos, volunta-riado, organização de encontros.

No IxDA-SP, o foco é a divulgação da prática, edu-cação do mercado, educação acadêmica de indiví-duos e de criar uma relação saudável com os pro-fissionais, independentemente de formação e cargo.

O desafio, hoje e sempre, é criar parâmetros para o surgimento de uma nova disciplina, o design de in-teraçã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 inte-raction design, uma área mais ampla que a ques-tã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 manu-tençã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 es-timular a profissão. </>

Page 48: Revista iMasters #07

TI na propulsão do marketingPor @cgalls

48 > Marketing Digital

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

Page 49: Revista iMasters #07

49

Desde o tempo de faculdade, sempre que surgia o assunto entre familiares e amigos, gastava sa-liva 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 atro-fiou diversos cérebros que temiam “fazer con-tas” e dedicavam-se à inspiração de criar tex-tos 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íti-co, o gestor e de processos. E quem está po-tencializando esse surgimento é a TI.

O marketing em sua essência

A inovação tecnológica tem nos permitido apro-ximar 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, con-siderando 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 ima-ginaríamos. E, com isso, conseguir estabelecer diálogos que nos remetem à ideia original do re-lacionamento ideal para atender a necessidades.

A essência do marketing pode ser representa-da pelos negócios de bairro, nos quais o nego-ciante conhecia detalhadamente a clientela, sua história e seus hábitos. Isso permitia a criação de uma relação inspiradora entre cliente e co-merciante. 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 ob-tenção precisa de dados e a capacidade de comunicação personalizada. O que faltava, de fato, eram ferramentas tecnológicas para traba-lhar a informação.

A TI e suas soluções maravilhosas

Tímida, a TI surge sob os olhos atentos do dire-tor financeiro, a quem se reportava inicialmente por ser algo novo, de custos elevados e sem um valor comprovado. No entanto, rapidamen-te 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 emer-gentes como o Big Data, o cloud computing, as redes sociais, a automação de marketing, cro-wdsourcing e tantas outras.

A TI aplicada a antigos conceitos de relações humanas criou as redes sociais. Com isso, mu-dou-se a forma de como acessar a informação, partilhar e engajar. As empresas e suas equi-pes 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, mui-tas 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 evi-tar que crises se alastrem e saiam do controle. Demanda-se velocidade.

A análise de dados não é novidade para o marke-ting, 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

Page 50: Revista iMasters #07

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, en-tã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 marke-ting, a principal estratégia de campanha de ma-rketing há cinco anos era de “comunicação per-sonalizada”. Hoje, são “ofertas personalizadas”. Sutil, porém com grande significado – “oferta” exige entender necessidades.

Adequadamente utilizado, o Big Data permiti-rá 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á clara-mente 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 sur-gindo com imponência nos primos norte-ameri-canos soluções de Automação de Marketing que prometem agilizar processos, assim como os CRMs e os ERPs fazem há anos. Estão contem-pladas 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 opor-tunidades 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 qual-quer outra variável. Demanda-se produtividade.

Da mesma forma, temas como cloud compu-ting, impressão 3D e os meios eletrônicos têm nos permitido entender, testar e executar abor-dagens 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 es-cala 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 es-teja em seu raio de ação, fora da zona de con-forto. A dinâmica impressa por esses ciclos tec-noló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 re-tornos 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 equi-líbrio – que representa o melhor estado de produ-tividade. Todos estão passando por essa mesma etapa, e o grande desafio do profissional de ma-rketing é assumir seu lado analítico e metódico sem nunca perder a sua capacidade inata de co-municaçã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.

Page 51: Revista iMasters #07

Código Livre > 51

Informações e dicas sobre projetos Open Source

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

Por @ale_borba

Pomodoro Extension for Gnome

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/

Radar ParlamentarUm 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

VindulaSistema 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

Para onde foi o meu dinheiro?

É um projeto feito em Perl que tem como finali-dade 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

AudioLazyUm projeto escrito totalmente em Python, que permite o processamento linear, não linear, va-riante 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/dani-lobellini/audiolazy </>

Page 52: Revista iMasters #07

ePUB3: publicações multimídia interativasPor @fabioflat

52 > Conteúdo Digital

Em um mercado onde inúmeros players brigam pela primazia de estabelecer novos formatos e no-vas soluções, aqueles baseados em padrões aber-tos, 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 interativi-dade nos livros digitais.

Como uma especificação oficial do IDPF (Interna-tional Digital Publishing Forum) desde outubro de 2011, o ePUB3 é o formato padrão para a distri-buição de publicações e documentos digitais. Ele padroniza a codificação e o empacotamento de conteúdo Web estruturado semanticamente, per-mitindo a integração de documentos HTML5, CSS, SVG, XML e JavaScript, entre outros, em um for-mato de arquivo único.

É compatível (em alguns casos ainda parcialmen-te) 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.

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:

Semântica

• O uso dos novos elementos <section> <footer> <article> <header> e <aside> aproxima o mundo editorial da Web, pois são ter-mos de fácil compreensão para autores e editores.

• A construção do TOC (table of contents) do li-vro é 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 infle-xões semânticas que são associadas a um vocabulário específico (EPUB 3 Structural Se-mantics Vocabulary).

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 represen-tar fórmulas e símbolos matemáticos.

A estrutura do ePUB3

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

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

• EpUB Content Documents 3.0: Define as par-ticularidades dos formatos HTML5, SVG e CSS para uso dentro de publicações no formato ePUB.

• EpUB Open Container format (OCf) 3.0: De-fine 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-

Page 53: Revista iMasters #07

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

53

cumento de extensão XHTML, mas na prática ren-derizado 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 estrutu-raçã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 gra-tuitamente 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 for-matos que orbitam ao redor do HTML5, ela permi-te soluções que dão uma nova vida ao conteúdo: plasticidade, organicidade, modularidade, interativi-dade e ubiquidade.

mimetype // application/epub+zip

OEBPS

cap1.xhtml // conteúdo do livro - XHTML5cap2.xhtml // conteúdo do livro - XHTML5cap3.xhtml // conteúdo do livro - XHTML5content.opf // lista e descreve o conteúdo - XMLcover.xhtml // capa do livro - XHTML5nav.xhtml // navegação do livro a partir do sumário (TOC) - XHTML5toc.ncx // arquivo de navegação compatível com a versão ePUB2

META_INF

container.xml // é o arquivo que agrupa todo pacote - XML

ePUB3

áudio

css

fontes

imagens

scripts

vídeo

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).

Leia o livro, ouça o livro, converse com o livro, rabis-que 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 mui-tas 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 </>

Page 54: Revista iMasters #07

O imposto do XMLClécio Bachini - 7masters Open Data

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

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.

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

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 é me-nos pior, mas ainda grave. Se pensarmos em vários níveis hierárquicos em árvore, é de arrepiar. Quem já fez parse em XML sabe.

Incentivar o governo a usar XML é antiecológi-co. Às vezes, tudo o que precisamos é de bons dados em tabelas e um dicionário de dados sim-ples. Viva à simplicidade!

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

<otorrinolaringologista> Jacinto Drama Aquino Bairro </otorrinolaringologista>

54 > Encontro 7Masters

Pra que fazer uma visualização de dados? Jonas Abreu - 7masters Open Data

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

Page 55: Revista iMasters #07

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

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 à criativi-dade 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 tecnolo-gias que concebem a web.

Dentro da Open Web, a presença da acessibilidade

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 [email protected] 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.

55

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 visuali-zaçã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 en-tendem respostas. Com isso, você reduz a chance

de criar mais uma visualização que fica abandona-da, porque não é útil para ninguém.

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

Page 56: Revista iMasters #07

O impacto da personalização de informações em serviços online nos usuáriosCarine 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 imper-ceptí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, visuali-zamos com menor frequência em nossa timeline informações de perfis que potencialmente teriam opiniões contrárias às nossas ou que apresenta-riam um novo ponto de vista.

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ási-ca 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. Ac-cess by everyone regardless of disability is an es-sential aspect”.

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

O Facebook não é a única plataforma que está fa-zendo com que ocorra essa invisibilidade das in-formaçõ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, ende-reç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 bo-lha”. E esse filtro bolha é o nosso único universo de informação. Ou seja, o que está dentro dele de-pende 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 expe-riência do usuário, ela também levanta preocupa-ções quanto à questão da privacidade, especifica-mente 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 resul-tados de busca contêm diferenças devido às per-

Page 57: Revista iMasters #07

Para que serve uma web aberta? kemel Zaidan – 7masters Open Web

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

57

vedores e pessoas comuns deveriam preocupar-se em garantir uma web aberta?

Na tentativa de responder a esta pergunta, de-vemos parar por um momento e pensar nas pro-fundas 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 huma-nidade 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 definitiva-mente em realidade, devemos manter a web aber-ta, 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 ou-tra 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 an-teriores: passiva, receptiva e de simples consumo.

Garantir uma web aberta é garantir que as pessoas tenham acesso à informação, educação, cidada-nia, cultura, conhecimento, dignidade e renda.

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

Fonticons e SVG Richard Duchatsch - 7masters Open Web

Quando falamos em performance, o que mais te-mos que levar em consideração é a quantidade e

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 Star-tPage, 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

Page 58: Revista iMasters #07

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 fos-se 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á organiza-do. 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 ar-quivo de fontes tipográficas “hackeado”, no qual em vez de caracteres alfabéticos e numéricos são

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 fall-backs de extensões (.ttf, .woff, .svg, .eot).

Além disto os Font Icons têm um truque na man-ga: 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 ar-quivos pesados, e por fazer o cross-browser, pre-cisam fazer arquivos extras. Em conta partida, há casos de uso de dataURIs para resolver este pro-blema 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 base-ados 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, exis-tem 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-

58 > Encontro 7Masters

Page 59: Revista iMasters #07

Radar ParlamentarDiego Rabatone Oliveira - 7masters Open Data

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 cur-sos e pessoas de fora da universidade.

Inicialmente, a Câmara dos Deputados disponibili-zava 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

59

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, par-tido 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, tor-nando as análises impraticáveis.

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 determina-da 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 aces-so aos arquivos XML pode ser feito por meio de endereços web (URL) que utilizam parâmetros que permitem que estes mesmos programas de com-putador possam buscar os arquivos que forem ne-cessários de forma automatizada. Com essas duas características, dos formatos processáveis e do acesso automatizado, é possível criar um progra-ma de computador que faça análises e avaliações de grandes volumes de dados.

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

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 da-taURIs, 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

• http://bit.ly/OreEgu

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

Page 60: Revista iMasters #07

os dados disponibilizados ele optou por utilizar os das votações da casa para gerar índices de similari-dade 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 se-melhantes 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, com-parando-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 de-senvolvimento 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 conheci-mentos 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 conhe-cimentos 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 </>

60 > Encontro 7Masters

Page 61: Revista iMasters #07
Page 62: Revista iMasters #07

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

62 > 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 pro-funda e percebi uma lacuna nos dados: quanto o atendimento telefônico realmente impacta e o quanto ele assiste a outras fontes de tráfego?

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, utili-zarei 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 cancela-mento, 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 co-branç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”.

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.

URL/?utm_source=SOURCE&utm_medium=MEDIUM&utm_term=TERM&utm_content=CONTENT&utm_campaign=NAME

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 = 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 se-rão -> CALL-RECEP, CALL-ATIV, CALL-RET, CALL-COB

Page 63: Revista iMasters #07

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 acom-panhamentos por origem de tráfego, campanhas, conforme a imagem abaixo:

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

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. Pode-mos utilizar os segmentos avançados e principal-mente a ferramenta de multicanal, que nos propor-ciona 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 multica-nais, 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.

Nas próximas edições, vou continuar o assunto, indo mais a fundo na ferramenta multicanal e de-mais 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 - [email protected]

Page 64: Revista iMasters #07

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 colo-car 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 pre-cisar tirar o celular do bolso.

Veja algumas considerações sobre o Google Glass.

Page 65: Revista iMasters #07

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. ;)

Vídeo: apesar de não ser uma resolução mui-to 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.

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 conta-tos/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.

API: utiliza REST e é muito bem documentada! Uma pena não estar disponível para qualquer desenvolvedor (apenas os usuários que adqui-riram 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 pessoal-mente acredito no potencial do Glass. Se você comparar com todos os dispositivos vestíveis no mercado, como Nike FuelBand, FitBit, Ja-wbone UP etc., vai perceber que o Glass foi um avanço em design e funcionalidade. Até o momento, não vi nenhum dispositivo que pos-sa 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 rela-cionamos 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-

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 apren-der “na marra” uma nova tecnologia?

Do ponto de vista de desenvolvedor, a maioria das pessoas que perguntei sobre o que estão fazendo com o Glass respondeu que só parti-ciparam 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 disposi-tivo 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.

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 tes-tes (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 dis-positivo e quando ele estará disponível para o resto do mundo. </>

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

Page 66: Revista iMasters #07

“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 pro-vavelmente deve ter feito várias.

Já a história da cadeira elétrica é bem mais recen-te. 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 ameri-cano 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 tec-noló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 cien-tífico aplicado na produção de cadeiras, desde a escolha e pesquisa da madeira e materiais ade-quados, 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 com-putador, a interface gráfica, a Internet, as redes sociais e, também, o motivo deste texto, a fabri-caçã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 realida-de, o conceito é um pouco mais robusto e abarca todo um novo tipo de produção que usa ferramen-tas controladas por computador para transformar

66 > Criatividade Tecnológica

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 proje-to para ferramenta do projeto com o advento das ferramentas CAM (computer-aided manufacturing), incluindo as instruções para as máquinas de Com-puter Numerical Control (CNC). Essas máquinas recebem uma informação numérica a partir do ar-quivo 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 con-ta 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 ge-ral, 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 escolhi-da, se aditiva ou substrativa, é possível construir uma cadeira a partir de um modelo 3D feito no computador. Aliás, esse modelo pode ser elabora-do à mão por designers e engenheiros ou também

Page 67: Revista iMasters #07

67

pode contar com a ajuda de um processo conhe-cido como 3D scanner. Nesse caso, o modelo é construído a partir de imagens tomadas do obje-to 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? Se-gundo Gershenfeld, em seu artigo Foreign Affairs (2012), a inovação está na capacidade de trans-formar dados em coisas e as coisas em dados. É possível deter novamente os conhecimentos da fabricação de uma cadeira, é possível produzir ca-deiras em menor escala e de modo mais persona-lizado 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 recapaci-tação e do fortalecimento de criadores e produto-res 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 ge-ral 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

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

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 pro-jeto. 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 exoesque-leto 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 apon-tam 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 no-vas tecnologias democratizadas mudaram o mun-do: 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 pes-soal é “Faça você mesmo”. Impressoras 3D e redes sociais virtuais de comunicação e compartilhamen-to 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. - [email protected]

Folding Chair and Ottoman, por Brainstream

Page 68: Revista iMasters #07

É um sistema de gestão de conteúdo de código aberto. A ferramenta é segura, maleável e escalável, possui seções com-pletamente customizadas e pode ser usada para o desenvolvimen-to 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 per-mite a criação de websites espe-cíficos para projetos, clientes ou fornecedores, com permissões de acesso e funcionalidades cus-tomizadas. As extensões podem ser instaladas diretamente de seu painel de administração.

http://ow.ly/mUGXl

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 aplicati-vos e funcionalidades que de-seje utilizar dentre as soluções da suíte Zoho (ferramenta para CRM, recrutamento, gestão de projetos, organização de reu-niões, compartilhamento de documentos, criação de apli-cativos e várias outras) e incor-porá-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.

http://ow.ly/mUGJf

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

http://ow.ly/mUGZ9

MODx RevolutionZoho Wiki Gliffy

iMasters BoxSeleção: João Antônio - [email protected] - envie suas sugestões de ferramentas!

68 > iMasters Box

Page 69: Revista iMasters #07

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

Oferece um incrível controle de containers, migrations para ban-cos 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

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.

http://ow.ly/mUH0Z

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 desen-volvedores e usuários. Ele geren-cia arquivos e diretórios ao longo do tempo. Esses arquivos ficam armazenados em um repositório central sob o cuidado desse sis-tema. 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 anti-gas dos seus dados, examinar o histórico para saber que modifica-ções foram feitas ou ainda, quem executou a alteração.

http://ow.ly/mUH4n

LaravelMySQL Workbench Subversion

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!

69

Page 70: Revista iMasters #07
Page 71: Revista iMasters #07
Page 72: Revista iMasters #07