Divi'nin Tasarım Seçenekleriyle Dokulu Arka Planlar Nasıl Oluşturulur ve Kullanılır

Bugünün Divi eğitiminde, basit dokulu arka planları nasıl oluşturabileceğinizi ve web sitenizin biraz daha özgün görünmesini sağlamak için bunları bölümleriniz için arka plan olarak nasıl kullanabileceğinizi göstereceğiz. En son ücretsiz Öğrenim Yönetimi Düzenimize göz atarsanız, tüm sayfalarda dokulu bir arka plan kullandığımızı göreceksiniz.

Şimdi size Photoshop ile yeniden oluşturacağımız iki tür doku göstererek başlayacağız; şekillerle yapılan dokular ve fırçalarla yapılan dokular. Bunu nasıl yapacağınızı öğrendikten sonra istediğiniz kadar yaratıcı olabilir ve özgün dokulu arka planlar oluşturabilirsiniz. Bundan sonra, dokulu arka planları ve Divi'nin tasarım seçeneklerini birleştirerek nasıl çarpıcı sonuçlar yaratabileceğinizi göstereceğiz.

Şekillerle Yapılan Görüntü Sonucu

Photoshop ile nasıl oluşturulacağını göstereceğimiz ilk resim şuna benzer:

Divi'nin Tasarım Seçenekleriyle Sonuç

Divi'ye entegre edildikten sonra, aşağıdaki gibi çarpıcı sonuçlar elde edebilirsiniz:

Fırçalarla Yapılan Görüntü Sonucu

Yapacağımız ikinci görüntü şuna benziyor:

Divi'nin Tasarım Seçenekleriyle Sonuç

Ve web sitenizde kullanırken aşağıdaki güzel sonucu verebilir:

Divi'nin Tasarım Seçenekleriyle Dokulu Arka Planlar Nasıl Oluşturulur ve Kullanılır

Youtube Kanalımıza Abone Olun

Photoshop ile Dokulu Arka Plan Oluşturun

Şekillerle Yapılan

Size nasıl yeniden oluşturulacağını göstereceğimiz ilk dokulu arka planın üzerinde çoğunlukla Çokgen Kement Aracı ve Silgi Aracı ile oluşturulmuş şekiller bulunur. Aşağıdaki sonucu nasıl oluşturacağınız konusunda size adım adım rehberlik edeceğiz:

Yeni dosya

Photoshop'u açın ve yeni bir dosya ekleyerek başlayın. Bu dosyanın 1920 piksel genişliğe ve 847 piksel yüksekliğe ihtiyacı olacaktır.

Arka Plan Rengi Ekle

Ardından, az önce oluşturduğunuz dosyaya bir arka plan rengi ekleyin. Tüm süreç boyunca biraz daha koyu gri renkler kullandığınızdan emin olun. Biraz daha koyu bir renk kullanmak önemlidir, çünkü bu yazının ilerleyen bölümlerinde Divi tasarım seçeneklerini de eklerken size yardımcı olacaktır. Bu örnekte, arka plan rengi olarak '#626262' kullandık ve rengi katmana eklemek için Paint Bucket Tool'u kullandık.

2. Katman Ekle

İlk katmanın hemen üstüne yeni bir katman ekleyerek devam edin.

İlk Şekli Katman 2'ye Ekleyin

Ardından Polygonal Lasso Tool'u seçin ve Layer 2 seçiliyken bir şekil oluşturmaya başlayın.

Bittiğinde, Boya Kovası Aracını seçin ve seçilen parçayı renklendirmek için '#747474' kullanın.

3. Katman Ekle

Ardından, Katman 2'nin hemen üstüne başka bir katman ekleyin.

İkinci Şekil Katmanı 3'ü ekleyin

Polygonal Lasso Tool'u kullanarak aşağıdaki baskı ekranındaki gibi başka bir şekil oluşturarak devam edin.

Paint Bucket Tool'u seçin ve bu sefer '#6a6a6a'yı kullanın.

Şimdiye kadar, resminiz şöyle görünmelidir:

Katman 3'te Silgi Aracını Kullanın

Devam ederek, Katman 3 seçiliyken Silgi Aracını seçin.

Silgi Aracını, %0 sertliğe ve 338 piksel boyutuna sahip bir fırça ile birlikte kullanın.

Ardından devam edin ve gitmek istediğiniz alanı silin. Katman 2 ve Katman 3 arasında bir geçişi görebileceğiniz Katman 3'ün yalnızca küçük bir bölümünü kasıtlı olarak bıraktık.

Katmanları Çoğalt, Dönüştür, Döndür ve Karşı Tarafa Yerleştir

Artık sol tarafı oluşturduğumuza göre, diğer taraf çok daha hızlı gidecek. Aynı olmasını istiyoruz, bu yüzden hem Katman 2'yi hem de Katman 3'ü seçeceğiz. Ardından katmanları çoğaltacağız.

Kopyalandıktan sonra, bunların katman listenizde göründüğünü göreceksiniz.

Her iki kopya katmanı seçiliyken Düzen > Dönüştür > 180° Döndür'e gidin ve katmanları görüntünün diğer tarafına sürükleyin.

Web için Kaydet

Geriye sadece görüntüyü kaydetmek kalıyor. Bunu yapmak için Dosya > Dışa Aktar > Web için Kaydet'e tıklayın .

Son olarak, dosyanın bir JPG veya PNG dosyası olduğundan emin olun ve kaydedin.

Fırçalarla Yapılan

Ardından, fırçaları kullanarak dokulu arka planların nasıl oluşturulacağını göstereceğiz. Size nasıl yeniden oluşturulacağını göstereceğimiz dokulu arka plan bu durumda şöyle görünür:

Yeni dosya

1920 piksel genişlik ve 847 piksel yükseklik kullanarak yeni bir belge oluşturarak yeniden başlayın.

Arka Plan Rengi Ekle

Bu yapıldıktan sonra, '#8f8f8f' renk koduyla ilk katmana bir arka plan ekleyin.

Çevrimiçi Eşleşen Fırçayı Arayın

Bir sonraki adım, kahraman bölümünüzün stiline uyan bir fırça bulmaktır. Çarpıcı ve aynı zamanda ücretsiz olan birçok ücretsiz Photoshop fırçası var. Bu eğitimde kullanacağımızı aşağıdaki sayfaya giderek bulabilir ve indirebilirsiniz.

Fırça Yükle

Bilgisayarınızda ABR dosyasını bulun ve fırçaları yüklemek için Photoshop'a gidin. Düzen > Ön Ayarlar > Hazır Ayar Yöneticisi > Fırçalar > Yükle'yi seçin ve bilgisayarınıza kaydettiğiniz ABR dosyasını seçin.

2. Katman Ekle

Bittiğinde, Katman 1'in hemen üstüne başka bir katman ekleyin.

Fırçayı En Açık Renkle Kullanın

Ardından, Fırça Aracını seçerek istediğiniz dokulu arka planı oluşturmak için fırçanızı kullanmaya başlayabilirsiniz.

600px boyutunda istediğiniz fırçayı seçin ve %60 opaklık kullanın.

'

Kullanacağımız ilk renk '#a0a0a0'. Devam edin ve resminizde ilk fırça katmanını yapın.

Aynı Fırçayı Daha Koyu Bir Renkle Kullanın

Ardından, önceki rengi '#ababab' ile değiştirin ve aynı şeyi yapın.

En Koyu Renkle Aynı Fırçayı Kullanın

Son olarak, dokulu arka planınızı bitirmek için '#686868' rengini kullanmanız gerekecek.

Web için Kaydet

Artık dokulu arka planınız bittiğinde, yapılacak tek şey görüntüyü kaydetmek. Bunu yapmak için Dosya > Dışa Aktar > Web için Kaydet öğesini seçin .

Bir kez daha, resminizi JPG veya PNG dosyası olarak kaydetmek isteyip istemediğinizi seçin.

Bölümlere Dokulu Arka Planlar Ekleyin

Şekillerle Yapılan Dokulu Arka Plan

Görüntüleri oluşturduktan sonra tam istediğiniz sonucu elde etmek için Divi'nin arka plan ayarlarıyla oynayabilirsiniz. Şekillerle yapılan dokulu arka plan için, gradyan renklerden biri ortada, diğeri arka plan resmimizle uyumlu olacak şekilde radyal bir gradyan türü seçeceğiz.

Degrade Arka Plan

Bölümünüz için aşağıdaki gradyan arka planını kullanın:

• İlk Renk: #474ab6
• İkinci Renk: #9271f6
• Gradyan Türü: Radyal
• Radyal Yön: Merkez
• Başlangıç ​​Konumu: %41
• Bitiş Konumu: %100

Görüntü Karıştırma Seçenekleri

Ardından resmi yükleyin ve aşağıdaki ayarları kullanın:

• Arka Plan Resmi Boyutu: Kapak
• Arka Plan Resmi Konumu: Merkez
• Arka Plan Resmi Tekrarı: Tekrar Yok
• Arka Plan Resmi Karışımı: Yer Paylaşımı

Fırçalarla Yapılan Dokulu Arka Plan

Fırçalarla yapılan dokulu arka plan için kullanacağımız gradyan arka planı doğrusaldır. Arka plan görüntüsüyle uyumlu olarak kullanılan rengi biraz ayıracak ince bir geçiş yapacağız.

Degrade Arka Plan

Bölüm ayarlarını açın ve Arka Plan alt kategorisi için aşağıdaki ayarları kullanın:

• İlk Renk: #474ab6
• İkinci Renk: #9271f6
• Gradyan Türü: Doğrusal
• Gradyan Yönü: 270deg
• Başlangıç ​​Konumu: %70
• Bitiş Konumu: %100

Görüntü Karıştırma Seçenekleri

Ardından, arka plan resmini yükleyin ve onunla birlikte aşağıdaki ayarları kullanın:

• Arka Plan Resmi Konumu: Merkez
• Arka Plan Resmi Tekrarı: Tekrar Yok
• Arka Plan Resmi Karışımı: Yer Paylaşımı

Sonuç

Şimdi tüm adımların üzerinden geçtik, hadi bir kez daha sonuca bir göz atalım.

Şekillerle Yapılan Görüntü Sonucu

Divi'nin Tasarım Seçenekleriyle Sonuç

Fırçalarla Yapılan Görüntü Sonucu

Divi'nin Tasarım Seçenekleriyle Sonuç

Son düşünceler

Bu gönderide, web sitenizi daha özgün hissettirmek için dokulu arka planları nasıl kullanabileceğinizi gösterdik. Photoshop ile iki tür dokuyu nasıl oluşturabileceğinizi gösterdik ve ardından Divi'nin tasarım seçenekleri ile bunları bölümlerinizde nasıl kullanabileceğinizi gösterdik. Herhangi bir sorunuz veya öneriniz varsa; Aşağıdaki yorum bölümünde bir yorum bıraktığınızdan emin olun!

Büyük bir duyuruyu, faydalı ipucunu veya Divi freebie'sini asla kaçırmamak için e-posta bültenimize ve YouTube kanalımıza abone olmayı unutmayın!

WEB-DESIGN / Shutterstock.com tarafından Öne Çıkan Görsel