MakeCode Arayüzü

Bir cümlelik özet

MakeCode, micro:bit için blokları sürükleyip bırakarak program yazdığımız, yazdığımız programı bilgisayarda simülatörle test ettiğimiz ve hazır olunca gerçek karta yüklediğimiz ücretsiz bir editördür.

Neden önemli?

Bir önceki derste micro:bit'in üzerindeki parçaları tanıdık: 5×5 LED matrisi, A ve B düğmeleri, sensörler ve pinler. Fakat kart tek başına ne yapacağını bilmez. Ona ne yapması gerektiğini biz söyleriz. Bu talimatları yazdığımız yere editör denir.

MakeCode, tarayıcıda çalışan bir blok editörüdür. Scratch dersinden hatırlayacağın gibi, blokları sürükleyip birbirine geçirerek program kurarsın. Yani yeni bir dil öğrenmene gerek yok; daha önce gördüğün mantık burada da geçerli. Üstelik MakeCode aynı programı istersen JavaScript veya Python metniyle de gösterir. Bu ders, sonraki tüm micro:bit derslerinin çalışma masasıdır. Arayüzü iyi tanırsak, ilerideki animasyon, sensör ve radyo projelerinde vakit kaybetmeyiz.

MakeCode ekranı üç ana bölümden oluşur

makecode.microbit.org adresini bir tarayıcıda açtığında karşına üç bölümlü bir ekran çıkar. Bu üç bölümü tanımak, ilerleyen derslerde işini çok kolaylaştırır.

1. Simülatör (sol taraf)

Ekranın solunda küçük bir micro:bit resmi görürsün. Bu simülatör, yani gerçek kartın bilgisayardaki taklididir. Programını yazarken burada anında çalışır. Böylece elinde fiziksel bir micro:bit olmasa bile kodunun ne yaptığını görürsün.

Simülatördeki düğmelere fareyle tıklayabilir, ekrandaki LED'lerin yanmasını izleyebilirsin. Bir sıcaklık bloğu kullanırsan, simülatör sana bir kaydırıcı verir ve sıcaklığı elle değiştirmeni sağlar.

2. Blok kutusu (orta)

Ortadaki renkli liste, kullanabileceğin tüm blokların bulunduğu yerdir. Bloklar kategorilere ayrılmıştır ve her kategorinin kendi rengi vardır:

• Temel (Basic): Ekrana yazı, sayı ve simge gösteren bloklar.
• Girdi (Input): Düğmeye basma, sallama, sıcaklık ve ışık gibi olayları algılayan bloklar.
• Müzik (Music): Ses ve melodi çalan bloklar.
• LED: Tek tek ışıkları kontrol eden bloklar.
• Radyo (Radio): İki micro:bit'in birbiriyle haberleşmesini sağlayan bloklar.
• Döngüler (Loops): Tekrar eden işler için bloklar.
• Mantık (Logic): "Eğer ... ise" gibi karar blokları.
• Değişkenler (Variables): Bilgi saklamak için bloklar.

Bir kategoriye tıkladığında o gruptaki bloklar açılır. Aradığın bloğu ortadan çalışma alanına sürüklersin.

3. Çalışma alanı (sağ taraf)

Sağdaki geniş boşluk, programını kurduğun yerdir. Blokları buraya sürükler ve alt alta geçirirsin. Başlangıçta bu alanda iki blok hazır bekler: başlangıçta ve sürekli.

"başlangıçta" ve "sürekli" iki temel bloktur

Her yeni MakeCode projesinde ekrana otomatik gelen bu iki blok, programının iskeletidir.

başlangıçta bloğu

başlangıçta (İngilizcesi *on start*) bloğunun içine koyduğun komutlar, micro:bit açılınca yalnızca bir kez çalışır. Kartı ilk kez başlattığında yapılacak hazırlık işleri buraya konur.

Günlük hayattan örnek: Sabah okula giderken ışıkları açmak, perdeleri çekmek gibi işleri günde bir kez yaparsın. Bunlar senin "başlangıçta" adımlarındır.

sürekli bloğu

sürekli (İngilizcesi *forever*) bloğunun içindeki komutlar, kart kapanana kadar durmadan tekrar eder. Biri bittiğinde baştan başlar.

Günlük hayattan örnek: Kalbin sen uyanıkken de uyurken de durmadan atar. Nefes almak gibi, sürekli tekrar eden bir iştir. "sürekli" bloğu da micro:bit için böyle çalışır.

Şimdi ikisini birlikte görelim:

başlangıçta
  "MERHABA" göster
sürekli
  eğer <A düğmesine basıldı> ise
    kalp simgesi göster

Bu program açılışta bir kez "MERHABA" yazısını kaydırır, sonra sürekli olarak A düğmesine basılıp basılmadığını kontrol eder. Basıldığında bir kalp gösterir.

İlk küçük programını yaz ve karta yükle

Şimdi kendi ilk programını kuralım. Amaç basit: micro:bit açılınca ekranda bir kalp simgesi görünsün.

Blok dizisi

başlangıçta
  kalp simgesi göster

Bunu kurmak için:

1. Temel (Basic) kategorisine tıkla.
2. simge göster (*show icon*) bloğunu çalışma alanındaki başlangıçta bloğunun içine sürükle.
3. Bloktaki küçük simge menüsünden kalbi seç.

Soldaki simülatöre bak: LED'ler hemen kalp şeklinde yandı. Henüz karta hiçbir şey yüklemeden programının çalıştığını gördün.

Aynı program MicroPython ile

MakeCode dışında, aynı fikri metin tabanlı Python ile de yazabilirsin. micro:bit'in kendi Python sürümüne MicroPython denir:

from microbit import *

display.show(Image.HEART)

İlk satır micro:bit araçlarını programa katar. İkinci satır ise ekranda kalp resmini gösterir. Blok sürümüyle mantık birebir aynıdır; yalnızca yazım biçimi değişir.

Programı gerçek micro:bit'e yükleme

Simülatör güzeldir ama asıl heyecan, kodun gerçek kartta çalışmasıdır. Yükleme şöyle yapılır:

1. micro:bit'i USB kablosuyla bilgisayara bağla. Kart bilgisayarda bir USB bellek gibi görünür.
2. MakeCode'un altındaki mor İndir (Download) düğmesine tıkla.
3. Bilgisayarına bir .hex dosyası iner. Bu dosya, blok programının micro:bit'in anlayacağı biçime çevrilmiş halidir.
4. Bu .hex dosyasını, micro:bit'in göründüğü sürücüye sürükleyip bırak.
5. Karttaki sarı ışık birkaç saniye yanıp söner; bu, programın yüklendiği anlamına gelir. Sonra kalp ekranda belirir.

Bazı bilgisayarlarda tarayıcı doğrudan karta yazabilir; o zaman .hex dosyasını elle taşıman gerekmez. İkisi de aynı sonucu verir.

Mini uygulama

Aşağıdaki üç adımı sırayla dene:

1. Yeni bir MakeCode projesi aç ve başlangıçta bloğuna kendi adının ilk harfini gösteren bir metin ekle. İpucu: Temel kategorisinde string göster bloğunu kullan.
2. sürekli bloğunun içine, Girdi (Input) kategorisinden "A düğmesine basıldığında" mantığını kur ve gülen yüz simgesi göster.
3. Programı önce simülatörde dene. Çalışıyorsa, elinde kart varsa .hex dosyasını yükle.

Beklenen sonuç:

başlangıçta
  "D" göster
sürekli
  eğer <A düğmesine basıldı> ise
    mutlu yüz simgesi göster

Kendi kendine sor: Simülatördeki A düğmesine tıkladığında yüz beliriyor mu? Belirmiyorsa bloklar doğru yere geçmiş mi kontrol et.

Uygulama laboratuvarı: MakeCode Arayüzü

MakeCode Arayüzü konusunu kalıcı hâle getirmenin en iyi yolu, kavramı küçük ve ölçülebilir bir göreve dönüştürmektir. Bu çalışmada MakeCode ekranı üç ana bölümden oluşur ile 2. Blok kutusu (orta) arasındaki ilişkiyi kullanarak simülatörde ve kart üzerinde denenmiş micro:bit programı ile test notları hazırlayacaksın. Amaç yalnız sonucun çalışması değil; hangi kararı neden verdiğini, neyi test ettiğini ve hangi durumda tasarımı değiştireceğini açıklayabilmektir.

Görev senaryosu

Şu senaryoyu ele al: düğmelerle menü seçimi yapılan küçük bilgi oyunu. Dersin ana hedefi “MakeCode blok editörünü, simülatörü ve kodu micro:bit'e yüklemeyi öğren” olduğuna göre önce problemi tek cümleyle tanımla. Ardından sistemin alacağı girdiyi, uygulayacağı işlemi ve üreteceği çıktıyı ayrı ayrı yaz. Bilmediğin bir ayrıntı varsa onu varsayım olarak işaretle; varsayımı gerçek bilgi gibi kullanma.

1. Planla: Başlangıç durumunu, beklenen sonucu ve kullanacağın kavramları yaz.
2. En küçük sürümü kur: Yalnız temel davranışı çalıştır; süsleme ve ek özellikleri sonraya bırak.
3. Üç test hazırla: Normal bir durum, sınırda bir durum ve hatalı ya da beklenmeyen bir durum seç.
4. Sonucu kaydet: Beklenen ile gerçekleşeni yan yana yaz; fark varsa olası nedeni belirt.
5. Tek değişiklik yap: Aynı anda birçok şeyi değiştirmek yerine bir kararı düzeltip testi yeniden çalıştır.

Başarı ölçütleri

• Program simülatörde beklenen olayı üretiyor mu?
• Kart yeniden başlatıldığında değerler doğru mu?
• A ve B düğmelerinin birlikte basılması denendi mi?
• Radyo grubu ve mesaj biçimi iki kartta aynı mı?
• Harici bileşenlerde pin ve gerilim sınırları kontrol edildi mi?

“MakeCode Arayüzü” çalışmasını bitirdiğinde ürünü bir arkadaşına yalnız bölüm başlıklarıyla anlat. Arkadaşın düğmelerle menü seçimi yapılan küçük bilgi oyunu senaryosundaki adımları ve karar nedenlerini takip edebiliyorsa anlatım yeterince açıktır. Anlaşılmayan noktayı daha fazla terim ekleyerek değil, MakeCode ekranı üç ana bölümden oluşur ve 2. Blok kutusu (orta) ilişkisini daha küçük adımlara bölerek düzelt.

Sık yapılan hatalar

Bloğu yanlış yere bırakmak

Bir blok başlangıçta veya sürekli bloğunun *içine* geçmezse çalışmaz. Bloğu sürüklerken sarı bir gölge çizgisi görürsün; blok o çizgiye oturduğunda doğru yere geçmiş demektir.

Her şeyi "başlangıçta" içine koymak

Sürekli kontrol edilmesi gereken bir işi (örneğin düğme basımını) "başlangıçta" içine koyarsan yalnızca bir kez kontrol edilir. Tekrar eden işler "sürekli" bloğuna girer.

Simülatörde çalıştı diye yüklemeyi unutmak

Simülatör yalnızca bir taklittir. Sıcaklık, ışık ve sallama gibi gerçek ölçümleri tam olarak yansıtmaz. Bir projeyi tamamlamadan önce mutlaka gerçek kartta da dene.

.hex dosyasını yanlış yere sürüklemek

.hex dosyası, bilgisayarındaki İndirilenler klasörüne değil, micro:bit sürücüsüne bırakılmalıdır. Yanlış klasöre bırakırsan program karta geçmez.

Güvenlik notu

• micro:bit'i USB kablosuyla bağlarken kabloyu zorlamadan, düz biçimde tak. Bağlantı için gerekirse bir yetişkinden yardım iste.
• Kartı yalnızca USB veya uygun düşük voltajlı pil paketiyle çalıştır. micro:bit düşük gerilimli bir karttır; asla şebeke elektriğine bağlanmaz.
• Kartın arkasındaki açık devre yüzeyini kuru elle ve temiz bir masada tut. Metal bir yüzeyin üzerine koyarak çalıştırma.
• Pil paketi kullanacaksan pilleri doğru kutupla ve bir yetişkinle birlikte tak.

Ders özeti

• MakeCode, micro:bit için tarayıcıda çalışan ücretsiz bir blok editörüdür.
• Ekran üç bölümdür: simülatör, blok kutusu ve çalışma alanı.
• Bloklar kategorilere ayrılır; her kategorinin bir rengi ve amacı vardır.
• başlangıçta bloğu bir kez, sürekli bloğu durmadan çalışır.
• Program, .hex dosyası olarak indirilip micro:bit sürücüsüne bırakılarak gerçek karta yüklenir.

Kontrol soruları

1. MakeCode ekranının üç ana bölümü nedir?
2. Simülatör ne işe yarar ve gerçek karttan farkı nedir?
3. "başlangıçta" bloğundaki komutlar kaç kez çalışır?
4. Bir düğme basımını sürekli kontrol etmek istiyorsan bloğu hangi alana koymalısın?
5. Bir programı gerçek micro:bit'e yüklerken bilgisayarına inen dosyanın uzantısı nedir ve bu dosyayı nereye bırakırsın?

Cevaplar

1. Simülatör (sol), blok kutusu (orta) ve çalışma alanı (sağ).
2. Simülatör, gerçek kartın bilgisayardaki taklididir; programı anında test etmeni sağlar. Farkı, gerçek sensör ölçümlerini tam yansıtmaması ve fiziksel bir kart olmamasıdır.
3. Yalnızca bir kez, kart açıldığında çalışır.
4. sürekli bloğunun içine koymalısın; çünkü orası durmadan tekrar eder.
5. Dosyanın uzantısı .hex'tir ve bilgisayarda görünen micro:bit sürücüsüne sürüklenip bırakılır.

Kaynak ve doğrulama notu

“MakeCode Arayüzü” dersi için doğrulama odağı MakeCode ekranı üç ana bölümden oluşur ile 2. Blok kutusu (orta) arasındaki ilişkinin örnekler üzerinde tutarlı çalışmasıdır. MakeCode ve MicroPython adları sürüme göre küçük farklılık gösterebilir. Önce simülatörde test yapılmalı; harici bileşen bağlanacaksa kartın pin ve gerilim sınırları ayrıca kontrol edilmelidir.

Sonraki ders

LED Matrisi: 5×5 ışık ızgarasında kendi simgelerini ve küçük animasyonlarını nasıl çizeceğini öğreneceğiz.