Ana video konularına göre kesilmiş kısa kliplerle İngilizce/Türkçe açıklamalar ve Aseprite ipuçları
▶ Orijinal Video 🖼️ Kare NotlarıHer bölüm kendi video klibini içerir. Videoyu izleyin, ardından altındaki İngilizce ve Türkçe metinleri okuyun. Sağdaki Aseprite ipuçları ile pratiğe dökebilirsiniz.
Hello there, in this video you'll learn everything a pixel art beginner should know. This video is part two of Pixel Art Short Courses and it's a compilation of shorts on the topic of pixel art basics. You have to avoid this rookie mistake if you want clean lines. The only thing that matters is consistency in thickness. One pixel thick lines are used the most. So how do we ensure that consistency? A single pixel has eight possible neighbors. Out of those it should only have one or two neighbors. If a pixel has more, like three neighbors, the line becomes thicker in that area and people call these unnecessary pixels 'doubles'. Aseprite also has a great feature that will help you out — by checking the Pixel Perfect property you will create clean lines without worries. Of course you can use the line tool, but that's not good enough if you want to become a true pixel art expert.
Merhaba, bu videoda piksel art başlangıcı için bilmeniz gereken her şeyi öğreneceksiniz. Bu video Pixel Art Kısa Kursları'nın ikinci bölümüdür ve piksel art temelleri konusundaki kısa videoların bir derlemesidir. Temiz çizgiler istiyorsanız bu acemi hatasından kaçınmalısınız. Önemli olan tek şey kalınlıkta tutarlılıktır. En çok tek piksel kalınlığındaki çizgiler kullanılır. Peki bu tutarlılığı nasıl sağlarız? Tek bir pikselin sekiz olası komşusu vardır. Bunlardan yalnızca bir veya iki komşusu olmalıdır. Eğer bir pikselin üç gibi daha fazla komşusu varsa, çizgi o bölgede kalınlaşır ve insanlar bu gereksiz piksellere 'doubles' (çiftler) der. Aseprite'da size yardımcı olacak harika bir özellik var — Pixel Perfect özelliğini aktif ederek endişe duymadan temiz çizgiler çizebilirsiniz. Tabii ki çizgi aracını kullanabilirsiniz ama gerçek bir piksel art uzmanı olmak istiyorsanız bu yeterli değildir.
Pixel Perfect kutusunu işaretleyin. Bu, çizim sırasında otomatik olarak çift pikselleri temizler.You have to understand the essence of straight lines. First, a diagonal straight line consists of sections like one or two pixels etc. You have to keep these sections as consistent as possible, both in length and in the ratio of appearance. In cases when you have to mix lengths of these sections, the maximum difference is one pixel. So if your line has a section that is 2 pixels longer than any other section, you've messed up and your line won't be straight. Here's a test you can do: duplicate and connect your line to itself, then zoom out and you will easily notice the difference. So if you only use 90 and 45 degree angles, rethink your decision. And you might ask yourself why not just use the line tool? Don't trust the tools blindly. Yes, Aseprite has wonderful tools but like all other software it was coded by people and thus is prone to human error. Allow me to show you this on a simple circle example. This one was created using Aseprite's ellipse tool — it is 13 pixels in diameter. And the other one was custom made, same in size but a bit different. Personally I think the custom one looks a bit more round. Which one looks better to you?
Düz çizgilerin özünü anlamanız gerekiyor. İlk olarak, çapraz bir düz çizgi bir veya iki piksel gibi bölümlerden oluşur. Bu bölümleri hem uzunluk hem de görünüm oranı açısından mümkün olduğunca tutarlı tutmalısınız. Bölüm uzunluklarını karıştırmanız gereken durumlarda, maksimum fark bir piksel olmalıdır. Eğer çizginizde diğer bölümlerden 2 piksel daha uzun bir bölüm varsa, hata yapmışsınız demektir ve çizginiz düz olmayacaktır. İşte yapabileceğiniz bir test: çizginizi kopyalayıp kendisine bağlayın, sonra uzaklaştırarak farkı kolayca görebilirsiniz. Yalnızca 90 ve 45 derece açılar kullanıyorsanız, kararınızı yeniden düşünün. Neden çizgi aracını kullanmıyorsunuz diye sorabilirsiniz. Araçlara körü körüne güvenmeyin. Evet, Aseprite harika araçlara sahip ama diğer tüm yazılımlar gibi insanlar tarafından kodlanmıştır ve insan hatasına açıktır. Bunu basit bir daire örneğinde göstereyim. Bu, Aseprite'ın elips aracıyla oluşturuldu — 13 piksel çapında. Diğeri ise elle yapıldı, aynı boyutta ama biraz farklı. Kişisel olarak elle yapılanın biraz daha yuvarlak göründüğünü düşünüyorum. Hangisi size daha iyi görünüyor?
Ctrl+C ile kopyalayın, yapıştırıp uç uca ekleyin. View > Zoom Out ile uzaklaştırarak düzensizlik var mı kontrol edin.L kısayolunu kullanın.Using outlines is not only an artistic choice but also a game design choice. Here we have the same rock with three different choices. On the left, when we don't use outline it blends quite nicely with the grass, which is useful for non-interactable objects. In the middle we have a full outline which covers the entire rock, making it more visible — it pops from the background and that's quite useful for interactable objects. On the right we have a partial outline where the object is still quite visible but because we erase the outline on the bottom edge, the rock feels more connected to the ground, which is quite useful for non-interactable objects that could be used as a landmark in the game. But we still have one important choice — most people only use black outlines, however you can also use white outlines, you can use colored outlines, meaning where the object is hitting the light the outline would be lighter, and where it is in the shadow the outline will be darker.
Kenar çizgisi (outline) kullanımı yalnızca sanatsal bir seçim değil, aynı zamanda bir oyun tasarımı kararıdır. Burada aynı kayayı üç farklı seçenekle görüyoruz. Solda outline kullanmadığımızda çimle güzelce harmanlanıyor — bu etkileşilemeyen nesneler için kullanışlıdır. Ortada tüm kayayı kaplayan tam bir outline var, bu onu daha görünür kılıyor — arka plandan öne çıkıyor ve etkileşimli nesneler için çok kullanışlı. Sağda kısmi outline var — nesne hâlâ oldukça görünür ama alt kenardan outline'ı sildiğimiz için kaya zemine daha bağlı hissettiriyor, bu da oyunda işaret noktası olarak kullanılabilecek etkileşilemeyen nesneler için kullanışlı. Ama hâlâ önemli bir seçimimiz var — çoğu kişi yalnızca siyah outline kullanır, ancak beyaz outline, renkli outline da kullanabilirsiniz. Nesnenin ışık aldığı yerde outline daha açık, gölgede kaldığı yerde ise daha koyu olur.
Edit > Stroke > Selection ile otomatik outline ekleyin.Edit > Replace Color ile bölgesel olarak değiştirebilirsiniz.Eraser (E) ile alt kenarları silin.This is a standard pixel size, however here on the side each pixel is actually 2x2, in other words four pixels. Beginners often do this when they want to have a larger object and they just don't feel like drawing it from scratch — then they just take the object, resize it to the size they want, and call it a day. That's not how pixel art works. Once you understand basic geometric shapes you can draw pretty much anything. There are a few simple rules you can follow to ensure good shading. For a cube, it's one side one color. Why is that? Because every side of the cube is flat, and the only thing that matters is the angle of this side to the light source. In this case it's on the top left side, so the top side will be in the light tone, the left side will be in the mid tone, and the right side will be the darkest.
Bu standart bir piksel boyutudur, ancak burada her piksel aslında 2x2, yani dört pikseldir. Yeni başlayanlar genellikle daha büyük bir nesne istediklerinde bunu yapar — nesneyi alıp istedikleri boyuta yeniden boyutlandırırlar. Piksel art böyle çalışmaz. Temel geometrik şekilleri anladığınızda hemen hemen her şeyi çizebilirsiniz. İyi gölgeleme için izleyebileceğiniz birkaç basit kural vardır. Küp için kural: bir yüz, bir renk. Neden? Çünkü küpün her yüzü düzdür ve önemli olan tek şey bu yüzün ışık kaynağına göre açısıdır. Bu durumda ışık sol üstten geliyor, bu yüzden üst yüzey açık ton, sol yüzey orta ton ve sağ yüzey en koyu ton olacaktır.
Sprite > Sprite Size ile büyütmeyin — bu pikselleri 2x2 bloklara dönüştürür. Her zaman orijinal çözünürlükte çizin.Switch Colors (X) ile hızla aralarında geçiş yapın.Edit > Paste as New Reference ile bir küp referansını ekrana sabitleyin.You'll be often shading as spherical objects, meaning around curved surfaces. The first thing you need to decide is where the light source is. For a sphere, shading works in bands that curve around the surface. Starting from the light source and then curving away into the shadows. That's the most important principle — dividing into two rules: if a surface is flat use one color, if a surface is rounded use a gradient transition. The color palette for shading a sphere typically uses 3-5 tones from light to dark.
Sıklıkla küresel nesneleri, yani kavisli yüzeyleri gölgeleyeceksiniz. İlk karar vermeniz gereken şey ışık kaynağının nerede olduğudur. Küre için gölgeleme, yüzey boyunca kıvrılan bantlar şeklinde çalışır. Işık kaynağından başlayıp gölgelere doğru kıvrılır. Bu en önemli prensiptir — iki kurala ayrılır: yüzey düzse tek renk kullanın, yüzey yuvarlatılmışsa gradyan geçiş kullanın. Bir küreyi gölgelemek için renk paleti genellikle açıktan koyuya 3-5 ton kullanır.
V (Value) değerini düşürerek koyu tonları hızla oluşturun.Edit > FX > Color Curve ile mevcut renklerin parlaklığını toplu ayarlayın.Shading modunu kullanarak tek tuşla aynı rengin koyusuna/açığına geçebilirsiniz.Shading a cylinder should be straightforward if you know just two simple rules. Because cylinders are used a lot of times when creating organic things like humans, it's really important. First, you need to understand the structure of the cylinder — it's essentially a circle stretched along one axis. So the shading follows that axis. The light hits one side and gradually transitions across. For a horizontal cylinder, the light and shadow change horizontally. For a vertical cylinder, it changes vertically. Just like a cone, shading follows the same principle but narrows toward the tip. Now, let's put this into practice. We have a truck — I can identify the front part as shapes: cylinders for pipes, a cone for the tip of the pencil, cubes for the body. By combining basic shape shading, you create complex objects.
Silindir gölgeleme iki basit kuralı bilirseniz kolay olacaktır. Silindirler, insan vücudu gibi organik nesneler oluştururken çok sık kullanıldığı için gerçekten önemlidir. Öncelikle silindirin yapısını anlamalısınız — aslında tek eksen boyunca uzatılmış bir dairedir. Bu yüzden gölgeleme o ekseni takip eder. Işık bir tarafı vurup kademeli olarak geçiş yapar. Yatay bir silindirde ışık ve gölge yatay olarak değişir. Dikey bir silindirde dikey olarak değişir. Tıpkı koni gibi, gölgeleme aynı prensibi takip eder ama uca doğru daralır. Şimdi bunu pratiğe dökelim. Bir kamyonetimiz var — ön kısmını şekiller olarak tanıyabilirim: borular için silindirler, kalemin ucu için koni, gövde için küpler. Temel şekil gölgelemeyi birleştirerek karmaşık nesneler yaratırsınız.
Ink açılır menüsünden Shading seçin → sol tıkla koyultma, sağ tıkla aydınlatma. Gölge bantları uygulamak için idealdir.View > Symmetry Options ile dikey/yatay simetri açın — silindir çiziminde çok yardımcı olur.Contour Tool (D) ile kapalı alanları hızlıca doldurun.Where exactly is the light source? The common mistake I see from beginners is that if the light source is from above, they create a gradient from light to shadow. Why is this wrong? It's because the only thing that matters for flat surfaces is the angle to the light source. That's where the highlight comes in. A highlight is where the surface can directly reflect light into your eyes. For metal objects, highlights are sharp and bright. For wood or stone, they're soft and diffused. For glass, they're very bright, almost white. Let's look at a familiar scene from Pokémon Red — notice where the highlight is, here on the edge of the table.
Işık kaynağı tam olarak nerede? Yeni başlayanlardan gördüğüm yaygın hata şu: ışık kaynağı yukarıdaysa, ışıktan gölgeye bir gradyan oluşturuyorlar. Bu neden yanlış? Çünkü düz yüzeylerde önemli olan tek şey ışık kaynağına olan açıdır. İşte bu noktada highlight devreye girer. Highlight, yüzeyin ışığı doğrudan gözünüze yansıtabildiği noktadır. Metal nesnelerde highlight'lar keskin ve parlaktır. Ahşap veya taşta yumuşak ve dağınıktır. Camda çok parlak, neredeyse beyazdır. Pokémon Red'den tanıdık bir sahneye bakalım — highlight'ın nerede olduğuna dikkat edin, masanın kenarında.
Layer > New Reference Layer.Ctrl+Shift+H ile pixel grid'i açık tutun.Now that we have learned how to shade basic geometric shapes, we have to expand upon it. First thing you should be doing is trying to fit whatever you need into basic shapes. For example, we have this front part of the truck — I can identify gum for the wooden part, a cylinder for the body, and lastly we have a cone for the tip. Shading is not enough — it just conveys information about the shape and its relation to the light source. Before we can start creating objects we also need a texture, a material. A basic practice is to study plenty of materials: metal is shiny with sharp highlights, wood has grain patterns, stone is rough with subtle texture.
Artık temel geometrik şekilleri gölgelemeyi öğrendiğimize göre, bunu genişletmemiz gerekiyor. Yapmanız gereken ilk şey, ihtiyacınız olan her şeyi temel şekillere oturtmaya çalışmaktır. Örneğin, kamyonun ön kısmı var — ahşap kısım için dikdörtgen, gövde için silindir ve uç için koni tanımlayabilirim. Gölgeleme yeterli değildir — yalnızca şekil ve ışık kaynağıyla ilişki hakkında bilgi verir. Nesneler oluşturmaya başlamadan önce bir doku, bir malzeme de gereklidir. Temel bir uygulama çok sayıda malzemeyi incelemektir: metal parlak ve keskin highlight'lara sahiptir, ahşapta damar desenleri vardır, taş pürüzlü ve ince dokulu bir yapıdadır.
Edit > New Brush ile ahşap damar veya taş dokusu için özel fırça oluşturun.Eyedropper (I) ile gerçek fotoğraflardan renk örnekleyebilirsiniz.In pixel art, dithering's purpose is to create the illusion of more colors on the screen without actually increasing the color palette size. In the past it was invented only because of technological restrictions but nowadays it's just a stylistic choice. The most common form is the checkerboard pattern. Now let's talk about hue shifting. As the name suggests, when you're creating your color palette you must hue shift between midtones. For this orange color I will hue shift towards the light source's color — warmer, more yellow in the highlights. And the shadows shift toward cooler tones, more purple or blue. These colors have the same value but they are quite different. The most common mistake I see pixel art students making when creating color palettes is not hue shifting.
Piksel art'ta dithering'in amacı, renk paleti boyutunu gerçekten artırmadan ekranda daha fazla renk illüzyonu yaratmaktır. Geçmişte yalnızca teknolojik kısıtlamalar nedeniyle icat edildi ama günümüzde stilistik bir tercihtir. En yaygın formu checkerboard (dama tahtası) desenidir. Şimdi hue shifting'den bahsedelim. Adından da anlaşılacağı gibi, renk paletinizi oluştururken ara tonlar arasında renk kayması (hue shift) uygulamanız gerekir. Bu turuncu renk için highlight'larda ışık kaynağının rengine doğru — daha sıcak, daha sarıya yakın — kayma yapacağım. Gölgeler ise daha soğuk tonlara, mora veya maviye doğru kayar. Bu renkler aynı değere (value) sahip ama oldukça farklıdırlar. Piksel art öğrencilerinin renk paleti oluştururken yaptığı en yaygın hata hue shifting yapmamaktır.
Sort & Gradients > Create ile hue shift uygulanmış gradyan oluşturun.Palette Options > Load Palette ile yükleyin.Shading just conveys the information about the shape of the object and its relation to the light source. Before we can start creating objects we also need a texture, a material. A basic practice is to study materials. The dithering technique uses patterns of dots to create the illusion of more colors. The most basic form is a 50/50 checkerboard pattern — black and white alternating pixels that appear gray from a distance. You can also use 25% and 75% ratios for lighter and darker intermediate tones. Remember that dithering works best on larger areas like skies, grounds, and backgrounds. On small sprites it can look noisy.
Gölgeleme yalnızca nesnenin şekli ve ışık kaynağıyla ilişkisi hakkında bilgi verir. Nesneler oluşturmaya başlamadan önce bir doku, bir malzeme de gereklidir. Temel bir uygulama malzemeleri incelemektir. Dithering tekniği, daha fazla renk illüzyonu yaratmak için nokta desenleri kullanır. En temel formu %50/%50 checkerboard desenidir — uzaktan gri görünen siyah ve beyaz dönüşümlü pikseller. Daha açık ve daha koyu ara tonlar için %25 ve %75 oranları da kullanabilirsiniz. Dithering'in gökyüzü, zemin ve arka planlar gibi büyük alanlarda en iyi çalıştığını unutmayın. Küçük sprite'larda gürültülü görünebilir.
Paint Bucket (G) aracında Pattern seçeneğini aktifleştirin → checkerboard dithering otomatik uygulanır.Edit > New Brush ile kaydedin. Bu fırçayla boyayarak dithering yapabilirsiniz.Sprite > Color Mode > Indexed ile sınırlı paletle çalışarak dithering'in gerekliliğini deneyimleyin.The most common mistake I see pixel art students making when creating color palettes is not hue shifting. As the name suggests, when creating your color palette you must hue shift between midtones. For this orange color I will hue shift towards the light source's color for highlights and toward cooler tones for shadows. Let's talk about creating color palettes. Create a cohesive color palette where we start with a base color, then add hue-shifted lighter and darker variants. When creating color palettes, try to find existing palettes that inspire you — Lospec has a great collection. A cohesive color palette helps maintain consistency across your entire game.
Piksel art öğrencilerinin renk paleti oluştururken yaptığı en yaygın hata hue shifting yapmamaktır. Adından da anlaşılacağı gibi, paletinizi oluştururken ara tonlar arasında renk kayması uygulamanız gerekir. Bu turuncu renk için highlight'larda ışık kaynağının rengine, gölgelerde ise daha soğuk tonlara doğru kayma yapacağım. Renk paleti oluşturmaktan bahsedelim. Bir temel renkle başlayıp hue shift uygulanmış daha açık ve koyu varyasyonlar ekleyerek uyumlu bir renk paleti oluşturun. Palet oluştururken sizi ilham veren mevcut paletleri bulmaya çalışın — Lospec harika bir koleksiyona sahiptir. Uyumlu bir renk paleti tüm oyununuz boyunca tutarlılığı korumanıza yardımcı olur.
Palette Options (☰) > New Palette ile boş palet açın. Ramp oluşturmak için iki renk seçin → Sort & Gradients > Gradient..ase veya .gpl formatında Palette Options > Save Palette ile kaydedin.Palette Options > Load Palette ile yükleyin.View > Grayscale Preview (veya eklenti) ile paletinizin gri tonlama versiyonunu kontrol edin.Tiles are rectangular sprites that can be reused to quickly create landscapes. Now, antialiasing is an advanced technique in pixel art. The best way to learn it is to first understand lines without antialiasing and then try to recognize patterns. If I recognize this as a straight line, I can antialias one portion of it. Likewise, if I recognize this as a curvature I can antialias the middle of it. And then you just keep on going until your entire sprite is finished. The anti-aliasing color should always be between the two colors which we are anti-aliasing. Don't overdo it — subtle AA looks much better than heavy-handed AA.
Karolar (tiles), manzaraları hızlıca oluşturmak için yeniden kullanılabilen dikdörtgen sprite'lardır. Anti-aliasing, piksel art'ta ileri düzey bir tekniktir. Öğrenmenin en iyi yolu, önce anti-aliasing olmadan çizgileri anlamak, sonra desenleri tanımaya çalışmaktır. Bunu düz bir çizgi olarak tanıyorsam, bir kısmına anti-aliasing uygulayabilirim. Aynı şekilde bunu bir eğri olarak tanıyorsam, ortasına anti-aliasing uygulayabilirim. Sonra tüm sprite'ınız bitene kadar devam edersiniz. Anti-aliasing rengi her zaman yumuşattığımız iki rengin arasında olmalıdır. Abartmayın — ince AA, ağır AA'dan çok daha iyi görünür.
Sprite > Sprite Size ile boyut değiştirirken Nearest Neighbor interpolasyon seçin — Bilinear/Bicubic istenmeyen AA ekler.