Blablabla Aleatório

Acima está o header do blog Blablabla Aleatório, que eu desenhei a um tempo atrás, quando comecei a renovar meu portfolio online - precisava de uma desculpa para usar mais o Illustrator, já que eu quase não mexo nesse programa porque pras minhas ilustrações só uso o Paint Tool SAI e o Photoshop. Discutirei nesse post o processo criativo.

The image above is the blog header I designed for Blablabla Aleatório [rougly translated to "random talk", in Portuguese only] a while ago, when I began to expand the range of my online portfolio - I needed an excuse to work with Illustrator since it's not my first choice for doing illustrations and other works and I need more practice with other softwares than Paint Tool Sai and Photoshop. In this post I'm gonna discuss the creative process behind it.

Algumas semanas atrás eu estava pelo blog, assinado por Mariana e Núbia - É um blog fofo e pessoal que fala de leitura, esmaltes, música, e o que mais elas tiverem de assunto. Eu me interesso por leitura e visito pra correr pelas reviews e dicas de livros [apesar de eu não efetivamente ler bastante ou o quanto deveria]. E já que o blog estava em manutenção e mudanças no layout, me ofereci para fazer um header novo para o Blablabla, já que eu gosto do blog e também poderia treinar o Illustrator fazendo algo util e que eu gostaria de por em display. Motivação dupla para desenvolver algo diferente da minha linha de trabalho usual. Aqui está o header original do blog:

A few weeks ago I was at this website, a personal blog of two mates, Mariana and Nubia - it's a cute blog about good reads, nailpolish, music, concerts and whatever else they feel like talking about. I'm interested in books and reading - that's the main reason I go through their posts, but unfortunally I'm not big on the reading at the moment. Oh well, anyways, at that time the blog was going through maitenance and layout changes, so I asked them if they would like a new header. Since I like their blog I thought I could something nice while using Illustrator, something nice and different from the usual. Here's the original blog header:

Grande parte do conteúdo do blog é sobre livros e leitura, com texto informal e carga pessoal. Pensando no nome do blog e nas características do texto, queria fazer algo que fosse a cara das autoras. A idéia foi duas caricaturas conversando um blablablá aleatório. Literalmente. O estilo seria simples, para explorar  linhas e formas num nivel básico de Illustrator. Atrás de referências pra começar, lembrei do trabalho de minha mãe, artista plástica, que por hora desenvolve esculturas de arame caricatas inspiradas pela fase de desenhos em linha contínua de Pablo Picasso:

This blog is big on books and good reads, with personal reviews. I thought in doing the girls' portraits having a random talk,  referencing the blog name. Thinking in a literal way, doing the design in a clean style in order to explore lines and shapes in a basic Illustrator level. When going after references to inspire and guide the design, I remembered my mom's current art, wich takes after Pablo Picasso's one line drawings:

PALMIRA VILLAR: "BOM DIA", EM ARAME, SOLDA E TINTA SPRAY PRETA/PALMIRA VILLAR: "GOOD MORNING", WIRE AND BLACK SPRAY PAINT.

Apesar do conceito interessante, não achei exatamente apropriado, pois queria algo mais colorido e divertido. Mas ja era um começo. Então fui direto na fonte, Picasso, e enquanto googleava a inspiração da minha mãe, passei pelo site Picassohead, um site divertido onde você pode "criar sua caricatura usando os traços de Picasso e compartilhar com seus amigos". Dei uma olhada na galeria, brinquei um pouco pra ter umas idéias, e abri o Illustrator pra começar a rabiscar. O resultado foi o retrato estilizado das duas blogueiras:

While the concept is simple and interesting, it wasn't cool enough for a blog. It doesn't have to be hip, but a little color doesn't hurt. Then I decided to go to the source, googling my mother's inspiration.  Turns out I found Picassohead, a fun website where you can "create your own image using Picasso elements and forward it to friends". I tried making some faces and browsed the gallery, and after playing around I was set to open Illustrator and start doodling. I ended up with two highly stylized portraits:

MARIANA
NÚBIA ESTHER

Com as duas bonitas desenhadas, comecei a trabalhar nos escritos. A fonte que escolhi foi a Two Turtle Doves, que tem licença gratuita e design interessante. Digitei o nome do blog:

Given the two faces were done, I started working with the title. I chose Two Turtle Doves as a font since it looks nice and the licence is free. I typed the blog's name:

Foi um começo, a fonte me agradou bastante, mas não curti o balanço e as proporções.  Mudando algumas letras de minúsculas pra maiúsculas o resultado ficou mais agradavel. Notei que a fonte não vinha com acentuação, então desenhei um com a ferramenta pincel:

It was a nice start, since I liked the font. But the balance, spacing and proportions seemed a little off. So I capitalized some of the letters, in order to get a more pleasing overall aesthetic. It worked. The default font didn't have tildes, so I drawed a dashed line over the letter O with the brush tool:

Daí passei pra aplicar o título na idéia original - Os perfis de rosto foram desenhados de modo que se alinhassem e conversassem entre si. Então o titulo entraria no meio, ilustrando essa comunicação. A fim de que o desenho fluisse ao se encaixar a escrita, modifiquei o padrão do texto: Desenhei uma linha curva e com as opções de escrever sobre um caminho alinhei os escritos à linha. Ao encaixar o título no meio dos dois rostos, dois terços do trabalho já estavam concluídos:

With this set, the next step was putting the letters into the original idea's context - The two profiles were designed to communicate when facing each other. So the title would become a representative of this conversation. In  order to make this talk flow in a nice way, I modified the text path by drawing a wavy one with the line tool and aligning the words on it. When fixing the text between the two faces, two thirds of the work were done.

Daí parti pro aspecto mais decorativo. Já que o blog fala sobre assuntos diversos, ilustrei alguns dos principais - livros, esmaltes e música/shows. Coloquei também formas coloridas como que balões de fala distorcidos, referenciando o header original e o seu tema em arco-íris. Ao combinar os enfeites alinhados aos dois retratos, o novo header foi finalizado e estava pronto para uso:

Then I began to work on the decorative aspect. Since the blog covers a lot of subjects, I illustrated some of the main ones - books, nailpolish and music/shows. I also added some colored shapes as distorted speech bubbles, referencing the original header and its rainbow color scheme. When fusing the decoration with the two portraits, the new header was done and ready to post:

Como um exercício de design, pensei nas aplicações da ilustração e seus componentes, e de se a colocando em preto-e-branco haveriam perdas consideráveis no design - uma vez que o fundo do blog era preto antes de começarem as mudanças de layout. Estava preocupado no quão importante as cores eram no todo, e se ao tira-las do design haveriam perdas drásticas. Foi então que pus tudo à prova ao converter para preto-e-branco e negativo, editando algumas das formas e mantendo as linhas principais intactas.

As a complimentary design exercise, I thought about possible applications of the illustration, and how it would look in black and white - since the blog was black before the major updates. I wondered if when taking away the colors, the design would suffer major losses. I stripped all the colors and simplified some of the shapes, while keeping the main outlines intact.

Apesar de perder parte das informações, os pontos altos da ilustração não foram alterados. No fim das contas, não houve perda de qualidade. Curti o trabalho, e pra minha satisfação as donas do blog também. Assim como fiz com o design do meu header, discutido aqui no primeiro post, montei cartões fictícios pra testar o valor do trabalho numa mídia que não virtual.  Pegando os dados da Mariana de exemplo, criei duas versões, colorida e negativada em preto-e-branco. Quem sabe com o blog crescendo, o cartão não ganha uma utilidade prática, né? Muita sorte pra elas!

While I got that it lost some information, the strong points of the illustration were still there. So in the end there wasn't quality loss. I enjoyed the design and the work, and got happy that the girls enjoyed it too. To conclude this simple project, I designed business cards to test its usance in other media, pretty much as I did with my own header design/logo, explained in my first post. With Mariana's contact information, I created two versions of a business card - a colored and inverted black and white one. Maybe soon as their blog grows, these cards can find their way into a printer. Good luck for them!