Tospaa PixelCoding'i PCden ya da tabletten kullanmanızı öneririz.

Pixel Coding her yaştan sanatseverin ve kodseverin Pixel Art oluşturmasını sağlayan bir kodlama eğitimi ve piksel sanatı uygulamasıdır. Pixel Coding ile PixelArt ve hareketli pixel animasyonlar oluşturabilirsiniz.

Tospaa Script çocuk dostu Türkçe/İngilizce bir kodlama dilidir. Dil yapısında Scratch bloklarındaki Türkçe ifadeler öncelikli olarak tercih edilmiştir. Bu sayede çocukların blok kodlamadan metinsel kodlamaya geçişi kolaylaştırılmıştır. Ayrıca kod yapısı hataya mümkün olduğunca tolerans tanımaktadır.
ileri ileri() ileri(); komutlarının tümü çalışacaktır(Logo,Python,Javascript). Tavsiye edilen kullanım komut(); şeklinde olandır.

Alanımız 20 satır ve 20 sütündan oluşmaktadır. Soldan sağa sütünlar(x) ve yukarıdan aşağı satırlar(y) bulunur Tospaa başlangıçta 10. satır(y) 8. sütünda(x) bulunmaktadır. Aşağı indikçe satır numarası artar. Sağa gittikçe sütün numarası artar. Yönü yukarı doğrudur. Tospaa her konum ya da yön değişikliğinde sağdaki tospaa son konum ve yönü gösterir. Varsayılan renk mavidir.

Kutucuğa ileri(); yazıp klavyeden
< Enter > tuşuna basalım. Oldu bile :)

sağ(); ve sol(); komutları tospaanın yönünü ayarlar.
atla(); komutu bir kare atlamayı sağlar. Renk değiştirmek için yeşil(); sarı(); gibi tanımlı Türkçe renkleri kullanabilirsiniz. Tüm kodu bitirdiğinizde Kodu Derle butonu ile baştan çalıştırabilirsiniz.

Kare çizmenin birden fazla yolu vardır. İlk akla gelenler
Döngü KullanarakDöngü Kullanmadan
4 defa tekrarla
ileri();
ileri();
ileri();
ileri();
sol();
tekrarı bitir
ileri();
ileri();
ileri();
ileri();
sol();
ileri();
ileri();
ileri();
ileri();
sol();
ileri();
ileri();
ileri();
ileri();
sol();
ileri();
ileri();
ileri();
ileri();
sol();

Çizime başlamadan önce, kullanacağımız rengi seçmeliyiz. Renkler arasında;
mavi(); sarı(); turuncu(); yeşil(); kırmızı(); siyah(); beyaz(); kahverengi(); mor(); yer alıyor.
Bunlar dışında bir renk kullanmak istiyorsak; renk(renkkodu); şeklinde RGB kodunu gireriz.
Örnek olarak; renk(#752929); RGB kodlarını bulmak için ekranın sağında bir renk paleti bulunur.

Olmaz mı? Hemen sağ taraftaki elma simgesine tıkla. Kodlar otomatik olarak kod alanına yüklenecek. Derle butonuna tıklayıp nasıl çalıştığına bakabilirsin.

Tospaa başlangıçta 10. satır(y) 8. sütünda(x) bulunmaktadır. Aşağı indikçe satır numarası artar. Sağa gittikçe sütün numarası artar. Sağdaki tospaa simgesi o anki aktif adresi verecektir. Piksellerin üzerinde imleci beklettiğinizde o pikselin adresi üzerinde belirecektir.

Bazılarına Tospaa Bilgisayarsız Kodlama Oyunundan aşina olmalıyız. Kullanabileceğimiz komutlar ise şu şekilde:

-İleri
ileri();

Örnek olarak,
mor();
ileri();

dersek mor bir kare (piksel) boyamış oluruz. Aynı zamanda bu kod ilerlememize de yardımcı olur.

Aşağıdaki kod iki kez ilerlememize yardım eder:
mor();
ileri();
ileri();

-Sağ
sağ(); -Sol
sol(); Üstteki sağ ve sol kodları o yönlere doğru tospaayı çevirir.

Örnek olarak:
sarı();
ileri();
ileri();
sağ();
ileri();
sol();
ileri();
Üstteki kod bizim için dikey olarak “Z” harfine benzer bir şekil çizer.

-Boya
boya();
Örnek olarak,
mavi();
boya();
dersek bulunduğumuz kareyi maviye boyamış oluruz.

-Git
Seçmek istediğimiz kareyi, “git” ile seçebiliriz. “x” yerine boyamak istediğimiz sutün, “y” yerine de boyamak istediğimiz satırı yazarız.
git(x,y); “Git” komutu şu şekilde kullanılabilir:
mor();
git(4,6)
boya();
Bu dördüncü sütün- altıncı satırı mor renge boyar. Ek olarak sadece x veya y ekseni üzerinde istediğimiz satır veya sütuna gidebiliriz.
gitx(x);
gity(y)
gitx(x);
Üstteki kod x ekseninde istediğimiz satıra gitmemizi sağlar. Örnek olarak:
mavi();
gitx(4);
boya();
Bu kod ile dördüncü satırı, mavi renge boyayabiliriz. gity(y);
Bu kod ise y ekseninde istediğimiz sütuna gitmemizi sağlar.

sarı();
gity(7);
boya();
Bu örneği çalıştırırsak, yedinci sütundaki kareyi sarı renge boyarız.

-X arttır
xarttır(miktar);
Bu kod ile şeklin, x konumundaki yerini değiştirebiliriz.Negatif değerler azatmak için kullanılır.
-Y arttır
yarttır(miktar); Bu kod ile şeklin, y konumundaki yerini değiştirebiliriz. Örnek olarak:
kırmızı();
ileri();
xarttır(1);
yarttır(2);
boya();
Bu kodu çalıştırırsak şekil, ilk konumundan bir satır ve iki sütun uzakta olacaktır.
Parantez içinde negatif değerler de kullanılabilirsiniz.

-Arkaplan
Bu komut ile arka planda değişiklikler yapabiliriz.
arkaplan(); Bu şekilde bir örnek verebiliriz:
mavi();
arkaplan();
Üstteki kod arkaplanı, mavi renge boyar.

Daha az sayıda kod yazmak için komutlarımızı döngüler arasına alabiliriz. Döngüler;

Kaç defa tekrar etmesini istiyorsak başına o sayıyı eklemeliyiz.


2 defa tekrarla
10 defa tekrarla
100 defa tekrarla
şeklindedir.
Sonsuz döngü için (aslında max 1000 defa)

sürekli tekrarla ifadesi kullanılır.

Bütün döngüleri aşağıdaki kod ile bitirmemiz gerekir.
tekrarı bitir


Örnek olarak:
2 defa tekrarla
yeşil();
ileri();
tekrarı bitir

Koşullar, çizim yaparken bilgisayarın karar vermesine yardımcı olur. Koşullar ile bilgisayara, "Eğer böyle bir durum ile karşılaşıyorsan, şu şekilde davranmanı istiyorum" deriz. Pixel Coding'de koşullar şu şekilde kullanılır:
-Eğer renk yoksa
eğer renk yoksa
-Eğer renk varsa
eğer renk varsa

Örnek olarak:
sürekli tekrarla
eğer renk yoksa
ileri();
eğer renk varsa
atla();
tekrarı bitir

Bu kod, herhangi bir renk görene kadar mavi boyayarak devam eder.

Eğer çizimi hızlandırmak veya yavaşlandırmak istersek;
-Yavaşla
yavaşla(); veya,
-Hızlan
hızlan(); komutlarını kullanabiliriz.

Standart bekleme süresi 200 mili saniyedir.

Renkler Komutları Komutlar Döngüler Koşullar
gizle(); mavi(); ileri(); sürekli tekrarla eğer renk varsa();
sarı(); sağ(); ..... defa tekrarla eğer renk yoksa();
turuncu(); sol(); tekrarı bitir
yeşil(); boya();  
kırmızı(); git(x,y);  
siyah(); gitx(x);  
beyaz(); gity(y);
kahverengi(); xarttır(miktar);
mor(); yarttır(miktar);
renk(renkkodu); arkaplan();
rastgele();
yavaşla();
hızlan();
atla();
sil();
ekranıtemizle();
Komutlar

  • renk seç
  • boya
  • ilerle

X:8 Y:10
Renkler: