Pastikan komputer Anda sudah siap untuk menggunakan App Inventor dan mengunjungi website http://ai2.appinventor.mit.edu/. Start new project di jendela Perancang, dan beri nama "PaintPot". Seperti gambar dibawah ini.
 |
| Jendela New Project |
Nama "Screen1", yang merupakan nama komponen Layar. Anda akan melihatnya tercantum di panel Components di Designer. Anda tidak dapat mengubah nama komponen Layar pertama di App Inventor versi saat ini namun Anda dapat membuat layar tambahan dengan nama sesuatu yang harus Anda pilih.
 |
| screen1 |
Drag komponen Tombol / Button ke viewer dan ubah atribut Teks tombol menjadi "Merah" dan buat Background Color warnanya merah. Seperti gambar dibawah ini.
 |
| Button Pict |
Klik pada Button1 di daftar komponen di Viewer lalu Rename. dan ganti namanya dari "Button1" menjadi "ButtonRed".Begitu juga membuat dua tombol lagi untuk warna biru dan hijau, diberi nama "ButtonBlue" dan "ButtonGreen", menempatkannya secara vertikal di bawah tombol merah.
Anda sekarang harus memiliki tiga tombol, satu di atas yang lain. Langkah selanjutnya adalah membuat mereka berbaris horizontal. Anda melakukannya dengan menggunakan komponen HorizontalArrangement.
