Python → Python i Processing → Završni projekat: Micro:bit kao gejming kontroler

Završni projekat: Micro:bit kao gejming kontroler

U ovoj lekciji koristićemo micro:bit kao gejming kontroler za igru napravljenu u Processing Python Mode okruženju. Podaci sa senzora nagiba šalju se preko serijske komunikacije, a Processing ih koristi za upravljanje objektima u realnom vremenu. Ovaj projekat povezuje MicroPython, senzore, grafiku i razvoj igara u jednu celinu.

U ovom projektu micro:bit postaje interaktivni kontroler igre. Nagib uređaja kontroliše kretanje, dok tasteri A i B aktiviraju posebne akcije.

Ovo je kompletan real-time sistem koji povezuje: senzore → serijsku komunikaciju → grafičku igru.

Cilj projekta

• Micro:bit šalje nagib (X, Y)
• Taster A aktivira boost (brže kretanje)
• Taster B daje poene
• Processing prikazuje igru i upravlja logikom

Arhitektura sistema

micro:bit (senzori + dugmad)
        ↓
uart.write("x,y,A,B\n")
        ↓
USB Serial
        ↓
Processing (Python Mode)
        ↓
Igra: kretanje + bodovi + boost

MicroPython kod (micro:bit)

from microbit import *
import utime

while True:
    x = accelerometer.get_x()
    y = accelerometer.get_y()

    a = button_a.is_pressed()
    b = button_b.is_pressed()

    # slanje 4 vrednosti u jednom redu
    uart.write(
        str(x) + "," +
        str(y) + "," +
        str(int(a)) + "," +
        str(int(b)) + "\n"
    )

    utime.sleep(0.05)

Processing kod (Python Mode – logika igre)

# Processing Python Mode – serijska biblioteka uključuje se ovako
# (u Javi bi bilo: import processing.serial.*;)
add_library('serial')

x_pos = 350
y_pos = 250
speed_multiplier = 1
score = 0
my_port = None


def setup():
    global my_port
    size(700, 500)
    print(Serial.list())   # spisak portova – izaberi pravi indeks
    my_port = Serial(this, Serial.list()[0], 115200)
    my_port.bufferUntil(10)  # 10 = znak za novi red


def draw():
    background(30)
    fill(0, 150, 255)
    ellipse(x_pos, y_pos, 50, 50)
    fill(255)
    textSize(20)
    text("Score: " + str(score), 20, 30)


def serialEvent(port):
    global x_pos, y_pos, speed_multiplier, score
    data = port.readStringUntil(10)
    if data is None:
        return
    values = data.strip().split(',')
    if len(values) != 4:
        return
    x = float(values[0])
    y = float(values[1])
    a = int(values[2])
    b = int(values[3])

    # dugme A = boost
    speed_multiplier = 2 if a == 1 else 1

    # kretanje i granice ekrana
    x_pos = constrain(x_pos + (x / 200.0) * speed_multiplier, 25, width - 25)
    y_pos = constrain(y_pos + (y / 200.0) * speed_multiplier, 25, height - 25)

    # dugme B = poeni
    if b == 1:
        score += 5

Kako igra radi?

• Nagib pomera igrača
• Taster A ubrzava kretanje
• Taster B dodaje poene
• Processing obrađuje sve u realnom vremenu

x_pos += (x / 100) * speed_multiplier

Šta učenici uče?

• Kako se dizajnira komunikacioni protokol
• Kako se kombinuju više senzora u jednoj poruci
• Kako se podaci parsiraju i validiraju
• Kako se senzor mapira na kretanje
• Osnove dizajna 2D igre

Napredni izazovi

• Dodaj više neprijatelja
• Dodaj život (health system)
• Dodaj restart igre
• Dodaj zvuk pri sudaru
• Dodaj nivoe težine

Zaključak

Ovaj projekat povezuje hardver i softver u jednu celinu:

• micro:bit = senzor i kontroler
• Serial = komunikacioni kanal
• Processing = grafička igra

Kako podaci putuju od micro:bit-a do grafike?

U ovoj lekciji smo videli kako micro:bit šalje podatke preko serial komunikacije.

Sada je važno razumeti šta se dešava “iza scene” — ceo put podataka.

Tok podataka u sistemu

micro:bit → UART → USB → računar → Processing → grafika

• micro:bit čita senzore (nagib, temperatura, dugmad)
• uart.write() pretvara podatke u tekst
• USB kabl prenosi podatke do računara
• Processing čita dolazne poruke
• podaci postaju grafika, animacija ili igra

Šta micro:bit zapravo šalje?

micro:bit ne šalje “grafiku” ili “objekte”, već samo običan tekst.

Primer jednostavnih poruka:

23
24
25

Processing te vrednosti može pretvoriti u:

• kretanje objekta
• graf temperature
• promenu boje ili animaciju

Primer više vrednosti u jednoj poruci

Često se šalju dve ili više vrednosti zajedno:

23,512

To može značiti:

• 23 → temperatura
• 512 → svetlost ili drugi senzor

Mini eksperiment razumevanja

120,-40

Zašto je ovo važno?

Ovo je osnova svih sistema koji povezuju hardver i softver:

• IoT uređaji
• robotika
• igre sa senzorima
• interaktivne instalacije

U svim tim sistemima važi isti princip: uređaj šalje podatke → program ih interpretira.

Šta dalje učimo?

U sledećoj lekciji prelazimo na drugu stranu sistema: Processing program koji prima i crta podatke.

Učićemo:

• kako se čita serial port
• kako se razdvajaju podaci
• kako se pravi real-time grafika

Skriveni mini kviz — Vizuelna igra (micro:bit ↔ Processing)

Klikni da proveriš da li razumeš ključne koncepte igre: serial komunikaciju, mapiranje nagiba i logiku bodova/sudara.

myPort.bufferUntil('\n');

Ista igra u py5 (Thonny)

Ako serijska biblioteka u Processing Python Mode-u ne radi (čest problem u Processing-u 4), isti projekat napravi u Thonny-ju sa py5 dodatkom. Umesto serialEvent() koristimo biblioteku pyserial i čitamo podatke u draw(). U Thonny-ju je instaliraj preko Tools → Manage packages → pyserial.

# py5, imported mode (Thonny + py5 dodatak). Kod micro:bit-a ostaje isti.
import serial
import serial.tools.list_ports

x_pos = 350
y_pos = 250
score = 0
ser = None


def nadji_microbit():
    for p in serial.tools.list_ports.comports():
        opis = (p.description or "").lower()
        if "micro:bit" in opis or "mbed" in opis or p.vid == 0x0D28:
            return p.device
    return None


def setup():
    global ser
    size(700, 500)
    port = nadji_microbit()
    if port:
        ser = serial.Serial(port, 115200, timeout=0)
    else:
        print("micro:bit nije pronađen")


def draw():
    global x_pos, y_pos, score
    background(30)

    # pročitaj sve poruke koje su stigle od prošlog frame-a
    while ser and ser.in_waiting:
        line = ser.readline().decode("utf-8", errors="ignore").strip()
        values = line.split(",")
        if len(values) != 4:
            continue
        x, y = float(values[0]), float(values[1])
        boost = 2 if values[2] == "1" else 1
        x_pos = constrain(x_pos + x / 200 * boost, 25, width - 25)
        y_pos = constrain(y_pos + y / 200 * boost, 25, height - 25)
        if values[3] == "1":
            score += 5

    fill(0, 150, 255)
    circle(x_pos, y_pos, 50)
    fill(255)
    text_size(20)
    text("Score: " + str(score), 20, 30)