Web İkonları

v0.7’de sitenin alt kısmına yerleştirmek üzere tasarladığım, web 2.0 button görünümüne sahip ikonları Dosyalar bölümünde Grafik dizininde “rss_xhtml_icons.psd” ve “valid_css_xhtml_icons.psd” dosyaları olarak bulabilirsiniz. (Her ne kadar sayfalar valid olmasa da 🙂 )

http://www.mfyz.com/Files/Grafik

Kullanımı Creative Commons 4.0 lisansına uygun olmalıdır. Lisans hakkında bilgi almak için de http://www.mfyz.com/lisans/ adresini ziyaret edebilirsiniz.

Kağıt üstü çalışmaları dijitalleştirmek

Kağıt üstü çalışma

Aslında pek yapmayız fakat ikon, logo gibi çalışmaları aslında kağıt üzerinde çalışarak başlamak, orada taslak çıkarmak her zaman daha iyidir. Bu işlemden sonra bilgisayara geçilir. Bu dökümanda, kağıt üstü çalışmalarını dijital ortama taşımayı anlatacağım. Uygulamasını, el çizimleriniz, karikatürleriniz, grafitileriniz için veya el yazınızı fonta çevirme gibi işlemler için kullanabilirsiniz.

Öncelikle kağıt üzerinde çizim, yazı ne yapmanız gerekiyorsa kağıdı çok kirletmeden yapınız. Yani çok fazla silgi kullanarak yıprattığınız kağıt üzerinde her ne kadar gözle görmesek de izler kalacaktır. Bunlar treshold işleminde ortaya çıkabilir.

Kağıt üzerindeki işinizi bitirdiğinizde tarayıcı ile veya yüksek çözünürlüklü (5 Megapiksel gayet yeterli) bir fotograf makinesi ile fotografını çekin. Bilgisayara aldığınız dosyayı photoshop ile açın (benzer fonksiyonlar/işlemler gimp, pixel, corel gibi yazılımlarda da mevcuttur).

Benim çizdiğim çalışma şu şekilde :

Okumaya devam et “Kağıt üstü çalışmaları dijitalleştirmek”

Gimp ile web animasyonu oluşturmak (gif)

Web Animasyonu?

Hani sitelerde reklam (banner) olarak görürüz ya, birkaç sahne vardır ve belirli sürelerde geçiş efektleri veya doğrudan geçerler. İşer o animasyonlar gif animasyonlarıdır (bilmeyenler için). Gif animasyonları aslında normal statik resim dosyalarından çok da farklı değildirler, içlerinde birden fazla resim varmış gibi bir paket şeklindedirler. Hangi resmin hangi sırayla görüntüleneceği, kaç saniye ekranda kalacağı gibi bilgiler içerirler. Bu dökümanda açık kaynak kodlu resim işleme yazılımı gimp ile web animasyonları yani gif yapımını anlatacağım.

Öncelikle hazırlayacağınız animasyondaki sahneleri kafanızda belirlemeniz gerek. Belirledikten sonra tek tek resimleri çizeceksiniz. Ya da hazırlayacaksınız. Kısa bir örnek vermek gerekirse ufak bir reklam animasyon tasarlıyorsanız bir artalan ve üzerinde değişen cümleler canlanır kafanızda. Artalanı yerleştirirsiniz ve cümleleri yerleştirerek sahnelerinizi oluşturabilirsiniz. Okumaya devam et “Gimp ile web animasyonu oluşturmak (gif)”

Photoshop ile grafikleri web için optimize etmek

Internette kullanacağımız grafiklerin boyutları her zaman için önemlidir. Grafikleri web için optimize etmeye yönelik çok fazla program var piyasada.. Bazıları çok kaliteli, fakat bunun için herhangi bir ekstra program kullanmanıza gerek yok.

Gimp kullanırken bile webde kullanacağım grafikleri photoshop ile optimize ediyordum. Photoshop’un save as web seçeneği ile çıkan pencere ile olacak bütün işimiz, Aynı zamanda bu mekanizmayı Adobe ImageReady programı ile de yapabilirsiniz. Şimdi gelelim nasıl olacağına ve detaylara.

Photoshop ile çizdiğimiz bir grafiği (örnek olarak şöyle bir çalışma yaptık) optimize etmek istiyoruz

Okumaya devam et “Photoshop ile grafikleri web için optimize etmek”

Gimp’te karanlık resimleri aydınlatmak

Bazen fotoğraf makinenizin lensine doğrudan güneş gelebilir veya ışığın gelme açısına göre çektiğiniz konum yanlış olabilir. Bu resimler genellikle ışık saçan objelerin belirgin, diğer kısımların karanlık kaldığı resimlerdir. Aslında sadece tonlardan dolayı biz öyle görürüz. Küçük bir çalışma ile ne kadar değişeceğini göreceksiniz.

Resmimizi açtıktan sonra bulunduğu katmanı hemen kopyalıyoruz, orjinal olan en altta kalacak şekilde çalışacağız.

Okumaya devam et “Gimp’te karanlık resimleri aydınlatmak”

Gimp’de yumuşak köşeli kutucuklar yapmak

Yumuşak köşeli kutucuk nasıl bişeydir, ne işe yarar?

Bu sitede gördüğünüz çoğu şey yumuşak köşelere sahip kutucuklar ile görüntülenmekte, bunun dışında butonlar ve üst menüde gördüğünüz tab şeklindeki menü de yumuşak köşelere sahip. Yumuşak köşeden kastım, dikdörtgen gibi sert köşeler yerine yuvarlatılmış dönüşlere sahip köşeli şekildir.
Bu dökümanda basit bir dikdörtgeni çeşitli yöntemlerle yumuşatıp köşelerini kuvarlatmayı göreceğiz. Okumaya devam et “Gimp’de yumuşak köşeli kutucuklar yapmak”

Gimp’te Perspektif aracı ve 3d küp yapımı

Perspektif aracı nedir, ne işe yarar?

Gimp ana penceresindeki ikonuna tıkladığınızda çıkan araç perspektif aracıdır. Bu araç sayesinde yaptığımız yüzeyleri, çalıştığımız fotografları perspektif açıdan oynayabiliyoruz. Yani, bir yüzeyi gerçekte nasılsa öyle görünüm kazandırıp düzeltebiliyoruz. Bu dökümanda perspektif aracını kullanarak 3 boyutlu bir küp yapacağız.

3 boyutlu küp nasıl görünür?

Bir küp bilindiği gibi 6 kare yüzeyden oluşan bir cisimdir. Biz gerçekte bu cisimlerin en fazla 3 yüzeyini görebiliriz. Bir küp’e köşesinden baktığımızda ne görürüz? 3 tane perspektif görünümlü kare görürüz. Gimp’te yapacağımız tek şey kare ve dikdörtgenleri perspektif aracı ile kenarları eşleşecek biçimde ayarlamak olacaktır.

Öncelikle kendimize küpün yüzeyinde kullanacağımız bir efekt seçmemiz gerek. Bu bir desen, sade bir renk veya geçiş efekti verilmiş bir yüzey olabilir. Gölgelendirmenin gerçekliği açısından geçiş efekti verilmiş yüzey daha çarpıcı olacaktır. Şimdi geçiş efekti verilmiş bir yüzey’e sahip küp’ü yapmaya başlayalım.

Okumaya devam et “Gimp’te Perspektif aracı ve 3d küp yapımı”