Blog Wally Vianna Pro: o ano que passou (2015)

2 de janeiro de 2016 - Leave a Response

Segundo informações do WordPress, que hospeda este blog, em 2015 tivemos

  • 1500 visitas
    ou
  • 125 visitas por mês

O artigo mais lido foi “5 ferramentas on-line fáceis de usar para fazer seu logotipo
Tivemos menções no Facebook, Google docs, Google buscador
visitas dos E.U.A, Portugal e Brasil

Grato pela atenção, a todos os leitores.

wordpress-fogos-estatisticas

16 de dezembro de 2013 - Leave a Response

Precisa de serviços em webdesign, design gráfico, ilustração e pacote Office? Fale com Wallace Vianna, designer freelance (autônomo) no Rio de Janeiro, RJ.

Ilustração animada – IstoÉ

22 de outubro de 2016 - Leave a Response

mozart

A revista IstoÉ digital inovando: uma excelente ilustração, que por si só ja merceria uma nota aqui, só que animada!

Link da matéria.

Making of / processo: arte digital (6)

15 de outubro de 2016 - Leave a Response

Wallace Vianna é designer gráfico.

Mais uma vez trago um processo de criação de imagem digital, do designer Fagner Carvalho, para Contém, administradora de benefícios.

11-mk-of-digital-2-l

Leia o resto deste post »

Palestra SENAC RJ/FATEC: Designer de Interação: Conheça a profissão que o mercado digital precisa

8 de outubro de 2016 - Leave a Response

A Faculdade de Tecnologia Senac Rio (R. Santa Luzia, 735 – Centro, Rio de Janeiro) promoveu em 26 de setembro de 2016, às 19h, o evento “Designer de Interação: Conheça a profissão que o mercado digital precisa”. Foram duas palestras gratuitas com os profissionais Guilhermo Reis (gerente da plataforma VOD – Video On Demand – da TV Globo) e Luiz Bordim (Senior Interaction Designer da Huge), que procuram debater o mercado e perfil do futuro profissional da área.

palestra-design-ux-luiz-2

Palestra 1 – Designer de Interação: Conheça a profissão de que o mercado digital precisa

palestra-design-ux-luiz-4

O Design de Interação tem como objetivo garantir a melhor experiência do usuário no desenho de websites e aplicativos em dispositivos móveis.

A palestra primeiro definiu a área de atuação do Design de interação, com exemplos do dia-a-dia – uma família na década de 60 na sala só tinha o rádio ou a TV como entretenimento, hoje há vários dispositos numa mesma sala (Celular, tablet, laptop, TV…). Luiz apresentou os clientes da Huge e discorreu pelo método de trabalho da empresa, que basicamente se apóia nos pilares de pesquisa, marketing, criação e design de interfaces.

Não foi o foco destra palestra, mas Luiz comentou sobre novas (e possíveis) áreas de atuação do design de interfaces, que vão desde o design antecipativo (brinquedos, sites que aprendem com o comportamento do usuário e antecipam os desejos deste), a hotelaria (concièrge), robótica, realidade virtual (de games à ensino, passando por medicina) até criação de avatares animados (para jogos e interação social).

O palestrante: Luiz Bordim, Senior Interaction Designer na Huge; atua no desenvolvimento de experiências digitais de ponta para algumas das principais marcas do mercado global e brasileiro. É graduado em Design, pós-graduado em Marketing e Design Digital, e mestrando em Gestão da Economia Criativa. Seu currículo inclui passagens pela Globo.com, Estante Virtual e sua própria startup, Beerclue. Na Huge, já trabalhou em projetos para clientes como Discovery, Estadão, Nestlé, Do bem, Vale, Whirlpool e Multiplan.

 

Palestra 2 – Os Desafios do Designer de Interação para a próxima década

palestra-design-ux-guilhermo-1

Foi uma palestra com muito senso de humor, e se Guilhermo for o professor de algum curso, os alunos terão aulas com momentos divertidos e interessantes.

O início da explanação o palestrante mostrou alguns tipos de interface de usuário inovadores e interessantes, como a caneta que escreve transferindo as anotações do papel (e o áudio do local) para o computador.

Outro exemplo interessante foi uma interface nova criada pela Amazon, para vender seus produtos: um totem, que possui um leitor de código de barras e um microfone, permitindo pedir um produto online passando o código de barras no scanner do totem, ou por comando de voz. Isso mostra que certos serviços demandam novas interfaces (em vez de usar interfaces/dispositivos existentes).

Dentre os exemplos de interface mais conhecidos/populares, Guilhermo mostrou que um conteúdo não tem de se encaixar apenas ao formato (largura/altura) do dispositivo e sim se adaptar para aparecer melhor; uma marca (nome de novela) que fica visível na TV, no celular fica ilegível, e deve ser substituído por outra versão da marca, em preto-e-branco, por exemplo. A foto de uma pessoa que fica bem na tela (estreita) do celular, na tela da TV pode ter grandes áreas em volta (pois há espaço para isso na tela grande da TV).

Um assunto que foi bem defendido foi o designer tomar decisões apoiado em vendas/resultados. A nova tela do BBB no site da Globo.com foi modificada e o site ganhou um aumento de 230% nas visitações (e vendas).

Guilhermo desmistificou a idéia do “Mobile first”, “Google First”, “qualquer coisa first” que ao seu ver são formas de vender algum produto ou serviço. Em vez disso ele propôs o ”Matrix First”, ou seja: o que o usuário quer, primeiro, na hora de definir as diretrizes do projeto.
A palestra foi boa por desconstruir outros mitos, como o da criação de demanda/consumo, que pode ser algo perigoso se não for baseada em marketing/pesquisa prévia (o lançamento fracassado da Apple de Smart Watch/relógio inteligente, que teve fila de 4 pessoas foi um bom exemplo disso). Não que isso – criação artificial de consumo – não exista: quando um novo Windows é lançado toda uma cadeia de demanda por novos programas e equipamentos é disparada, fazendo a riqueza de toda a indústria de informática. Mas, nesse caso, o público consumidor já está formado, o que justifica/corrobora esse estado de coisas (ou modo de pensar).

Gullhermo com muito bom humor fez propaganda (praticamente um merchandising) do Globo Play, o portal de conteúdo digital da Globo. Mas foi um bom motivo para falar sobre como a Globo trata seus projetos, conteúdos e parceiros comerciais. Por exemplo, a Globo suporta 5 marcas de TVs, dois sistemas operacionais móveis (IoS e Android) para entregar seus conteúdos. A idéia de que todo conteúdo deve estar em “todas as mídias” caiu por terra, pois manter compatibilidade para cada dispositivo demanda ter uma equipe para cada ambiente/dispositivo (hardware e software) ou uma equipe que se divida no máximo 2 ambientes. Ex.: o conteúdo para Android é suportado para uma determinada versão deste Sistema Operacional (O.S.) em diante; e isso vale para os demais ambientes.

O palestrante: Guilhermo Reis, Gerente da Plataforma VOD (Vídeo On Demand) da TV Globo; especialista em User Experience (UX), E-Commerce e Produtos Online. Atualmente é Gerente da Plataforma VOD da TV Globo.

 

Valeram as palestras, que venham outras.

Sabia que Adobe CC (Creative Cloud) faz wireframes?

1 de outubro de 2016 - Leave a Response

Tradução e adaptação: Wallace Vianna, designer

toptal-fig-ivana
AutoraIvana Miličić, designer freelance, Croácia, membro TopTal desde 2015
Artigo original: TopTal

Wireframe é um passo importante na criação de qualquer interface de usuário em um website, aplicativo ou software.  Evitando se deixar levar pelas formas dos recursos visuais, cores, tipografia, estilos e efeitos você pode fazer mais foco na hierarquia do conteúdo e experiência do usuário.

Fazer protótipos e wireframes de baixa fidelidade irá ajudá-lo a testar e interagir mais nas fases anteriores, a trabalhar mais rápido e desenvolver produtos que os usuários vão adorar.

Há muitas ferramentas de wireframes diferentes para escolher no mercado.  Qual você escolherá depende de suas preferências pessoais e estilo de fluxo de trabalho.

Assim como um monte de designers migraram do mundo de impresso para o design digital, eu sou uma especialista nas aplicações da Adobe como o Illustrator, InDesign e Photoshop.  Posso usá-los de forma eficiente, em todos os lugares e em qualquer momento (mesmo se tenho de acordar para trabalhar no meio da noite, sem uma xícara de café :^D).  No entanto, estas ferramentas tornaram-se também as que eu uso para fazer web e aplicações de design visual (1).  Assim, para o meu fluxo de trabalho para ser o mais eficiente, eu as uso para fazer wireframes também.

(1) Nota do tradutor: link original, aqui

toptal-fig-1 FIGURA 1

Leia o resto deste post »

Making of / processo (5) – arte vetorial

26 de setembro de 2016 - Leave a Response

Wallace Vianna é designer e ilustrador/desenhista.

Segue aqui um pequena explicação, a partir de uma arte de cartão de aniversário.

A explicação é sobre como chegar a ilustração final, usando apenas ferramentas de desenho vetorial 2D; neste caso, o Corel Draw, versão X6 (mas válido para outros programas, como o Illustrator e versões anteriores do Corel, que suportem uso de malha 2D).

Não é um tutorial sobre como fazer o desenho inteiro, apenas um pedaço dele, já que a solução aqui descrita se aplica às demais partes da arte.

Nosso objeto de estudo e exemplo é a ilustração de um cartão de natal:
mk-of-processo-vetorial-0

Leia o resto deste post »

Making of / processo (4) – imagem digital

21 de setembro de 2016 - Leave a Response

Wallace Vianna é designer gráfico.

Estou postando aqui o making of de um trabalho do designer Fagner Carvalho, para a Contém administradora de seguros, uma postagem para rede social (Facebook) da empresa.

Este Maknig Of (Processo) ilustra bem como a construção de uma imagem passa pela reconstrução de imagens de referência (no caso, de banco de imagens), remetendo ao que comentei em post anterior, que o trabalho do designer não é o de artista plástico frente a tela de pintura (daí o uso de referências prontas) mas envolve trabalho de criação à partir destas referências. Em resumo, nem sempre o designer irá tirar fotos originais para depois trabalhar, mas, em qualquer caso, a pós-produção das imagens é que será, se não o maior, um dos maiores trabalhos do designer.

mk-of-contem-face-1
Imagem original.

mk-of-contem-face-2
Imagem com cor editada para amarelo.

Leia o resto deste post »

Ilustração criativa

11 de junho de 2016 - Leave a Response

Wallace Vianna é designer e ilustrador.
christoph-niemann-ilustracao-criativa

Essa notícia descobrí nas redes sociais (FaceBook), e tenho que postar aqui no blog, um exercício de criação em artes visuais. Um meio-caminho entre o ready-made do dadaísmo e trompe d’oleil que artistas como Vik Muniz se utilizam.

O ilustrador Christoph Niemann completa suas artes usando objetos do cotidiano, se usando da perspectiva e ilusão de ótica para atingir seu resultado, que depois é fotografado. Os objetos (e desenhos) variam de tamanho, pois um martelo e um conta-gotas podem ser usados para terminar as ilustrações..

Outro artista na mesma linha é o Gilbert Legrand, que também trabalha com o real/ilustrado de maneira criattiva:

gilbert-legrand-ilustracao-criativa

Parabéns para eles!

Making of / processo (3) – Ilustrações para livro infanto-juvenil

17 de março de 2016 - Leave a Response

sidalio-carla-souza-lapis-tinta-cor O projeto
O projeto que me chegou de cara me atraiu: ilustrar um livro cujo tema é a inclusão social, com pessoas portadoras de necessidades especiais, como a personagem-título (surdo-mudo) ou pessoas com algum tipo de deficiência (pessoas que usam óculos, bengalas, etc) sem esquecer ainda pessoas da terceira idade, obesos, etc. A ideia é mostrar pessoas que normalmente são excluídas da nossa literatura infanto-juvenil e estão presentes na sociedade.

Pré-projeto
Inicialmente foi definido o estilo de desenho a partir de exemplos de ilustração do mercado, evitando um erro comum – o artista perder tempo adivinhando o que o cliente deseja, trabalhando a partir de seu estilo pessoal. Trabalhar assim permite que o desenho se aproxime mais e rapidamente do que o cliente deseja/imagina, pois raramente o cliente procura o ilustrador para fazer “trabalho autoral” (aquilo que o ilustrador gosta de fazer). Foi feito a seguir um exemplo de ilustração para ser aprovado junto a cliente e à editora/gráfico, que forneceu as especificações de como a arte deveria ser entregue (dimensões, marca/área de corte).

Desenvolvimento de projeto
Os rascunhos foram feitos em miniaturas, para dar agilidade na produção, e ampliados digitalmente para fazer os traços pretos. carla-ilustra-rascunhos Optei por fazer o traço dos desenhos à mão, em papel não-revestido, a fim de que o traço não ficasse muito parecido com desenhos da Disney (nada contra, apenas procuro fazer algo diferente a cada trabalho). Os traços foram escaneados em preto-e-branco, e depois convertidos em cor, com transparência. Isso permite ter traços pretos sem anti-aliasing/anti-serrilhamento da cor branca do papel original. A colorização foi feita em vetor, o que permite maior flexibilidade para fazer alterações. Segui soluções visuais do estilo de desenho aprovado (p.ex., gradientes de cor escalonada, com poucos gradientes contínuos), o que foi um aprendizado, ao sair de meu estilo pessoal de ilustrar.  Aliás, “sair da caixa” e trabalhar com estilo diferente do meu, é um exercício fundamental.

Cronograma de trabalho

infografico-carla-ilustra-2
O trabalho seguiu o seguinte cronograma: cada etapa do desenvolvimento passa por processo de aprovação junto a cliente, antes de ser finalizado: os rascunhos a lápis, o desenho em forma de traços pretos, a colorização inicial (com cores planas). Isso evita retrabalho de desenho e cor ao mesmo tempo. Após aprovação das cores planas, o desenho é finalizado com sobreposição de cores para dar profundidade e iluminação. Contrato de serviço Um pequeno contrato de serviços digital foi feito entre mim e a cliente, o que permite refazer/incluir termos com agilidade, além de registrar em um único lugar as conversas entre ambos (comprovantes de pagamento das etapas, datas de aprovação etc). Uma questão comum no mercado (assim como sobre o que é ou não entregue ao final do trabalho), são as alterações no combinado: se a etapa foi aprovada (exemplo, desenho a traço), será refeita mediante pagamento de adicional. Pode parecer coisa simples, mas vejo muita gente não sabe lidar com essa questão, seja pela nossa cultura do “jeitinho” (onde mais vale o relacionamento interpessoal do que o combinado) seja por imaturidade profissional. Pode-se ter um bom relacionamento com os clientes sem perder de vista o cumprimento ao combinado. E isso não quer dizer engessamento das relações: pode-se mudar o combinado, contanto que ambos os lados cheguem a um acordo bom para ambos os lados, ao ajustar o contrato de serviços.

Conclusões
O projeto deve estar concluído neste primeiro semestre de 2016, e parte dele pode ser visto no site ilustra.org: http://www.ilustra.org/users/wallyvianna Existem detalhes de produção, mas que caberiam mais num curso prático ou em outro texto específico sobre este tema.

MarketDrops

17 de dezembro de 2015 - Leave a Response

Tipos & tipografia

Um haikai tipográfico interessante de Rodolfo Capeto, designer, direto do Clube dos Tipos, no FaceBook:

haikai-tipografico

Leia o resto deste post »