Crie padrões de tabela para a imagem de fundo do site: 8 etapas

2024 Autor: John Day | [email protected]. Última modificação: 2024-01-30 11:40

Aqui está um método direto e simples (eu acho) para criar imagens que podem ser colocadas lado a lado sem parecer muito "grade". Este tutorial faz uso do Inkscape (www.inkscape.org), um editor de gráficos vetoriais de código aberto. Imagino que esse método também possa ser aplicado a programas de gráficos vetoriais caros, como o Adobe Illustrator. Ei, é o seu dinheiro.

Etapa 1: configurar o documento

Depois de abrir o Inkscape, você desejará configurar as propriedades do documento. ([Arquivo -> Propriedades do documento]) Primeiro, altere a largura e a altura do documento para um número que seja mais fácil de trabalhar. Para este tutorial, criei uma imagem quadrada, mas qualquer proporção servirá. Em seguida, você desejará configurar a grade. Em versões anteriores do Inkscape, havia apenas uma grade possível. Em versões mais recentes, você precisará criar uma nova grade. Altere o espaçamento da grade para que esses valores se dividam uniformemente nos valores de largura e altura do documento. Geralmente, é uma boa ideia trabalhar a partir de uma imagem grande e, em seguida, reduzir conforme necessário. Por se tratar de arte vetorial, o tamanho tecnicamente não importa, mas, na prática, será mais fácil conceitualmente com números maiores. Neste tutorial, usei uma imagem de 500x500px e minha grade está em intervalos de 10px. Por fim, certifique-se de que a opção "Ativar ajuste" esteja marcada.

Etapa 2: Ferramenta Retângulo

Use a ferramenta retângulo para desenhar um quadrado / retângulo que ocupe o tamanho total do documento. Um grande valor de espaçamento de grade (consulte a etapa anterior) fará com que a ferramenta retângulo se encaixe facilmente nas bordas do documento.

Etapa 3: clonagem do padrão

Grupo]) "," superior ": 0,38721804511278196," esquerda ": 0,354," altura ": 0,35902255639097747," largura ": 0,372}]">

Adicione a imagem que você deseja ter em seu padrão. Se a sua imagem for um arquivo SVG, geralmente você pode simplesmente arrastá-lo e soltá-lo no documento aberto. Crie um clone dessa imagem. ([Editar -> Clonar -> Criar clone] ou você pode pressionar Alt + D) Mova a imagem original para fora do caminho para que não interfira em sua área de trabalho. Mova a imagem clonada para o quadrado e crie algumas cópias do clone. A razão para usar clones em vez de cópias da origem ficará aparente mais tarde. Esta é uma maneira fácil de fazer cópias no inkspace: arraste o objeto a ser copiado e pressione a barra de espaço para soltar uma cópia naquele local (mantenha o botão do mouse pressionado). Geralmente, você provavelmente não precisa de mais de 2 ou 3 cópias para criar o padrão. Como você pode ver, eu tinha 3 cópias da imagem, mas acabei deletando uma depois. Quando você achar que tem o suficiente, agrupe esses itens.

Etapa 4: mais clonagem

Reative o encaixe se você o desativou na etapa anterior, como eu fiz. Na captura de tela você não vê a grade, mas ela está ativada. Selecione o grupo de objetos que acabou de criar e faça um clone desse grupo. Alinhe as bordas do clone com a borda da página e continue soltando cópias de o clone até que você tenha pelo menos uma grade 3x3 de clones ao redor do original no meio.

Etapa 5: Movimentadores Especialistas

Agora que você espalhou os clones, é hora de suavizar seu padrão. No momento, o padrão parece um tanto em blocos e muito regular, então queremos espalhar as coisas um pouco. Para mover objetos que estão dentro de um grupo, o método mais direto seria primeiro desagrupar os objetos, mover o objeto em questão, e, em seguida, reagrupar os objetos. No entanto, isso quebrará os links para os clones. Em vez disso, queremos manter o grupo intacto enquanto manipulamos objetos únicos dentro do grupo. Para fazer isso, segure o botão Controle e clique no objeto que deseja modificar. Clique com o botão direito do mouse e seleciona objetos individuais dentro de um grupo. Se agora você mover os objetos, os clones ao redor também refletirão a mudança. Usando este método, agora você pode mover as imagens até que esteja satisfeito com seu padrão geral. Você também pode redimensionar, girar ou excluir as imagens. Acabei apagando uma das imagens porque só precisava de 2 para cumprir o padrão.

Etapa 6: sobre como usar imagens clonadas

Mencionei na etapa 3 que você deve usar clones em vez de cópias de imagens ao criar o quadrado do meio ("o original"). O motivo é que, se sua imagem for um grupo de objetos, o método de controle e clique de seleção de itens agrupados selecionará os objetos individuais da imagem. Os clones em si não podem ser editados (exceto para tamanho e cor) e, portanto, o método Control-click fará com que todo o objeto clone seja selecionado, independentemente de quantos objetos a imagem original é composta.

Etapa 7: Toques finais

Como uma etapa opcional, selecione o quadrado de fundo (clique com a tecla Ctrl pressionada) e defina a cor de preenchimento como nenhuma (ou seja, transparente) ou qualquer cor que você deseja que tenha o fundo. ([Objeto -> Preenchimento e traço]) Eu também diminuí a opacidade do grupo como um todo (selecione por clique regular) para que o padrão possa ficar no fundo e não ser intrusivo. Por fim, a etapa importante da exportação. Abra a janela de exportação ([Arquivo -> Exportar bitmap]). Clique no botão "Página". Isso exportará apenas as partes do documento que estão dentro dos limites da página - ou seja, dentro do quadrado do "original". Altere o tamanho do bitmap exportado se desejar e clique em "Exportar".

Etapa 8: Produto final

Pronto! Coloque-o na área de trabalho, use-o no seu site ou imprima-o e venda-o como papel de parede! Divirta-se.