por Gabriel Oro
Ilustrações por Henrique Ibaldo
Se você já trabalhou com projetos que envolvem tecnologia, vai entender. Aquela reunião de sempre com um fornecedor, um criativo, gerente de projetos ou executivo de contas. Tudo indo bem, quando de repente parece que há algo estranho, perguntas evitadas ou refletidas, comentários um pouco desconexos, piadinhas pra fugir do assunto. E é aí você se dá conta: aquele infeliz não tem a menor ideia do que está falando. Se você trabalha com projetos digitais a um certo tempo, é bem provável que já tenha passado por isso. Se trabalha mas nunca passou, bem… não há maneira delicada de dizer isso, mas é possível que seja você o sujeito em questão.
A tecnologia e o acesso à informação evoluíram muito rápido nos últimos anos, o que faz com que pessoas que não estejam ativamente buscando conhecimento numa área tão dinâmica quanto a produção digital acabem não conseguindo tempo pra aprender tudo o que é necessário e dominar o assunto. Na cultura corporativa, onde admitir a própria ignorância sobre um assunto é visto como um sacrilégio, as pessoas muitas vezes escolhem esconder suas inseguranças e perdem uma chance de aprender coisas novas. Sem perguntar, fica se sentindo um idiota.
Pois não se sinta mais. Vamos guardar a nossa idiotice para coisas mais importantes. Conheça
O que vamos fazer aqui é apenas abordar alguns assuntos básicos que são muitas vezes ignorados, e cuja compreensão dos mesmos isoladamente deve ajudar muito o seu entendimento sobre internet e tecnologia como um todo. Este guia deve ser útil a qualquer profissional da área, web designers, redatores, produtores de conteúdo, donos de agências e jovens padawans.
Desde que Turing começou com essa brincadeira toda de computadores, as linguagens de programação sempre pareceram algo bastante complexo para o público geral. No começo eram só 0s e 1s e rodas girando e aquela coisa toda. Se quiser saber mais sobre a parte histórica da coisa, pode ver o filme The Imitation Game, no qual o Benedict Cumberbitches conta a triste história de Alan Turing e sua jornada criando computadores de guerra para Tywin Lannister. Ou alguma coisa assim.
Vamos às dicas básicas que vão dar uma base sólida no caminho para ser um especialista no assunto:
Você sabe o que é, mas… você SABE o que é? Um website é basicamente apenas um documento de texto hospedado em um domínio na internet. Esse texto contém instruções de formatação escritas em uma linguagem própria (html e suas variações) que são interpretadas por um navegador e transmitidas pelo protocolo de transferência de hipertexto (http). Ou seja: instruções escritas em html, que o sistema (o seu navegador de internet) lê e interpreta como as funções do site.
E o que você tem que saber sobre isso tudo? HTML é o que faz um site funcionar, links, funções, diferentes páginas e etc. Mas sozinho não faz um site bonito, pra isso você precisa de um CSS. O HTML é o interior de um site, o CSS é a forma exterior, é o que permite que os sites sejam diferentes, tenham elementos personalizados e uma identidade visual complexa. Sabe quando você clica em um link e a página não carrega direito, os botões e imagens desconfiguram e você só vê um monte de textos em um fundo branco? Isso ocorre quando o CSS não carrega direito e você visualiza apenas o HTML do site. Só um esqueleto.
Note que o HTML e o CSS não são propriamente linguagens de código. Se o seu projeto envolve um banco de dados ou uma interação complexa com o usuário, isso pode requerer uma linguagem de programação específica, como php ou java, por exemplo. Aliás, hoje em dia se fala muito em HTML5, que na verdade é só a “última versão” de html. A quinta. Também é por isso que programadores e hackers de cinema escrevem códigos, são as linguagens que os programas entendem.
Expressões um pouco assustadoras que você vai ouvir em qualquer reunião com uma produtora. Parece complicado, mas não é: front end são os elementos do site que o usuário consegue visualizar e com os quais pode interagir. Back end é, bom, todo o resto. Front end é o que roda no seu navegador e o back end é o que roda no servidor, sem uma interface. Por exemplo, se uma empresa está desenvolvendo um formulário de contato em seu site, front end serão os campos a serem preenchidos, as opções a serem selecionadas e o visual da página. Já o sistema de envio que levará a mensagem recebida até um determinado endereço de email é o back end da programação. Depois dessa explicação pode até parecer simples, mas é só porque é.
O javascript é um pouco chato de entender. Frequentemente você vai ouvir algumas confusões sobre o que o que exatamente é esse negócio. Sua origem não é a de uma linguagem de programação, mas sim uma linguagem de scripting. Tem diferença, mas, bem na real: nah. De maneira geral, são coisas diferentes, mas o negócio é que desde sua criação, o javascript evoluiu tanto que hoje ele é uma linguagem de programação funcional como qualquer outra, em algumas situações até melhor. Sua principal utilização em sites é permitir algumas interações simples com o usuário, como mouseovers (elementos que reagem quando o mouse passa sobre eles), caixas de diálogo e etc; mas se tornou tão versátil que já a algum tempo é apontado como a next big thing em desenvolvimento de sites, e há bibliotecas de scripts com milhares de funcionalidades prontas para serem aplicadas. É interessante notar que uma das principais características de uma linguagem de programação é a existência de estruturas de condição, que permitem que o usuário interaja com o que existe na tela. Isso quer dizer que, através de uma linguagem específica, você fala ao programa “quando X acontecer, faça Y” e, incrivelmente, o desgraçado faz exatamente o que você mandou.
Frequentemente javascript é confundido com java, por razões óbvias. Java é outra coisa, uma linguagem bastante complexa, e um tem tanto a ver com o outro quanto o George Lucas e o Lucas Lucco.
*
Essa vale muito pra designers e diretores de arte. O conhecimento em edição gráfica do programador normalmente não vai ser muito grande. E nada de errado com isso, afinal não é o trabalho dele, na verdade é o seu. Existe um procedimento que você pode fazer que vai facilitar muito a vida do programador e refletir em tempo economizado no projeto: criar uma graphical user interface de botões, o GUI. Se trata de um arquivo aberto com os botões e interações do site separados, para poderem ser selecionados com facilidade. Aliás, uma dica pra facilitar sua vida: quando precisar aplicar aquele layout em um print de rede social ou de algum smartphone, apenas procure pela sua respectiva GUI, a do facebook por exemplo.
De vez em quando é muito importante que um site se adapte livremente a qualquer formato de tela. Assim, você pode ver ele bonitão na sua tela de 28", o cliente pode ver no iphone dele, sua mãe pode ver no notebook dela, sua sobrinha pode ver no Galaxy Y de duas polegadas e até o seu tio Osvaldo, que você só vê no natal, pode visualizar o site em seu Acer com 0,7 de RAM. Pra isso, existe o design responsivo e, acreditem, não há uma solução simples nessa hora, fazer um site verdadeiramente adaptável é uma das tarefas mais complexas no estudo de design de interface. Ainda assim, há uma dica que pode ajudar muito na hora do aperto: comece pela versão mobile e adapte para o desktop, e não o contrário. Você vai ver que os erros cometidos no processo são muito mais fáceis de serem corrigidos neste fluxo invertido de trabalho e o resultado final deve ficar melhor, mais rápido. É uma das características da técnica de trabalho que os especialistas em web design, arquitetura de informação, usabilidade e, ocasionalmente, bullshitagem, chamam de mobile first.
Várias coisas são importantes ao se desenhar um site ou aplicativo. O layout por exemplo, é bem importante né. Talvez você diga inclusive que é o mais importante de tudo. Eu poderia concordar, mas aí nós dois estaríamos errados. O mais importante é a usabilidade. Assim como no item anterior, o estudo de usabilidade é algo bastante complexo e demanda um certo esforço de aprendizado por parte das pessoas envolvidas na criação do site, o que torna a tarefa de trabalhar isso em todos os seus projetos um tanto quanto complicada. Mas novamente, existem maneiras de melhorar o seu trabalho de web design com um esforço adicional mínimo, que pode aumentar muito o nível de qualidade do seu trabalho. Um deles é conhecido como paper prototyping, ou, em português, “bota o esquemão todo no papel”. Essa técnica consiste em começar o processo criativo prototipando sua aplicação em um papel, seja a mão livre ou imprimindo seus primeiros rascunhos. Assim, a pessoa que está desenhando o site pode obter feedback de vários outros membros da equipe, principalmente sobre os elementos que mais chamam a atenção na página e os caminhos mais intuitivos a serem seguidos. No início do processo, o layout deve ser completamente esquecido, você pode começar fazendo só um esqueleto do site, sem identidade nenhuma, pra depois completar com a parte visual. Conforme o site vai evoluindo, repita o processo com diferentes usuários, até que você tenha a versão final. Eu sei, papel é tão dois mil e ontem, mas eu não diria que funciona se não funcionasse. A não ser que eu estivesse errado, e já estabelecemos que não é o caso.
Como você já deve saber, aplicativos são muito parecidos com sites. Mas não muito. Nem um pouco na verdade. O que acontece com apps é um pouco estranho, nós temos dois sistemas operacionais dominando a maior parte do mercado de smartphones: Android e IOS, existem linguagens de programação específicas para cada um, Jobs garantiu que a linguagem da Apple fosse bem diferente das outras. Fazer um app funcionar para os dois, em termos de programação, é quase o mesmo que fazer dois aplicativos diferentes. Isso é meio que um saco, e é um fato muito frequentemente esquecido ao se orçar e estimar o tempo de produção de um app. Há uma linguagem que funciona bastante bem nos dois, mas a sua aplicabilidade ainda é um pouco controversa. De qualquer forma, pode ser que, para alguns projetos mobile, essa linguagem seja uma opção salvadora ao programar para múltiplas plataformas. O nome dessa linguagem é javascript, talvez você já tenha ouvido falar.
O último é o mais importante, pois o conhecimento técnico não vale nada sem a compreensão do meio. Muitos projetos digitais já começam errado por serem tratados apenas como publicidade, mas a internet não é uma mídia e as redes sociais não são veículos. A web é um ambiente, no qual os usuários se relacionam a seu próprio modo. Enquanto uma marca se recusar a entender seus usuários e tratá-los como indivíduos, qualquer projeto estará fadado ao fracasso.
Então, tudo dando certo, agora nós podemos nos comunicar um pouco melhor e trabalhar um pouco melhor e criar um pouco melhor e viver um pouco mais felizes para sempre. Se você gostou do texto e quer elogiar, detestou e quer xingar, achou algo errado e quer expor o autor como fraude, deixe um comentário ou mande seu elogio, crítica ou sugestão para gabriel.f.oro@gmail.com. Principalmente críticas e sugestões, afinal, se eu quisesse elogios, mandaria o texto pra minha mãe. A dica final é:
*Pra ser justo, quando a equipe do Netscape desenvolveu o javascript, eles utilizaram o java como referência no início do processo. O resultado final, no entanto, é algo completamente diferente e o único motivo pelo qual o nome “javascript” foi escolhido é um golpe publicitário para capitalizar em cima do enorme hype que existiu em torno do java nos anos 90. Nunca confie em golpes publicitários.
