Creare modelli piastrellabili per l'immagine di sfondo del sito Web: 8 passaggi

2024 Autore: John Day | [email protected]. Ultima modifica: 2024-01-30 10:06

Ecco un metodo diretto e semplice (credo) per creare immagini che possono essere affiancate senza sembrare troppo "a griglia". Questo tutorial fa uso di Inkscape (www.inkscape.org), un editor di grafica vettoriale open source. Immagino che questo metodo possa essere applicato anche a costosi programmi di grafica vettoriale come Adobe Illustrator. Ehi, sono i tuoi soldi.

Passaggio 1: imposta il documento

Dopo aver aperto Inkscape, vorrai impostare le proprietà del documento. ([File -> Proprietà documento]) Innanzitutto, modifica la larghezza e l'altezza del documento in un numero con cui è più facile lavorare. Per questo tutorial, ho creato un'immagine quadrata, ma qualsiasi proporzione andrà bene. Successivamente, ti consigliamo di impostare la griglia. Nelle versioni precedenti di Inkscape, era possibile una sola griglia. Nelle versioni più recenti, dovrai creare una nuova griglia. Modificare la spaziatura della griglia in modo che questi valori si dividano equamente nei valori della larghezza e dell'altezza del documento. Poiché questa è arte vettoriale, le dimensioni tecnicamente non contano, ma in pratica, sarà più facile concettualmente con numeri più grandi. In questo tutorial, ho usato un'immagine di 500x500px e la mia griglia è a intervalli di 10px. Infine, assicurati che l'opzione "Abilita snapping" sia selezionata.

Passaggio 2: strumento Rettangolo

Usa lo strumento rettangolo per disegnare un quadrato/rettangolo che occupi l'intera dimensione del documento. Un grande valore di spaziatura della griglia (vedere il passaggio precedente) farà in modo che lo strumento rettangolo si agganci facilmente ai bordi del documento.

Passaggio 3: clonazione del motivo

Group])", "top":0.38721804511278196, "left":0.354, "height":0.35902255639097747, "width":0.372}]">

Aggiungi l'immagine che vuoi avere nel tuo modello. Se la tua immagine è un file SVG, di solito puoi semplicemente trascinarlo e rilasciarlo sul documento aperto. Crea un clone di questa immagine. ([Modifica -> Clona -> Crea clone] oppure puoi premere Alt+D) Sposta l'immagine originale in modo che non interferisca con il tuo spazio di lavoro. Sposta l'immagine clonata nel quadrato e crea alcune copie del clone. Il motivo per l'utilizzo dei cloni invece delle copie dell'originale apparirà più avanti. Ecco un modo semplice per fare copie nello spazio inchiostro: trascina l'oggetto da copiare e premi la barra spaziatrice per rilasciare una copia in quel punto (tieni premuto il pulsante del mouse). In genere, probabilmente non sono necessarie più di 2 o 3 copie per creare il motivo. Come puoi vedere, avevo 3 copie dell'immagine ma ho finito per eliminarne una in seguito. Quando pensi di averne abbastanza, raggruppa questi elementi insieme.

Passaggio 4: più clonazione

Riattiva lo snap se lo hai disabilitato nel passaggio precedente, come ho fatto io. Nello screenshot non vedi la griglia, ma è abilitata. Seleziona il gruppo di oggetti che hai appena creato e crea un clone di quel gruppo. Allinea i bordi del clone con il bordo della pagina e continua a rilasciare copie di il clone fino ad avere almeno una griglia 3x3 di cloni attorno all'originale nel mezzo.

Passaggio 5: traslocatori esperti

Ora che hai diffuso i cloni, è il momento di appianare il tuo schema. In questo momento lo schema sembra piuttosto a blocchi e troppo regolare, quindi vogliamo distribuire un po' le cose. Per spostare gli oggetti che si trovano all'interno di un gruppo, il metodo più semplice sarebbe quello di separare prima gli oggetti, spostare l'oggetto in questione, e quindi raggruppare nuovamente gli oggetti. Tuttavia, questo interromperà i collegamenti ai cloni. Invece, vogliamo mantenere intatto il gruppo durante la manipolazione di singoli oggetti all'interno del gruppo. Per fare ciò, tieni premuto il pulsante Control e fai clic sull'oggetto che desideri modificare. Ctrl-clic seleziona singoli oggetti all'interno di un gruppo. Se ora sposti gli oggetti, anche i cloni circostanti rifletteranno la modifica. Usando questo metodo, ora puoi spostare le immagini finché non sei soddisfatto del tuo modello generale. Puoi anche ridimensionare, ruotare o eliminare le immagini. Ho finito per eliminare una delle immagini perché mi servivano solo 2 per soddisfare lo schema.

Passaggio 6: informazioni sull'utilizzo di immagini clonate

Ho menzionato nel passaggio 3 che dovresti usare cloni invece di copie di immagini quando crei il quadrato centrale ("l'originale"). Il motivo è che se la tua immagine è essa stessa un gruppo di oggetti, il metodo Ctrl-clic per selezionare gli elementi raggruppati selezionerà i singoli oggetti dell'immagine. I cloni stessi non possono essere modificati (eccetto per dimensioni e colore) e quindi il metodo control-click farà sì che l'intero oggetto clone venga selezionato indipendentemente dal numero di oggetti di cui è composta l'immagine originale.

Passaggio 7: ritocchi finali

Come passaggio facoltativo, seleziona il quadrato di sfondo (Ctrl-clic) e imposta il colore di riempimento su nessuno (ovvero trasparente) o su qualsiasi colore desideri che abbia lo sfondo. ([Oggetto -> Riempi e traccia]) Ho anche diminuito l'opacità del gruppo nel suo insieme (seleziona con un clic regolare) in modo che il motivo possa essere sullo sfondo e non essere invadente. Infine, l'importante passaggio dell'esportazione. Apri la finestra di esportazione ([File -> Esporta bitmap]). Fare clic sul pulsante "Pagina". Questo esporterà solo le parti del documento che rientrano nei limiti della pagina, ovvero all'interno del quadrato dell'"originale". Modificare la dimensione della bitmap esportata se lo si desidera, quindi fare clic su "Esporta".

Passaggio 8: prodotto finale

Hai finito! Mettilo sul desktop, usalo per il tuo sito web o stampalo e vendilo come carta da parati! divertiti.