O Ai não teve versão beta pra download, mas Brenda Sutherland, Gerente de Produto da Adobe postou esse curto vídeo mostrando um pouco da cara do AiCS6, e uma das novas ferramentas – o criador de padrões repetitivos.

Parece que todas as interfaces do pacote Creative Suite 6 vão seguir esse visual mais escuro, o que já era comum nos aplicativos de edição de vídeo fotografia e 3D. Aparentemente, isso dá mais destaque ao conteúdo em si, e deixa a interface em segundo plano.

A nova ferramenta de criação de patterns parece ser muito boa, especialmente para quem está começando a mexer no programa. Mas eu espero que essa nova versã do Illustrator traga também melhorias em ferramentas mais fundamentais, como o degradê, que ainda não está perfeito, e a performance do Spray Tool, que piorou do CS4 pro CS5, a ponto de torná-la inutilizável. Afinal, quem assistiu o tutorial de padrões repetitivos consegue ter o mesmo resultado sem precisar da ferramenta nova Existe também a ferramenta gratuita MadPattern (ótima dica do Agah Segundo), que facilita bastante a criação de padrões repetitivos.

Só me parece que a Adobe sempre se concentra em atochar mais e mais ferramentas nos seus produtos, muitas vezes inúteis, e demora muitas versões pra acertar algumas funcionalidades essenciais, como aconteceu com a função de multipage deles, que demorou a aparecer e ainda pode ser melhorada. Isso porque o Illustrator está fazendo 25 anos esse ano …

O Creative Suite 6 está pra ser lançado em Maio de 2012.

Posts relacionados:

1. Illustrator – Padrões repetitivos
2. Illustrator CS5 – Novidades
3. Integração Illustrator / Edge

Posts relacionados:

1. Illustrator – Color Guide
2. Illustrator – Transform
3. Illustrator – Blend e Opacity Mask

Opacidade padrão

No momento que você tiver objetos sobrepostos, e mudar o Blending Mode do objeto que está no nível mais alto pra outro diferente de “Normal”, suas cores começam a interagir com as cores dos objetos que estão abaixo.

Se você conhece Blend Modes através do Photoshop, vai perceber uma grande diferença entre ele e o Illustrator. Enquanto no Photoshop os Blend Modes só podem ser aplicados a camadas inteiras (e alguns efeitos e operações), no Illustrator eles são aplicados em cada objeto. E mais – você pode definir um Blend Mode para o objeto inteiro, e também ter diferentes Blend Modes em cada preenchimento e contorno desse objeto, criando aparências complexas mas simples de manipular.

Para entender como funciona cada Blend Mode, podemos separar a lista em 5 grupos e simplificar a operação básica que cada um faz:

Note que o funcionamento dos Blend Modes é universal, então essa referência também serve para outros programas Adobe que os oferecem. Vou exemplificar cada um usando uma camada com dois degradês em cima de uma arte com variações de tom :

Modos de escurecimento

Modos de clareamento

Modos de contraste

Modos comparativos

Modos de componente

Esse post é uma referência pra você ter uma noção de como funcionam os blend modes, e saber como usá-los nos seus projetos. Se quiser ver um exemplo aplicado, assista o vídeo Illustrator – Efeitos de Preenchimento, onde eu mostro como usar blend modes pra criar efeitos compostos de preenchimento em objetos no Illustrator.
 

Posts relacionados:

1. Illustrator – Efeitos de preenchimento
2. Illustrator – Blend e Opacity Mask
3. Illustrator – Atalhos e dicas

O Edge é um programa que a Adobe fez pra facilitar a criação de animações em HTML5, JavaScript e CSS3. Imagino que eles estejam admitindo a morte do Flash na web, e estão se preocupando com essas tecnologias que estão se tornando padrão nos browsers modernos. Mas isso não significa que quem já usa o Flash, ou quem ainda está aprendendo, tenha que parar tudo e olhar pro Edge. O Flash ainda é um software incrível de animação e dá saída pra vídeo, que pode ainda ser usado na web ou em outros meios.

Como a coisa ainda está muito no início (hoje o Edge só está disponível no Adobe Labs, pra teste), eu imagino que no futuro essa integração vai ser mais simples. No caso o que eu faço pra enviar uma arte pra ser animada no Edge é usar um script pra salvar cada camada do Illustrator como um arquivo SVG (Scalable Vector Graphic), que é o formato vetorial aceito pelo HTML5. Daí eu uso as ferramentas ainda rudimentares do Edge pra criar uma animaçãozinha básica.

Fiz esse vídeo porque senti um grande potencial no Edge, e acho que a Adobe deve continuar a investir seus esforços nessas tecnologias, pra não deixar a peteca cair como eles andaram fazendo com a insistência do Flash. O programa ainda é bem cru, mas não custa nada já conhecer o funcionamento, as limitações desse tipo de saída e o fluxo que isso pede, pra podermos explorar animação pra web de forma mais leve e seguindo os padrões de hoje em dia.

Baixe o meu script Save Layers as SVG aqui.

Posts relacionados:

1. Illustrator – Transform
2. Illustrator – Color Guide
3. Integração Illustrator / Flash

• Extremamente complexas;
• Matematicamente precisas;
• Com poucos cliques;
• De forma não-destrutiva.

Tudo de bom !

Posts relacionados:

1. Illustrator – Color Guide
2. Illustrator – Efeitos de preenchimento
3. Illustrator – Ferramenta de texto

Vou explicar algumas vantagens de ter um encurtador personalizado, e 5 passos de como exatamente eu fiz pra criar o meu, de modo que você também possa ter um com o seu nome.

Vantagens de ter um encurtador de URL personalizado

1. Branding

As pessoas estão acostumadas a receber links curtos de domínios como bit.ly, tinyurl, migre.me etc. Quando você manda um link curto com o seu próprio nome, o seu diferencial já vai junto. Então só de ver o seu nome encurtando um link, as pessoas já vão deduzir um pouco sobre você: uma pessoa antenada, que se preocupa com todos os aspectos da sua identidade online. E se você for uma empresa, o encurtador personalizado é mais um fator de consistência de marca.

2. Confiança

Os encurtadores encurtam as URLs compridas, mas também as ocultam. Quando você compartilha uma URL curta com o seu nome, é muito menos provável que aquilo é um link malicioso, pois está subentendido que você mesmo o criou, o que aumenta o número de pessoas que vão abrí-lo. Para empresas, é um ótimo jeito de obter confiança do seu público na hora de compartilhar um link.

3. No Twitter

Uma URL enorme que antes gastava 79 caracteres pode ser reduzido para 22 ou 23, deixando mais caracteres pra você comentar sobre o que se trata o link e não estourar o limite de 140 caracteres. E quando alguém te retwitta, o seu link curto vai junto, espalhando o seu twitter e um pouco do seu branding pessoal embutido no link.

4. No Facebook

Assim como no Twitter, o link que você compartilha vai com a sua url curta, que aparece logo abaixo do título, e sempre que alguém compartilha o link, o seu nome vai junto.

5. Métricas

Cada URL que você encurta é catalogada, pra você poder acessar suas métricas quando quiser. Dá pra saber quantas pessoas clicaram, compartilharam e quem compartilhou o link, tudo no mesmo painel. Pra ver as métricas de uma URL encurtada pelo Bit.ly, coloque “+” no final.

—

Como criar um encurtador de URL personalizado

Agora vou explicar como eu criei o meu próprio encurtador. Não sei se existem outros métodos, mas esse funcionou perfeitamente pra mim.

1. Escolha qual vai ser seu domínio curto

Você pode fazer um jogo de letras, aproveitando a extensão do domínio (como eu fiz com jpfara.co), ou simplesmente escolher uma palavra ou nome curto e anexar a extensão (tipo se eu tivesse registrado jpfaraco.me). A ideia é obter o domínio mais curto possível, com até 3 caracteres antes do ponto.

Pra ajudar na decisão, consulte a lista de extensões TLD (top-level domain) disponíveis para registro.

2. Consulte a disponibilidade

Antes de bater o martelo, você tem que confirmar se o domínio que você escolheu já existe. Essa consulta é feita nos sites de registro (os registrars). No meu caso eu usei o Netsol, que me indicaram e que registra domínios com extensão .co, entre outros. Mas se ele não tiver a extensão que você escolheu, pode ser que o GoDaddy, ou o NameCheap tenham. E se mesmo esses não registrarem a extensão que você quer, faça uma busca no Google por “cheap .<extensão que você quer> domain register”.

3. Contrate o registro

Se o domínio estiver disponível, é hora de reservá-lo pra você. Os preços variam entre os tipos de extensão, mas também variam entre registrars, então é bom fazer uma pesquisa antes. Digo isso porque depois descobri que o NameCheap é um pouco mais barato do que o Netsol, mas no geral todos cobram por ano, e o investimento de $40 por ano valeu à pena pra mim. Feito isso, costuma demorar até alguns dias pro seu pedido ser processado e seu domínio estar funcionando.

4. Crie uma conta gratuita no Bit.ly Pro

Enquanto você espera a liberação do domínio, entre no Bit.ly e crie uma conta Pro. Ele vai ser o seu encurtador. No meu caso demorou alguns dias pra eu ser aceito, mas OK.

5. Configure

Assim que sua conta no Bit.ly Pro e o domínio estiverem ativos, é hora de configurar.

No Bit.ly, você é apresentado a uma tela de configurações, onde você informa o seu domínio e recebe instruções pra configurar o mesmo. Anote o IP que o Bit.ly forneceu.

Como falei, eu usei o Netsol, mas o processo deve ser parecido pra qualquer outro registrar.

No Account Manager do Netsol, clique em “My Domain Names”, e depois em “Edit Advanced DNS Records”.

Depois, clique em “Edit A Records”

É aí que você coloca o IP que anotou do Bit.ly, nos campos “www”, “@ (None)” e “* (All Others)”.

O formulário vai dizer que a mudança pode demorar algumas horas. No meu caso aconteceu instantaneamente.

Aí é só voltar pras configurações do Bit.ly e confirmar o seu domínio personalizado.

—

Basicamente está feito! De agora em diante, sempre que você encurtar um link pelo Bit.ly, ele vai usar o seu domínio personalizado como prefixo encurtador. Mas resolvi incluir um passo de bônus, que pra mim é essencial na hora de usar o encurtador.

6. Otimize o uso

Pra facilitar a vida e não ter que ficar entrando no site do Bit.ly sempre, eu uso a extensão do Bit.ly pro Rockmelt (que é a mesma pro Chrome), que fica na coluna de atalhos. Ele pega a URL que eu estou, encurta, coloca junto com o título da página e me dá a opção de enviar isso pro Twitter, direto dali. Woohoo!

Essa extensão também cria um ítem no menu contextual do browser, pra que quando você clica em um link com o botão direito, ele já encurta a URL e copia pra você. Assim você pode colar o link encurtado em qualquer lugar.

—

É isso ! Espero que tenham gostado. Mais posts sobre internet e mídias sociais virão por aí. Enquanto isso, compartilhem esse post com seus encurtadores personalizados =D

No related posts.

1. Novo visual

Eu sempre gostei do visual antigo, que adaptei do tema eVid, do Elegant Themes. Os temas deles são incríveis, e super fáceis de manipular, mas chegou uma hora que cansou, e alguns detalhezinhos já estavam me incomodando. Então resolvi refazer tudo do zero e adotar um visual mais limpo, arejado e espaçoso, mas mantendo a identidade cromática. Ultimamente tenho lido bastante sobre CSS3, e usei alguns recursos pra melhorar a experiência de uso do site. Então, galera do Internet Explorer, toma vergonha na cara e baixa um browser decente ! Firefox, Chrome, Safari … Qualquer um, menos Internet Explorer !

2. Novo sistema de comentários

O Disqus é um sistema mágico de comentários que permite que você use sua conta do Google, Facebook, Twitter ou Yahoo pra colocar a sua cara nos seus comentários, e ter um histórico de tudo que você já comentou no site. Ele também deixa você curtir comentários, o que gera um ranking, cujos melhores podem aparecer no topo da lista.

3. Novo conteúdo

O layout antigo do blog era exclusivamente focado em conteúdo de vídeo. Ou seja, um post normal ficava parecendo que era um vídeo, e aí a página do post ficava esquisita porque não tinha o vídeo. Essa foi na verdade a principal razão de eu querer mudar o layout – pra poder escrever outros posts, sobre outros assuntos, e que esses posts convivam melhor com os posts de tutorial. Mas não se preocupem. Não vou parar de fazer tutoriais ! Mas também quero que esse seja um espaço pra eu poder postar notas sobre outros assuntos que me interessam, e que eu acho valiosos de serem compartilhados, como design, tecnologia, social media, e outras coisas boas da vida.

4. Novo framework do WordPress

Essa na verdade é melhor pro meu lado, mas não dispensa a menção. Como falei, antes eu usava um tema do Elegant Themes que eu adaptei pro visual que eu queria, mas agora o blog funciona com o framework PageLines, que é mais incrível ainda. Se não fosse por ele, eu nunca teria redesenhado esse blog inteiro pra ficar do jeito que eu quero em uma semana. Ele é super fácil de customizar, com uma interface drag and drop linda, que permite customizar tudo, então qualquer conteúdo diferenciado que eu venha a incluir aqui vai entrar com facilidade e elegância.

5. Novo servidor

Quem andou acompanhando meus tweets e o Facebook mês passado viu os problemas que tive com o MochaHost. Até então eles tinham sido ótimos pra minha hospedagem, mas durante uns 3 fins de semana seguidos o site saía do ar sem mais nem menos, e eu cansei de entrar com pedido de suporte. Migrei então pro Bluehost, que é um pouco mais caro, mas sempre ouvi falar bem deles. Vamos ver se é bom mesmo !

—-

Por enquanto é isso.. Com o tempo eu vou ajustando o que achar que precisa de ajuste, adiciono funções novas, e acima de tudo, novos posts ! Espero que tenham gostado, e qualquer observação, pode comentar aqui que eu vejo !

No related posts.

O script que eu usei pra dividir a linha em seções idênticas é esse:

Divide Length

Quem ainda não viu o vídeo de scripts, vale à pena conhecer!

Posts relacionados:

1. Illustrator – Scripts & Scriptographer
2. Illustrator – Ilustração a partir de foto
3. Illustrator – Color Guide

A ferramenta é especialmente útil quando se tem uma arte com muitas cores, e você quer recolorir para respeitar uma determinada paleta, ou reduzir o número de cores. Ela permite que você faça isso de forma bem rápida, precisa e com possibilidade de experimentação.

Posts relacionados:

1. Illustrator – Efeitos de preenchimento
2. Illustrator – Ferramenta de texto
3. Illustrator – Halftones

Scripts são como plugins, que extendem a capacidade do Illustrator e o tornam um programa muito mais versátil e customizável. Eles estão aí pra facilitar tarefas tediosas ou repetitivas de modo inteligente e rápido. Usar scripts é justificar o propósito do computador, e explorar seu potencial de processamento a favor do seu trabalho.
Imagine só … Por que você ficaria horas contando quantos objetos existem na tela, quando um script pode fazer isso pra você em poucos segundos ?

Além de demonstrar como scripts de Illustrator podem ser incorporados no seu fluxo de trabalho, eu apresento também o Scriptographer, um plugin que extende mais ainda as funções do programa, através de scripts interativos e bastante sofisticados.
Créditos pro Felipe Pinto, por ter me apresentado o Scriptographer !

Aqui algumas das maiores fontes de scripts que eu conheço:

• Adobe Exchange › Illustrator › Scripts
• Illustrator Praxis

E aqui alguns dos scripts que eu mais uso. Pra baixar, clique na imagem com o botão direito e selecione “Salvar destino como”:

Adjust dashes

Muito útil pra quem usa Illustrator pré-CS5, em que não havia ainda a função nativa de ajustar as linhas pontilhadas aos vértices do objeto.

Count selected objects

Conta quantos objetos estão selecionados.

Arc correction

Transforma linhas irregulares em arcos regulares.

Common tangents

Calcula e traça as tangentes comuns entre os objetos selecionados.

Metaball

Cria uniões curvas entre objetos, de acordo com o raio desejado.

Round any corner

Arredonda somente os cantos dos vértices selecionados, de acordo com o raio desejado.

Divide Length

Divide uma linha n vezes, em segmentos idênticos.

Divide text frame

Separa as linhas de uma caixa de texto em linhas individuais.

Join text frames

Une linhas de texto separadas em uma só caixa de texto.

Delete fluff

Exclui todas as paletas, símbolos e estilos gráficos não utilizados, a fim de diminuir o tamanho do arquivo.

Reverse

Inverte o sentido de um traço. Bom para controlar brushes, ou na hora de exportar para animação.

Extend handles

Extende simultaneamente os manipuladores dos vértices selecionados em x porcento. Valores podem ser negativos também …

Size by luminance

Redimensiona os objetos selecionados de acordo com a luminosidade do seu preenchimento.

Specify

Desenha cotas de dimensão, pra especificações técnicas.

Vary hues

Aleatoriamente varia a matiz de preenchimento ou contorno, ou a transparência dos objetos selecionados, em x porcento.

Package

Salva seu arquivo, e junto reúne todas as imagens linkadas em uma pasta “links”

Save docs as PDF

Salva todos os documentos abertos como PDFs separados.

Save docs as small PDFs

Salva todos os documentos abertos como PDFs separados, configurados para resultarem em arquivos mais comprimidos, para mandar por email.

Save layers as JPG

Salva cada camada como uma imagem JPG separada. O tamanho do JPG é o tamanho da camada.

Save layers as PNG

Salva cada camada como uma imagem PNG transparente separada. O tamanho do PNG é o tamanho da artboard.

Save layers as PNG 300dpi

Salva cada camada como uma imagem PNG transparente a 300dpi separada. O tamanho do PNG é o tamanho da artboard.

Dance

Cria dançarinos aleatórios, usando somente linhas com contornos de diferentes espessuras. Tá bom, eu nunca uso esse script, mas vai falar que não é engraçado !

—

Update: A pedido do Yuri Basilio, fiz um zip com todos os arquivos. Clique AQUI para baixar.

Posts relacionados:

1. Illustrator – Básico
2. Illustrator – Ilustração a partir de foto
3. Illustrator – Efeitos de preenchimento