Muitas das mudanças mais dramáticas na forma como o Illustrator está sendo usado estão ocorrendo no campo da tradução de imagens vetoriais para a web, e o formato SVG subestimado é o elo principal nesse processo. Os arquivos SVG mantêm os valiosos recursos de escalabilidade da arte vetorial e têm suporte quase universal em sites e ambientes de desenvolvimento da web. Ao preparar arte vetorial para a web, é importante evitar os efeitos padrão do Illustrator e, em vez disso, usar filtros SVG.
O Illustrator vem com um conjunto decente, mas minimalista de filtros SVG, mas aqui estão algumas dicas sobre como encontrar e adicionar filtros SVG, bem como recursos para criar seus próprios filtros SVG. Para aqueles que trabalham com desenvolvedores de aplicativos e da web, torne suas vidas mais fáceis e produtivas verificando a folha de dicas para distribuição de código SVG.
Quando você cria arquivos SVG para telas no Illustrator e deseja aplicar efeitos (como sombras), deve aplicá-los como filtros SVG. Dessa forma, seus arquivos SVG retêm escalabilidade infinita sem distorção.
As etapas a seguir orientam você na aplicação de um filtro SVG a gráficos no Illustrator:
Selecione o (s) objeto (s) aos quais você está aplicando o filtro.
Escolha Efeito → Filtros SVG.
Selecione um filtro na lista que aparece.
A maioria dos filtros possui nomes descritivos. Por exemplo, aqueles com sombra no nome são sombras projetadas, aqueles com gaussiano no nome são desfocagens gaussianas. O fluxo de trabalho é um pouco estranho e tortuoso, mas você precisa primeiro selecionar um filtro para acessar todas as opções disponíveis para aplicá-lo.
Para alterar o filtro selecionado:
Depois de definir um filtro, clique em OK no painel Aplicar filtro SVG.
O conjunto de filtros SVG do Illustrator é minimalista, mas você pode aprimorá-lo projetando seus próprios filtros ou baixando conjuntos predefinidos de filtros SVG de fontes online. Projetar filtros envolve codificação, mas é possível se você estiver familiarizado com HTML. Eu recomendo o tutorial em w3Schools para a criação de filtros SVG. Ou você pode comprar conjuntos de filtros online e até mesmo encontrar alguns conjuntos legais de filtros SVG gratuitos em Creatingo .
Depois de comprar ou criar seus próprios filtros SVG, veja como você os instala no Illustrator:
Escolha Efeito → Filtros SVG → Importar filtro SVG.
Na caixa de diálogo que é aberta, navegue e clique duas vezes no arquivo de filtros SVG que você criou ou baixou gratuitamente.
O arquivo que você está procurando deve ser um arquivo SVG (vários filtros são agrupados em um único arquivo SVG).
Seus novos filtros agora estão disponíveis no submenu Filtros SVG.
Escolha Efeito → Filtros SVG para aplicar seus novos filtros aos objetos selecionados.
Freqüentemente, os gráficos SVG que você cria no Illustrator são entregues a designers de jogos, animadores, infográficos ou outra saída, onde os desenvolvedores trabalharão com o código por trás do gráfico SVG. Como ilustrador, você não precisa saber como criar esse código, mas pode precisar saber como obtê-lo e entregá-lo a um desenvolvedor. Veja como.
O caminho para exportar seus gráficos SVG como código passa pelas funções Salvar do Illustrator. O menu Salvar tem opções (não fáceis de encontrar) que exportam seu arquivo como código SVG. Provavelmente, você desejará estar em comunicação em tempo real com o desenvolvedor da tela à medida que gera esse código, porque várias opções são determinadas pela forma como esse código será usado:
Escolha Arquivo → Salvar (ou Salvar como se estiver salvando um arquivo novamente).
Na caixa de diálogo que é aberta, selecione SVG no menu Formatar.
Ignore a opção de arquivo SVGZ, que é para um arquivo compactado que não é exibido em navegadores.
Clique em Salvar para abrir a caixa de diálogo Opções de SVG.
Sempre escolha SVG 1.1 na lista suspensa Perfis SVG. Outras versões estão obsoletas.
Se você incorporou ou vinculou imagens em seu arquivo SVG, escolha Incorporar no menu suspenso Locais da imagem. No entanto, consulte primeiro seu desenvolvedor da web sobre essa escolha.
Selecione Preservar recursos de edição do Illustrator para tornar o arquivo editável no Illustrator.
Essa escolha aumenta o tamanho do arquivo, mas permite trabalhar com um único arquivo SVG que pode ser editado, atualizado e compartilhado com desenvolvedores da web.
Se o botão Mais opções for exibido, clique nele para acessar as opções avançadas. e faça suas seleções.
Essencialmente, as diferentes opções geram CSS com seu arquivo que define propriedades das seguintes maneiras. Consulte seu colega de equipe de desenvolvedor da web sobre como definir essas propriedades CSS:
Desmarque as cinco caixas de seleção na parte inferior da caixa de diálogo Opções de SVG, a menos que seu parceiro desenvolvedor solicite que você as selecione.
Essas opções são para aplicativos altamente especializados.
Para gerar o código SVG com base nas seleções feitas na caixa de diálogo Opção de SVG, clique no botão Código SVG .
O código SVG gerado é exibido no editor de texto do sistema operacional. Você pode salvar esse código como um arquivo de texto usando o editor de texto do seu sistema operacional e entregar o arquivo a um desenvolvedor.
Depois de gerar o código, clique em OK para salvar seu arquivo.
Você pode reabrir e editar este arquivo no Illustrator.
Você pode usar a ferramenta Snapshot no Adobe Acrobat CS5 para selecionar texto e imagens e criar uma imagem de uma determinada área em um arquivo PDF. O resultado é comumente referido como uma captura de tela de uma seção em um arquivo PDF. O resultado é uma imagem, e seu texto não é [...]
Projetado para pesquisadores e cientistas, os recursos de medição do Photoshop CC são bastante poderosos. Você pode medir qualquer coisa e contar o número de qualquer coisa em uma imagem técnica, talvez de um microscópio ou telescópio. Se você sabe o tamanho exato de qualquer elemento em uma imagem, você pode descobrir quase tudo [...]
Ao usar as ferramentas Liquify no Adobe Creative Suite 5 (Adobe CS5) Illustrator, você pode dobrar objetos - torná-los ondulados, pegajosos ou pontiagudos - criando distorções simples a complexas. As ferramentas Liquify podem realizar todos os tipos de distorções criativas ou malucas (dependendo de como você as encara) em seus objetos. Vocês […]
Quando você tem texto em seu projeto Adobe XD, pode começar a alterar as propriedades do texto. Essas propriedades incluem Família da fonte, Tamanho da fonte, Peso da fonte, Alinhamento, Espaçamento entre caracteres (kerning e rastreamento), Espaçamento entre linhas (entrelinha), Preenchimento, Borda (traço), Sombra (sombra) e Desfoque de fundo. Então, vamos revisar como essas propriedades são aplicadas. Sobre legibilidade e fonte [...]
Você pode usar o InDesign para criar e modificar gráficos de código QR. Os códigos QR são uma forma de código de barras que pode armazenar informações como palavras, números, URLs ou outras formas de dados. A usuária escaneia o código QR usando sua câmera e software em um dispositivo, como um smartphone, e o software faz uso [...]
Assim como no Adobe Illustrator, as pranchetas do Photoshop oferecem a capacidade de criar páginas ou telas separadas em um documento. Isso pode ser especialmente útil se você estiver criando telas para um aplicativo móvel ou um pequeno folheto. Você pode pensar em uma prancheta como um tipo especial de grupo de camadas criado com o painel Camadas. Seu […]
Empacotar texto no Adobe Illustrator CC não é exatamente o mesmo que embrulhar um presente - é mais fácil! Uma quebra automática de texto força o texto a envolver um gráfico, conforme mostrado nesta figura. Esse recurso pode adicionar um pouco de criatividade a qualquer peça. O gráfico está forçando o texto a envolvê-lo. Primeiro, crie [...]
Ao projetar no Adobe Illustrator CC, geralmente você precisa que uma forma tenha um tamanho exato (por exemplo, 2 x 3 polegadas). Depois de criar uma forma, a melhor maneira de redimensioná-la para medidas exatas é usar o painel Transformar, mostrado nesta figura. Selecione o objeto e escolha Janela → Transformar para […]
Aprenda como aplicar transparência a gráficos SVG no Illustrator. Explore como gerar SVGs com fundos transparentes e aplicar efeitos de transparência.
Depois de importar suas imagens para o Adobe XD, você não tem muito controle de edição, mas pode redimensionar e girar as imagens como faria com qualquer outra forma. Você também pode arredondar facilmente os cantos de uma imagem importada usando os widgets de canto. Mascarando suas imagens, definindo uma forma fechada [...]
