Como extrair PNGs do arquivo Adobe Illustrator


13

Meu gráfico / web designer me deixou com um arquivo do Adobe Illustrator do meu site. Ela disse que seria fácil extrair as imagens como PNGs para que eu possa usá-las no meu HTML. Mas não consigo entender isso com muita facilidade.

As imagens parecem ser muitos desenhos vetoriais. Posso separá-los da arte circundante e selecionar todas as peças. Mas como salvar essa seleção como um arquivo PNG?

Btw .: Estou usando o Adobe Illustrator CS6.


Se você não conhece o Illustrator, deve realmente voltar ao designer e solicitar a entrega dos itens que pode usar.
— Scott

@ Scott - ela é extremamente temperamental e não quer trabalhar com alguém que precisa de PNGs em vez de um arquivo do Illustrator. Prefiro contratar outra pessoa para extrair as imagens para mim do que contratá-la novamente. Espero que seja realmente tão fácil quanto ela sugeriu e eu mesmo possa fazer isso rapidamente.
— às.

Eu não uso ilustrador, então não conheço a melhor abordagem. Mas se eu tivesse que extrair camadas vetoriais, provavelmente as copiaria e colaria em um programa diferente (fogos de artifício, photoshop) e usaria "Salvar para a Web".
— Yisela 15/10/12

Estranho, seu contrato não especificou em que formato você deseja os ativos? Ou pelo menos especifique o uso pretendido. Nesse caso, pode-se argumentar que a sua parte do contrato em outros casos não é tão simples. Se você solicitou recursos de impressão, não é de surpreender que você não obtenha imagens PNG.
— Joojaa

Respostas:


18
  1. Selecione o que você quer
  2. Ctrl+ G(Seleção de grupo)
  3. Ctrl+ C(Copiar)
  4. Ctrl+ N(Novo arquivo)
  5. Ctrl+ V(Colar)
  6. Clique em Arquivo> Salvar para Web e dispositivos e, à direita, alterne .JPG para .PNG e desmarque a parte inferior das opções .PNG , onde diz "Recortar na prancheta"

1
Tipo de dor, eu tenho que saber a resolução exata ou cortar o novo arquivo. Mas, caso contrário, exatamente o que estou procurando. Como faço para cortar?
— às.

Na verdade, não parece fácil. Não há como cortar no Illustrator. Tudo acima é ótimo, exceto a etapa 6; se eu salvar o arquivo, recebo o espaço em branco (pelo menos transparente) ao redor do objeto que estou tentando salvar. Não consigo adivinhar facilmente os pixels antes de criar um novo arquivo (existe uma maneira fácil?).
— às.

Encontrei a largura e a altura de uma seleção e posso criar um novo arquivo desse tamanho. O design colado não está centrado exatamente nessa nova tela, mas perto o suficiente para que eu possa me mover facilmente, eu acho.
— às.

Editou a resposta para explicar como fazer o corte facilmente. Deixe-me saber se isso resolve para você.
— Ryan

2
é no menu em Object> Artboard> Ajustar à Obra Bounds
— vahanpwns

5

Você poderia fazer isso mais rapidamente com scripts. Acabei de criar este script js para o Illustrator CS4. Espero que o CS6 possa executá-lo também.

  1. Copie o código abaixo para um novo arquivo com a extensão ".jsx", salve-o.
  2. Agora no AI, selecione o que deve ser exportado (apenas um elemento de uma vez; agrupe vários, se necessário)
  3. Execute o script (via arrastar e soltar ou Arquivo / scripts / Outro script ...)
  4. Concluído - As imagens exportadas foram salvas na pasta em que o arquivo ai está localizado.

NOTA:

  • A posição do objeto exportado será arredondada! Portanto, tenha cuidado ao salvar
  • funciona também para png24 ... substitua PNG8 por PNG24

    function exportFileToPNG(dest, artBoardIndex)
    {
        var exportOptions = new ExportOptionsPNG8(); // or ExportOptionsPNG24
        var type = ExportType.PNG8; // or ExportType.PNG24
        var file = new File(dest + ".png");
    
        exportOptions.artBoardClipping = true;
        exportOptions.antiAliasing = true;
        exportOptions.transparency = true;
        exportOptions.qualitySetting = 72;
        exportOptions.saveMultipleArtboards = false;
        exportOptions.artboardRange = "" + artBoardIndex;
        app.activeDocument.exportFile( file, type, exportOptions );
    }
    
    function execute()
    {
        if (app.documents.length == 0)
        {
            alert('No document open', 'Error');
            return;
        }
    
        if (app.activeDocument.selection.length == 0)
        {
            alert('Nothing selected', 'Error');
            return;
        }
    
        var selectedStuff = app.activeDocument.selection[0];
    
        // snap position to pixels
        selectedStuff.position = [ Math.round(selectedStuff.position[0]), Math.round(selectedStuff.position[1]) ];
    
        // create temporary artboad for exporting
        var docRef = app.activeDocument;
        var rect = selectedStuff.visibleBounds;
    
        try
        {
            docRef.artboards.add(rect);
        }
        catch(e)
        {
            alert('Could not create Artboard as step of export.', 'Failure');
            return;
        }
    
        // determine destination
        var destFolder = docRef.path;
        if(destFolder == "")
            destFolder = Folder.selectDialog('Select the folder to export to:');
    
        if(destFolder)
        {
            try
            {
                exportFileToPNG(destFolder + "/" + docRef.name, docRef.artboards.length);
            }
            catch(e) {}
        }
    
        // delete temp-artboard
        docRef.artboards.remove(docRef.artboards.length - 1);
    }
    
    execute();
    

Funciona bem para mim e eu não tinha (mais) erros até agora. Mas fazer backup das coisas não pode doer.


Woah! Funciona perfeito.
— Dennis G

Fez uma essência do código para fazer o download mais fácil: gist.github.com/koiyu/b53e3a186fb1158eb9b7 (NB mudou PNG8 para PNG24)
— Jari Keinänen

2

Use a ferramenta Fatia.

Crie fatias usando a ferramenta e use a caixa de diálogo Arquivo-> Salvar na Web ... (Ctrl-Shift-Alt S, Command-Shift-Alt S) para exportar as fatias. Na caixa de diálogo, clique duas vezes nas fatias que você criou, fornecendo a elas um nome de arquivo razoável.

Verifique se Exportar-> Fatias do usuário está selecionado e clique em Salvar. Escolha um diretório (eu gosto de usar uma pasta 'scratch' para qualquer saída de exportação.) O Illustrator criará um diretório chamado 'images' nessa pasta e haverá as fatias que você definiu no formato escolhido em Salvar Para tela da Web.


0

Salve na web e verifique se "Recortar na prancheta" não está selecionado. Isso fará o truque para o Adobe CC, não tenho certeza se o CS6 tem essa função.


-2

use este comando Ctrl + Shift + Alt + S


Bem-vindo ao GD.SE! Isso salvaria a imagem inteira, não apenas as partes selecionadas, não?
— Brendan
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.