Tutorial Augmented Reality Android Part 1: Getting Started

Halo..Halo.. Selamat datang di A.R.T - akhirnya tutorial yang sudah lama ingin kami buat bisa kelar juga. thanks buat rekan kami Om Desta yang sudah meminjamkan Android Phone-nya, Alloh Memberkahi.. (^0^) - yapp, ini tutorial yang paling banyak dicari dan tapi cuma hanya beberapa blog yang menjelaskan developing AR untuk Android. 

sebenarnya, banyak SDK yang bisa kita gunakan untuk mengembangkan Aplikasi Android, misal seperti Vuforia, Wikitude, Layar, Junaio, Metaio, dan NyarToolkit. tapi untuk "Sekarang Ini" saya lebih suka dengan NyarToolkit, karna pengembannya mudah, walau jeleknya Belum bisa merkerless seperti Vuforia. but well, gak ada salahnya kita nyoba kan, hitung-hitung sebagai menambah pengetahuan di AR.

tapi.. nanti kita akan mencoba develop AR dengan Vuforia juga, jadi kalian bisa membandingkan dan bisa memilih mau menggunakan NyarToolkit atau Vuforia.

Kebutuhan Hardware, Software dan SDK

oke back to the topic, bagaimana mengembangkan AR Android dengan library NyarToolkit?, well buat yang pernah ngedevelop atau pernah mencoba developing Aplikasi Android, pasti sangat mudah memahaminya, karna mengembangkan aplikasi AR Android sama saja seperti mengembangkan Aplikasi Android Biasa, yang penting kita mempunyai SDK dari librarynya (*Contoh: Nyartoolkit atau Vuforia) yang bisa kita ambil sample source code-nya untuk dikembangkan. 

nah, sekarang apa saja yang dibutuhkan untuk mengembangkan aplikasi AR Android? well, kita mulai dari kebutuhan Hardware. untuk kebutuhan Hardware, sudah pasti anda harus mempunyai Android dengan sistem operasi minimal Android Froyo 2.1, kalau bisa Android dengan processor ARMV7 yang rata-rata dipakai di Android zaman sekarang. selanjutnya anda juga butuh satu komputer atau laptop dengan Processor Minimal Pentium 4 Ram 1 Gb, kalau bisa Core 2 Duo dengan Ram 2Gb lebih di rekomendasikan, karna kita akan menjalankan software Eclipse yang sedikit berat saat Loading, jika dijalankan di Komputer dengan spek seadanya. 

dan untuk kebutuhan Software, anda harus mendownload beberapa software yang wajib diinstal di komputer anda. berikut list beserta link downloadnya

1. Eclipse IDE for Java Developers
2. Java Platform (JDK) 7u5

dan terakhir Untuk SDK, anda membutuhkan SDK Nyartoolkit yang bisa anda dapatkan di link dibawah ini.

1. NyarToolkit SDK

kebutuhan yang lain yang anda harus penuhi adalah, anda harus mempunyai Internet dengan koneksi minimal 50-60 Kbpbs - lebih disarankan menggunakan Internet dengan kecepatan 100Kpbs, supaya tidak lama saat installing SDK. 

Instalasi dan Pengaturan SDK di Eclipse

ok.. sekarang saya anggap kalian sudah mengginstal Eclipse dan JDK yang dibutuhkan. sekarang Ekstrak Eclipse di Harddrive anda dimana saja. lalu buka Eclipse anda. dan jika Eclipse bertanya, dimana tempat anda menyimpan Workspace Projek anda?, silahkan anda setting sendiri. saya tidak mengatur apa-apa di workspace ini, karena takutnya, saya lupa dimana tempat saya menyimpan projek yang telah saya buat. 

selanjutnya setelah Eclipse terbuka, kita akan melakukan mengInstall ADT Plugins di Eclipse. di tahapan ini, anda harus menyiapkan pulsa modem anda, dan yakinkan PLN agar tidak memadamkan listrik rumah anda.. haha. (*becanda) .. intinya siapkan koneksi Internet anda. 

oke, untuk menginstall ADT Plugins, klik Menu Help lalu pilih Install New Software

 

 

di menu Install New Software, langsung klik Add. kemudian anda akan masuk ke menu Repository, di menu Repository masukkan nama ADT Plugin di Field Name dan masukkan alamat https://dl-ssl.google.com/android/eclipse/ di field Location. setelah itu klik Ok. tunggu proses sampai selesai.

setelah proses selesai, maka anda akan mendapatkan plugins Developer Tools, langsung di Ceklist semua, agar kita mendapatkan paket full Plugins dari ADT Android. kemudian klik Next, tunggu proses sampai selesai.

setelah proses selesai, maka klik Next, kemudian anda harus menyetujui License Agreement dari Android untuk melanjutkan proses Instalasi. selanjutnya klik Finish. 

tunggu proses instalasi sampai selesai.

  

setelah proses instalasi selesai, restart eclipse anda. dan karena proses instalasi ADT ini selesai, selesai juga tutorial Part.1 kali ini, next kita bakal mengInstall SDK Android, cek di list tutorial dibawah untuk menuju tutorial berikutnya. See Ya..

List Tutorial:

1. Tutorial Augmented Reality Android Part 1: Getting Started
2. Tutorial Augmented Reality Android Part 2: Installing SDK
3. Tutorial Augmented Reality Android Part 3: Creating Android Virtual Device
4. Tutorial Augmented Reality Android Part 4: Building The AR with NyarToolkit

Read More

Tutorial AR Processing dan Nyar4sg: Controlling The Object

Hello Guys.. Selamat datang di Augmented Reality Team (A.R.T). ok, sesuai dengan janji saya, kali ini saya akan membahas bagaimana mengendalikan objek dengan marker. jadi, misalnya seperti ini, kita mempunyai objek 3D yang sudah di Animasikan di Blender atau software 3D Lainnya, kemudian kita ingin membuat objek bergerak, jika kita suruh bergerak, berhenti jika kita suruh berhenti, berputar ke kiri jika kita suruh putar ke kiri, berputar ke kanan jika kita suruh berputar ke kanan, dll.. Awesome Hah?.. 

contohnya seperti projek yang berhasil saya buat dibawah ini:

gimana? mau buat AR seperti itu?.. Mudahh, tapi anda harus mempunyai komputer dengan spek lumayan tinggi untuk menjalankan AR ini, karna saya menjalankan AR ini dengan Processor Celeron 2.13 dan Ram 1 Gb, agak pata-patah saat dijalankan.. hehe. (*maklum komputer jadul) .. tapi belum saya coba di komputer dengan Intel Core2Duo Keatas. 

oke, sebelum kita mulai membuat AR ini, pertama-pertama anda harus mendownload objek animasi yang saya buat berdasarkan panduan dari buku Dr.Tony Mullen seorang AR Developer dan Dosen di Universitas Tokyo Jepang. anda bisa mendapatkan bukunya di Amazon.com, dan juga anda harus mendownload marker yang saya gunakan untuk belajar. yang bisa anda dapatkan disini >> Download Objek dan Marker

nah, setelah didownload, anda harus men-Print ke 3 Marker yang tersedia. setiap marker, mempunyai fungsi berbeda. marker berlogo Objek 3D warna Pink berfungsi untuk menjalankan objek 3D, marker berpola kaki berfungsi untuk memerintahkan agar objek berjalan, dan Marker berpola seperti "Tanda Berputar" berfungsi agar objek berputar ke arah yang kita inginkan. 

setelah di print, buka processing 1.2.1 anda. tapi sebelumnya, saya anggap kalian sudah memahami instalasi library AR Processing dan Nyar4sg. jika belum saya SANGAT SARANKAN anda untuk kembali ke tutorial sebelumnya disini >> Tutorial AR Processing 

kembali ke topik semula, setelah anda buka Processing 1.2.1 anda, masukkan source code berikut: (Untuk Penjelasan Source Code, akan saya jelaskan di Part 2)

/**    NyARToolkit for proce55ing/0.3.0
    (c)2008-2010 nyatla
    airmail(at)ebony.plala.or.jp

  NyARMultiBoard + NyARMultiBoardMarker by
  Charl P. Botha
*/

import codeanticode.gsvideo.*;
import jp.nyatla.nyar4psg.*;
import processing.opengl.*;
import saito.objloader.*;

GSCapture cam;
NyARMultiBoard nya;
OBJModel annie ;
PFont font;
PVector move;
PVector xypos;

OBJModel[] anim;
int animFrames = 20;
int animFrame;
boolean animOn= true;
float turn = 0.0;
float prevangle = 0.0;

void setup() {
  size(640,480,OPENGL);
  colorMode(RGB, 100);
  font=createFont("FFScala", 32);
  cam=new GSCapture(this,width,height);
  String[] patts = {"samarker16.pat", "walkmarker16.pat", "turnmarker16.pat"};
  double[] widths = {80,80,80};
  nya=new NyARMultiBoard(this,width,height,"camera_para.dat",patts,widths);
  print(nya.VERSION);

  nya.gsThreshold=120;
  nya.cfThreshold=0.4; 
  int i;
  String filename = "";
  anim = new OBJModel[animFrames];
   
  for(i = 1; i <= animFrames; i++){
    if(i < 10){
      filename = "shootinannie-superlowpoly-tri_00000" + i + ".obj";
     }else{
       filename = "shootinannie-superlowpoly-tri_0000" + i + ".obj";
     }
     anim[i-1] = new OBJModel(this, filename, "relative", TRIANGLES);
     anim[i-1].enableDebug();
     anim[i-1].scale(15);
     anim[i-1].translateToCenter();
     anim[i-1].enableTexture();
   }
  xypos = new PVector(0, 0);
  move = new PVector(0, -1);
}

void drawMarkerPos(int[][] pos2d)
{
  textFont(font,10.0);
  stroke(100,0,0);
  fill(100,0,0);

  for(int i=0;i<4;i++){
    ellipse(pos2d[i][0], pos2d[i][1],5,5);
  }
 
  fill(0,0,0);
  for(int i=0;i<4;i++){
    text("("+pos2d[i][0]+","+pos2d[i][1]+")",pos2d[i][0],pos2d[i][1]);
  }
}

void draw() {
  if (cam.available() !=true) {
    return;
  }

  background(255);
  cam.read();
  hint(DISABLE_DEPTH_TEST);
  image(cam,0,0);
 
  if (nya.detect(cam))
  {
    for (int i=0; i < nya.markers.length; i++)
    {
      if (nya.markers[i].detected)
      {
        drawMarkerPos(nya.markers[i].pos2d);
      }
    }
    if(nya.markers[1].detected){
     animOn = true;
    }else{
     animOn = false;
    }
   
    hint(ENABLE_DEPTH_TEST);

    PGraphicsOpenGL pgl = (PGraphicsOpenGL) g;
   
    if (nya.markers[0].detected){
       nya.markers[0].beginTransform();
       noStroke();
       rotateX(radians(-90));
      
       if(nya.markers[2].detected){
          turn = nya.markers[2].angle.z;
          rotate2D(move, turn-prevangle);
          prevangle = turn;
       }
       
       translate(xypos.x, xypos.y, 50);
       rotateY(turn);
      
       if(animOn){
       anim[animFrame].draw();
       xypos.add(move);
       animFrame++;
       if(animFrame == animFrames){
          animFrame = 0;
          }
        }else{ 
          anim[17].draw();
        }
       nya.markers[0].endTransform();
    }
  }
}

void rotate2D(PVector v, float theta) {
  float xTemp = v.x;
  v.x = v.x*cos(theta) - v.y*sin(theta);
  v.y = xTemp*sin(theta) + v.y*cos(theta);
}

setelah selesai kalian ngeCoding, silahkan save file dengan nama SAWalkTurn.pde - lalu, selanjutnya kita harus menDrag semua Objek 3D yang sudah saya Import menjadi Format OBJ beserta texturenya yang sebelumnya anda download ke Processing. (FYI: Processing Mendukung Format Animasi OBJ) 

sekarang setelah di drag ke processing, buka folder Processing di My Document, lalu masuk ke Folder SAWalkTurn.pde maka lihatlah didalam folder tersebut secara otomatis ada folder bernama Data yang isinya adalah semua Objek 3D, Texture, dan Patt Marker yang anda Drag sebelumnya.

selanjutnya klik Run (Icon Play), dan arahkan ketiga marker tersebut di kamera. jika anda menunjukkan marker berwarna pink maka objek 3D akan keluar tapi hanya diam, jika anda tunjukkan marker dengan pola kaki maka objek akan berjalan, dan jika anda putar marker berpola "Tanda Putaran" maka objek akan berputar, seperti di video demo saya tersebut..

Yapp.. That's it Tutorial dari saya, selanjutnya di Part 2 Kita akan membahas Source Codenya, Ditunggu Yah. Semoga Membantu and Gud Luck..!!

Read More

Tutorial: Augmented Reality dengan FlarToolkit Part 2 - Building The AR

hello guys.. kita ketemu di tutorial FlarToolkit Part 2. buat yang belum baca Tutorial pertama saya SANGAT SARANKAN untuk membaca dulu Tutorial yang pertama, karna di tutorial ini tidak saya jelaskan lagi. Okeh, langsung saja, di tutorial kedua ini kita akan membangun AR dengan Flartoolkit, tapi First of All gak ada salahnya kita eksplor dulu contoh-contoh AR dari Flar Manager.

Ok.. What I Must to Do Now??, well setelah kita berhasil mengInstall Library Flar Manager langkah selanjutnya adalah anda harus men-Print marker yang disediakan flar manager, buka folder FLARManager_v1_1_0\resources\flarToolkit\patterns - kemudian print ke-12 marker yang tersedia.

selanjutnya setelah marker di print buka lagi Flash Builder kita, dan sekarang kita mencoba mengCompile Flar Manager. sekarang di Package Explorer  buka root Src > Default Package > FlarManagerExampleLauncher.as

ketika file FlarManagerExampleLauncher.as dibuka maka anda akan mendapat barisan source code action script. nah.. sekarang coba klik tombol Play (*saya lingkari di Gambar) yang ada di menu bagian atas.

selanjutnya, saat kalian compile maka akan terjadi 3 Error, Hey What The Hell..!! - sabar om, kesalahan bukan terjadi dari si Programmer, tapi kesalahan terjadi karena HTML Template belum dibuat, makanya kita akan membuatnya Templatenya dahulu. Caranya Gimana? caranya dengan klik kanan dibagian Error lalu pilih Recreate HTML Templates

setelah HTML dibuat maka anda akan dialihkan di browser yang anda pakai. kemudian jika anda menemukan Camera Access, langsung saja klik Allow.. kemudian, arahkan Marker yang sudah anda print, maka anda akan mendapatkan Mario Bros di AR anda.

Horeee Berhasill.. sekarang anda bisa bermain AR dengan FlarToolkit. tunggu tutorial selanjutnya, kita akan gunakan objek sendiri untuk bermain FlarToolkit. Thank You for Reading, and Gud Luck..!!

List Tutorial:

1. Tutorial: Augmented Reality dengan FlarToolkit Part 1 - Instalasi Library
2. Tutorial: Augmented Reality dengan FlarToolkit Part 2 - Building The AR

Read More

Tutorial: Augmented Reality dengan FlarToolkit Part 1 - Instalasi Library

A. Kenalan Dengan FlarToolkit

Hello Lads.. Selamat datang di Blog A.R.T, pada tutorial kali ini saya akan memandu kalian bagaimana membuat AR berbasis Web dengan FlarToolkit. sebenarnya saya sudah lama ingin membuat tutorial ini, tapi baru ada kesempatan dan waktu sekarang.. hehe..

buat yang belum tau flartoolkit, akan saya jelaskan sedikit deskripsinya. FlarToolkit adalah Library AR yang diciptakan oleh ilmuwan Jepang bernama Saqoosha, tapi patut digaris bawahi, Flartoolkit Bukan Turunan dari ARToolkit, Saqoosha murni menciptakan FlarToolkit sendiri tanpa kerja sama dari ArToolkit. 

FlarToolkit sendiri library yang menggunakan basic bahasa Action Script untuk pengembannya, buat yang sering ngedevelop program dengan Flash, pasti sudah familiar dengan bahasa ini. tapi buat yang belum mengerti bahasa Action Script, saya sarankan untuk mempelajarinya terlebih dahulu dari buku-buku yang ada, agar terbiasa dengan coding Action Script. 

kemudian untuk kelebihan FlarToolkit sendiri adalah, kita bisa membuat AR berbasis Web, jadi AR kita bisa diakses kapan saja di Internet. biasanya AR dengan FlarToolkit digunakan untuk melakukan promosi barang, acara, atau sekedar hiburan.

B. Kebutuhan Hardware dan Software

kemudian apa saja yang dibutuhkan untuk membangun AR dengan Flartoolkit?. well, saya mulai dulu dari kebutuhan hardware. awalnya saya mendevelop dengan komputer seadanya, saya gunakan komputer dengan spek Intel Celeron 2.13 Ghz (*Setara Intel Pentium 4 - 2Ghz) dan dengan Ram 1GB, tapi  saat saya jalankan software developer yang akan saya gunakan untuk membangun AR dengan Flartoolkit ini, ternyata lemotnya Nauzubillah... kemudian saya pindah ke laptop dengan spek yang lumayan, Intel Core 2 Duo dengan Ram 2Gb, dan Alhamdulillah bisa jalan, dan lancar. jadi kesimpulannya, untuk membangun AR ini, anda harus punya komputer minimal dengan spesifikasi Intel Core 2 Duo dan Ram 2 Gb. 

dan untuk kebutuhan software, anda harus mendownload beberapa library dan software developer. untuk software developernya, saya gunakan Flash Builder 4.6 Premium, software inilah yang membuat lemot komputer saya yang Celeron itu, makanya saya sarankan gunakan komputer yang mempunyai spek tinggi. anda bisa mendapatkan trial selama 30 Hari dari Adobe untuk mendownload Flash Builder 4.5,

dan untuk library saya gunakan FlarManager. loh kok bukan pake FlarToolkit?, ya.. alasannya karena FlarManager lebih baik daripada FlarToolkit, dalam hal ini FlarManager adalah modifikasi dari FlarToolkit, kelebihannya adalah dia support dengan beberapa framework flash seperi Away3D, Papervision 3D, dll. dan juga FlarManager banyak example AR yg bisa gunakan untuk belajar. berikut list dan link downloadnya.

1. FlarManager
2. Flash Builder 4.6 Premium

C. Instalasi Library

setelah kalian download kedua link tersebut. saatnya kita lakukan instalasi library, pertama-tama anda harus mengekstrak Flar Manager di drive anda dimana saja, yang penting anda ingat dimana anda menyimpannya.

 

selanjutnya, setelah Flar manager di ekstrak, anda harus menjalankan Flash Builder 4.6 yang sudah anda install di komputer anda. dan ketika dijalankan, anda akan mendapatkan Welcome Screen Seperti ini:

selanjutnya, disini hal yang paling penting, dan jarang banyak yang tau. untuk melakukan instalasi Library FlarManager, klik FILE lalu pilih Import Flash Project, seperti ditunjukkan gambar dibawah.

kemudian, kalian akan mendapatkan kotak dialog Import Flash Builder Project. disini, kalian pilih Project Folder, lalu cari Flar Manager kalian, dimana kalian menyimpannyak, jika berpatokan dengan saya, saya menyimpannya di \Documents\FLARManager\FLARManager_v1_1_0 

jika sudah klik Finish, maka anda akan disuruh untuk memilih versi SDK yang akan dipakai. langsung saja kita pilih Default SDK, yang sudah terinstall otomatis dari Flash Builder.

tunggu sampai proses selesai.. jika kalian berhasil, maka kalian akan mendapatkan library Flar Manager sudah terinstall di Flash Builder kalian. seperti gambar dibawah ini:

Hore Berhasilll \(^o^)/ - sekarang kita sudah siap bermain dengan FlarToolkit. tunggu kelanjutan dari tutorial ini yah, next tutorial kita akan mencoba beberapa example FlarToolkit. I'll Be Seeinya.. Gud Luck..!!

P.S: Jika Gambar tidak Jelas, Klik Digambar untuk Memperbesar Gambar 

List Tutorial:

1. Tutorial: Augmented Reality dengan FlarToolkit Part 1 - Instalasi Library
2. Tutorial: Augmented Reality dengan FlarToolkit Part 2 - Building The AR

Read More

Augmented Reality dengan Processing dan NyAR4psg Library Part 3: Breakdown The Source Code

Hello Lads.. Kita ketemu di Tutorial Augmented Reality dengan Processing dan NyAR4psg Library Part 3: Breakdown The Source Code, buat yang belum membaca tutorial dua dan tutorial satu diharapkan untuk membaca tutorial dari awal agar tidak bingung. untuk melihat tutorial sebelumnya, cek link dibawah ini:

1. Augmented Reality dengan Processing dan NyAR4psg Library Part 1
2. Augmented Reality dengan Processing dan NyAR4psg Library Part 2: Installing Library dan Testing AR

yapp.. seperti judulnya, kita akan membahas source code NyarMultiTest, pemahan source code ini penting, agar kita bisa mengembangkan AR dengan Processing dan Nyar ini.  tapi buat yang sudah merasa cukup paham, dipersilahkan untuk tidak membaca tutorial ini.

Oke langsung aja, kita breakdown Skrip pertama.. 

import codeanticode.gsvideo.*;
import jp.nyatla.nyar4psg.*;
import processing.opengl.*;

skrip diatas digunakan untuk memanggil library gsvideo, agar camera stream atau layar kamera keluar. di line kedua ada adalah skrip untuk memanggil library Nyar4psg, dan skrip ketiga untuk memanggil library openGL yang sudah paket dengan Processing. OpenGL ini penting, agar objek 3D bisa direndering. 

selanjutnya di breakdown skrip kedua..

GSCapture cam;
NyARMultiBoard nya;
PFont font, font2d;

di breakdown skrip kedua, kita mendeklarasikan 3 variable. variable pertama adalah GSCapture cam; yang membutuhkan library GSVideo, jika GSVideo tidak terinstall maka program akan error dan akan ada warning "tidak menemukan library". variable ini juga akan menangkap objek dari kamera. kemudian scrip NyARMultiBoard adalah class dari nyarToolkit. class ini berfungsi untuk mengkalkulasi posisi kamera dan objek, mengenali marker, dan mengakses semua data di library NyarToolkit. kemudian yang terakhir adalah Class PFont font, font2d; digunakan untuk menampilkan keterangan skala objek dalam bentuk 2D.

selanjutnya di breakdown skrip ketiga..

void setup() {
size(640,480,P3D);
colorMode(RGB, 100);
font = createFont("FFScala", 32);
font2d = createFont("FFScala", 10);

di breakdown skrip ketiga, disini kita mengatur size layar kamera dalam hal ini kita atur ukuran 640X480, tapi disamping skala size ada skrip P3D. apa itu? P3D adalah enviroment di processing yang digunakan untuk mengatur skala di sketch processing. kemudian dibawahnya adalah color mode yang berfungsi untuk mengatur warna dari range 0 - 100. nah skrip kedua dibawahnya, digunakan untuk mengatur membuat font dan mengatur warna font. 

selanjutnya di breakdown skrip keempat..

cam=new GSCapture(this,width,height);
cam.play();

di breakdown keempat, GSCapture berfungsi untuk mengatur ukuran dimensi display kamera. dan source code keempat cam.play(); digunakan untuk mengaktifkan kamera.

selanjutnya di breakdown skrip kelima

String[] patts = {"patt.hiro", "patt.kanji"};
double[] widths = {80,80};

di breakdown ke lima, kita akan mendeklarasikan marker yang akan dipakai, dalam hal ini Nyar menggunakan marker Hiro dan Kanji, kok marker itu?.. ya jelas, wong.. nyarToolkit adeknya ARToolkit, pasti gak bakal lupa sama kakaknya.. haha. (*just kidding). - tapi yang jelas kalian bisa mengganti file hiro dan file kanji tersebut dengan tipe marker kalian dan bisa kalian tambahkan markernya, mau 3 4 5 6, terserah asal format marker (patt.*nama marker) kalian ditaruh di dalam folder data NyARMultiTest.

terus gimana cara buat marker? kalian bisa gunakan program mkpatt.exe yang ada di library ARToolkit, cara penggunaanya, liat tutorial cara membuat marker di menu ARToolkit. dan dibawah string[] patts, ada array double[] width, arrary ini berfungsi untuk mendeklarasikan ukuran marker dalam bentuk milimeter.

selanjutnya di breakdown skrip keenam..

NyARMultiBoard(this,width,height,
"camera_para.dat",patts,widths);

di breakdown skrip keenam, ada class NyARMultiBoard, class ini berfungsi untuk mengatur posisi dan calibrasi kamera. sama saja seperti ARToolkit.

selanjutnya di breakdown skrip ketujuh..

print(nya.VERSION);

di skrip ini simple, skrip ini berfungsi untuk mendeteksi versi dari nyarToolkit.

selanjutnya di breakdown skrip kedelapan

  void drawMarkerPos(int[][] pos2d){
    textFont(font,10.0);
    stroke(100,0,0);
    fill(100,0,0);

skrip diatas berfungsi untuk. mendeteksi posisi koordinat setiap sudut marker yang terdeteksi.  setelah sudut dideteksi maka akan didisplay dalam bentuk text font, dan diberi warna, agar informasi setiap sudut koordinat terbaca.

selanjutnya di breakdown kesembilan

for(int i=0;i<4;i++){
ellipse(pos2d[i][0], pos2d[i][1],5,5);
}

di skrip ini, kita mengiterasi dari 1 sampai 4 untuk menggambar elips pada setiap sudut. Indeks pertama untuk pos2d [] [] merupakan indeks sudut, dan indeks kedua adalah 0 untuk koordinat x dan 1 untuk koordinat y. dan kita atur tinggi dan lebar ellipse menjadi 5Px.


selanjutnya di breakdown kesepuluh

fill(0,0,0);
for(int i=0;i<4;i++){
text("("+pos2d[i][0]+
","+pos2d[i][1]+
")",pos2d[i][0],pos2d[i][1]); 

skrip diatas berfungsi untuk memberikan informasi koordinat setiap sudut marker uang terdeteksi. string pertama dari source code digunakan untuk menulis koordinat, dan string kedua dan ketiga adalah X dan Y koordinat yang digunakan untuk mendisplay informasi dari koordinat yang terdeteksi.

selanjutnya di breakdown kesebelas

void draw() {
if (cam.available() !=true) {
return;
}

di skrip ini berfungsi untuk mendeteksi kamera,. jika kamera terdeteksi maka kamera akan aktif, jika tidak, maka layar di sketch hanya diam berwarna abu-abu.

selanjutnya di breakdown keduabelas

hint(DISABLE_DEPTH_TEST);
image(cam,0,0);
hint(ENABLE_DEPTH_TEST);

fungsi skrip diatas adalah untuk merender objek 3D di sketch windo, maka kita harus menDisable Depth Test.

selanjutnya di breakdown ketigabelas

translate(0,0,20);
if (i == 0){
stroke(255,200,0);
box(40);
}else{
stroke(0,200,255);
sphere(25);
}

di skrip ini berfungsi untuk menampilkan objek 3D. dalam hal ini NyarMultiTest menggunakan Box dan sphere untuk testing objek ARnya.,

nah.. segitu saja, yang dapat saya jelaskan tentang skrip NyarMultiTest, sekarang kita sudah punya basic bermain AR dengan Processing. selanjutnya, kita akan modifkasi abis-abisan source code diatas, untuk membuat AR Interaktif dengan Paddle Marker. ditunggu yah.. ^_^

Read More

Augmented Reality dengan Processing dan NyAR4psg Library Part 2: Installing Library dan Testing AR

helloo.. selamat datang ke tutorial Augmented Reality dengan Processing dan NyAR4psg Library Part 2, buat yang belum baca tutorial pertama, saya sangat sarankan untuk membaca tutorial yang pertama yaitu Augmented Reality dengan Processing dan NyAR4psg Library Part1 - supaya tidak ada pertanyaan yang tidak usah ditanya lagi, karna sudah dijelaskan di tutorial yang pertama. okeh..

pada tutorial sebelumnya, saya sudah jelaskan tentang alasan saya menggunakan Processing dan NyAR4psg untuk membuat AR di dekstop. maka pada tutorial kali ini, akan saya jelaskan bagaimana instalasi Library ARnya. well, untuk membangun AR ini, kita membutuhkan 4 utility, yang bisa anda download dibawah ini:

1. Processing 1.2.1
2. GSVideo 0.8
3. NyAR2-20110305 
4. Objloader
5. Lib

pada awalnya saya menggunakan Processing terbaru yaitu versi 1.5.1 dan GS Video 1.0, tapi ternyata AR saya tidak jalan, terjadi bug sehingga kamera tidak keluar. setelah saya searching kesana kemari, baca sana baca sini, akhirnya saya baru tau ternyata masalah yang terjadi ada di GS Video 1.0 yang masih belum sempurna, kemudian saya iseng menggunakan GSVideo yang lama, yaitu versi 0.8, tapi tidak saya langsung coba di Processing 1.5.1 karna takutnya tidak bisa lagi, kemudian karna kepalang tanggung, saya juga download Processing 1.2.1 rilis tahun 2011 agar sama dengan GS Video 0.8 yang juga rilis tahun 2011, yahh.. harapannya bisa jalan, karena tahun versinya sama..hehe.. dan hasilnya.. Voilaaa.. AR saya jalan, tidak ada bug, dan semuanya lancar. akhirnya saya gunakan, versi tersebut. paling, hanya versi NyarToolkit dan ObjLoader-nya yang paling terbaru, yang lain saya gunakan versi 2012.

so.. cukup curhatnya, balik lagi ke masalah isntalasi di Library, bagaimana cara menginstall ke-empat library tersebut. gampang..ikuti tahapan dibawah..

1. pertama ekstrak Processing 1.2.1 di drive komputer mana saja, yang anda anggap aman, setelah diekstrak, double klik Processing, setelah layer Sketch keluar, maka coba cek di My Document, maka anda akan  mendapatkan Folder Processing disana. right?

 

2. sekarang, masuk ke folder processing dan buat folder dengan nama libraries - folder ini Wajib Dibuat karna nanti processing akan membaca semua library dari folder libraries. 

 

3. sekarang, didalam folder libraries, ekstrak semua GSVideo 0.8, NyAR2-20110305, Objloader dan Lib. sehingga ada empat folder seperti gambar dibawah ini. 

Note: gambar dirubah untuk memperbaiki error anticode sebelumnya. (*saya sudah menggunakan seven sekarang hehe. :p )

 4. nah untuk mengetest-AR anda jalan apa tidak, pertama-tama anda harus men-print marker Hiro dan Kanji yang ada di folder ..\NyAR2\data 

5. selanjutnya, buka Processing 1.2.1 anda, lalu klik open, kemudian buka folder NyAR2, lalu didalam folder buka lagi Folder Example, kemudian didalam Folder Example buka lagi Folder NyARMultiTest. kemudian open NyARMultiTest.pde

  

6. setelah dibuka,. maka anda akan menemukan barisan source code Java. tidak perlu di modifikasi terlebih dahulu, karena kita mempelajari dulu source codenya, baru kita modifikasi.sekarang,. langung saja klik tombol Run (Logo Tombol Play) di sebelah kiri atas. tunggu, sampai Processing membuka kamera, setelah kamera terbuka, arahkan Marker Kanji dan Hiro didepan kamera, maka anda akan mendapatkan AR Berbentuk Shape dan Box. 

yapp,. mudahkan.. dan sekarang.. selamat anda sekarang berhasil membuat AR dengan NyarToolkit. penjelasan tentang source code diatas dan bagaimana proses renderingnya, akan saya jelaskan di Part.3. ok guys, sampe ketemu di Part.3.. Gud Luck..!! 

P.S: Jika Gambar di Blog Tidak Jelas, Klik Saja Gambarnya Agar bisa di Zoom oleh Browser Anda.

Read More

Augmented Reality dengan Processing dan NyAR4psg Library Part 1

HeLLLL..oOOO Lads.. sudah lama saya tidak posting tutorial AR baru disini, karena kesibukan setelah menjadi dosen, jadi gak sempet bereksperimen lagi dengan AR. Ok.. pada tutorial kali ini saya akan berbagi ilmu tentang membangun AR dengan Processing dan dengan Library NyAR4psg, but hey, what the is heck is that?,, mungkin dari judulnya dah serem, tapi tenang aja, ngebangun AR dengan Processsing dan Library NyAR4sg lebih mudah daripada ngebangun AR dengan ARToolkit, FlarToolkit, atau OpenSpace3D. 

kenapa? ada beberapa alasan saya senang dengan Processing dan Library NyARpsg ini, pertama, karena processing menggunakan bahasa Java, jadi pengembangannya bisa dijalankan di OS mana saja, dan bahasa Java juga mudah dimengerti daripada bahasa C++ di ARToolkit, ActionScript di Flar, dan Bahasa Scol di OS3D. bahkan walaupun anda bukan seorang programmer pun, bisa mudah menguasai AR dengan Processing ini. 

kemudian alasan kedua adalah, pengaturan (including library) sangatlah mudah, beda dengan FlarToolkit dan ARToolkit yang harus setting library ini, library itu, dll yang terkadang membuat ribet, dan susah digunakan.. 

alasan ketiga, Processing support format OBJ yang bisa dibuat di 2 Software 3D yang paling sering digunakan untuk AR yaitu 3DSMax dan Blender. jadi tidak seperti OpenSpace3D yang harus install Ogre Eksporter dahulu baru bisa dibangun ARNya.. 

alasan keempat, Processing dan NyAR4psg menghandle masalah yang sering terjadi di ARToolkit, FlarToolkit dan OpenSpace3D yaitu masalah Objek yang sering menghilang saat marker disorot kamera, atau objek yang tidak menghilang atau tidak bergerak saat marker menghilang atau saat marker bergerak, FYI masalah ini sering terjadi di 3 library tersebut.

alasan kelima, Processing ringan digunakan daripada menggunakan Eclipse. jadi buat kalian yang mempunyai komputer dengan spek dibawah rata-rata seperti saya..hehe, jangan khawatir, Processing ringan digunakan..

alasan keenam, AR dengan Processing bisa dieksport menjadi format Windows (exe), Format Linux dan Format MacOSx, jadi gak perlu cape-cape seperti ARToolkit yang harus membawa library untuk ngejalanin AR. 

dan alasan yang terakhir, dengan Processing gak perlu script panjang untuk ngebangun AR yang kompleks, seriusan?.. saya sudah buat AR Paddle Marker yang nanti akan saya demo dan saya sharing tutorialnya. tapi sekarang kita belajar dasarnya dulu, bagaimana instalasi librarynya dll. 

nah itulah berbagai alasan saya senang dengan Processing dan library NyAR4sg. btw, dari tadi saya nulis processing dan Library NyAR4sg terus? itu apaan seh?.. Processing itu seperti software developer dengan bahasa Java, Software ini sama seperti Visual C++, Eclipse, Notepad++, dan software developer lainnya. tapi bedanya, Processing digunakan untuk melakukan Image Processing, jadi kita bisa ngebuat Animasi 3D dan 2D dengan Processing, bahkan untuk buat game-pun bisa. 

kemudian apa itu NyAR4sg?? yapp.. NyaAR4sg adalah library turunan dari NyarToolkit yang dibuat oleh Ryo Iizuka, NyarToolkit sendiri dibagi 7 bagian Nyar Untuk Java, Android, C#, ActionScript 3, Silverlight 4, C++, and Processing. dan NyAR4sg yang akan dipakai kita nanti itu adalah, versi yang support dengan Processing.

Well.. Dimana saya bisa dapetin semua library itu?..gampang, Klik Disini Untuk Melanjutkan Tutorial..!!
See You in Next Tutorial Guys..!!

Read More

Tutorial ARToolkit Part 7: Membuat Augmented Reality Sound dengan ARToolkit

Alhamdulillahhironbbil Alamin..

Akhirnya rekan saya Rise Lasdasari S.Kom berhasil menyelesaikan tutorial Augmented Reality Sound dalam bentuk Video Tutorial. di tutorial kali ini, akan diberikan ArToolkit Sound yang sudah dimodifikasi agar sesuai, sehingga dapat mengeluarkan suara dan juga di tutorial ini juga disiapkan marker sebagai untuk percobaan ArSound. 

Sebelum bermain ArSound, silahkan perhatikan kebutuhan software dan hardware yang kamu harus perlukan:

A. Software

     ~ Windows Xp/Vista/Seven/

     ~ Microsoft Visual C++ 2008

     ~ 3DSMax (All Version)

     ~ Wordpad/Notepad ++ (Windows 7)

B. Hardware

     ~ Processor Setara atau diatas Pentium 4 2Ghz

     ~ Ram 512 Mb (1Gb Reccomended)

     ~ VGA 128 Mb ( 512 Mb Reccomended)

     ~ Web Cam (Eksternal Reccomended)

     ~ Free Space of Harddisk 300 Mb 

Download ArToolkit Sound Disini
Download Marker Disini

pass mediafire: artsound


Cat: Kamu Tidak Wajib Mendownload ArToolkit Sound. Karna Kamu bisa Menggunakan ARToolkit Biasa Untuk Menjalankan ArToolkit tersebut. :)

Well,. mulai sekarang, kita bisa menggabungkan antara Augmented Reality 3D dengan Augmented Relaity Sound. Mohon maaf jika ada beberapa kalian yang menunggu tutorial Ar Sound ini. kami Admin, hanyalah manusia biasa. Ok.. Semoga bermanfaat, dan tetap jaga Hak Intektualitas Tutorial AR sound ini.


Download Video Tutorial AR Sound Disini 28 Mb HD 1280x720
password mediafire: arteam

Screen Shoot

Video Tutorial Augmented Reality (Download Via Youtube Downloader):

PS:
Kami memohon maaf atas link yang sudah mati, sebenarnya sudah di Upload ulang Berkali-kali via Mediafire atau Indowebster, tapi selalu Gagal. file kami yang lama juga sudah Mati, JADI TOLONG BUAT SIAPAPUN JANGAN MENYEBARKAN LINK DOWNLOAD KE BLOG ANDA.. AGAR FILE TIDAK MATI.. !! MOHON HARGAI KAMI YANG SUDAH BERSUSAH PAYAH RE-UPLOAD FILE INI. Thanks..


*Sorry For Caps Lock*

List Tutorial

1. Tutorial ARToolkit Part 1: Installing and Testing ARToolkit
2. Tutorial ARToolkit Part 2: Membuat Marker
3. Tutorial ARToolkit Part 3: Multi Marker 
4. Tutorial ARToolkit Part 4: Manipulasi Marker
5. Tutorial ARToolkit Part 5: Texturing Objek
6. Tutorial ARToolkit Part 6: Texturing Multi-Sub Objek
7. Tutorial ARToolkit Part 7: Membuat Augmented Reality Sound dengan ARToolkit
8. Tutorial ARToolkit Part 8: Exporting WRL Dengan Blender

Read More

AUGMENTED REALITY WITH OPENSPACE 3D #2 PART (TENGIBLE)

Assalamualaikum..

Halo Guys, Setelah dari tutorial pertama, saya yakin kalian berhasil menampilkan object menggunakan metode augmented reality pada Openspace3D.

sekarang kita coba untuk membuat metode tangible atau jika marker ditekan maka akan terjadi sebuah event, baik berupa object tersebut beranimasi, menghilang atau muncul, bahkan mengganti material dari object tersebut. sehingga Augmented Reality kita menjadi Interaktif

Ok Jadi, sekarang yang butuh Tutorial Marker Tengible, Bisa Didownload Dibawah:

DOWNLOAD DISINI

Addrian 

Dapatkan Buku Kami Disini:
www.nulisbuku.com

Read More

Buku Augmented Reality With ARToolkit - GET IT NOW

Bismillahirohmanirrohim


Haloo Teman A.R.T, Akhirnya Founder A.R.T Anggi Andriyadi mendapatkan Kesempatan Untuk Menerbitikan Buku Augmented Reality With ARToolkit yang Pertama. InsyaAlloh Buku ini, ditujukan buat Teman-Teman yang ingin belajar Augmented Reality dari Basic. Mohon Doanya Agar Buku Ini Segera Terbit Bulan Ini. Amin..

Cara Pesan Buku:

1. Kirim Email Ke: admin@nulisbuku.com dengan Subjek Order Buku. 
cantumin: nama, alamat, nomor telepon, Judul buku yang dibeli. 
(Contoh: Anggi Andriyadi, Jln, Cendana, No.5, Jakarta, Augmented Reality With ARToolkit.)

2. Setelah itu dapat balesan nomor rekening dia. dan juga uang yang harus di transfer.

3. Transfer ke nomor rekening dia. 

3. Setelah Transfer Selesai, bukti transfernya silahkan dikirim lagi ke email admin@nulisbuku.com, dalam bentuk foto atau hasil scanning

4. nanti dapat konfirmasi dari admin nulis buku. 

5. beres..

atau bisa langsung dibeli di website resmi nulisbuku.com, tapi harus registrasi di website dulu yah. 
http://nulisbuku.com/books/view/augmented-reality-with-artoolkit 

Dapatkan Buku Kami Disini:
www.nulisbuku.com

Read More

Augmented Reality with OpenSpace PART 1

Assalamualaikum..

Hallo Sohib A.R.T, masih bingung pengen mencari Tools AR yang Cocok dan Mudah Digunakan.. Kami sarankan kalian menggunakan Tools Open Space 3D. Open Space 3D adalah sebuah Tools yang bisa kita gunakan untuk membangun Augmented Reality, terutama yang ingin membangun di Dekstop Based dan Web Based. salah satu keuuntungan yang bisa kalian dapetin dengan Open Space 3D adalah:

1.  User Friendly (Mudah Digunakan)
2. Powerfull (banyak fungsi yang dibuat sangat mudah sehingga dapat memberikan banyak tampilan interaksi)
3. teknologinya selalu up to date( dalam hal ini team SCOL sedang membuat library untuk menampilkan custom marker)
4. Bisa Digunakan di Web dan Dekstop (Lebih Mudah)
5. Bisa Menggunakan Marker Tengible (Marker Sentuh)
6. Marker Lebih Sensitif, Maksudnya Walau Markernya Sudah Lecek, tetep masih Terbaca.

Download Tutorial Open Space 3D Disini

Selamat Mencoba, Kawan.. 

Dapatkan Buku Kami Disini:
www.nulisbuku.com

Read More

TROUBLESHOTING: OBJEK 3D TIDAK KELUAR SAAT DIRENDER DI ARTOOLKIT ..

Assalamualaikum.. Wr.Wb

Beberapa hari ini, banyak yang bertanya, kenapa objek 3D yang dibuat di 3DSMax tidak keluar saat dirender di ARToolkit. yang sebenarnya, objek 3D itu keluar, tetapi objek tersebut tidak ditempatkan pas di Grid Viewport layer Perspective. seperti yang dicontohkan digambar ini:

Permasalahan seperti gambar diatas, merupakan penyebab kenapa objek 3D kita tidak terlihat saat di render di ARToolkit. jadi bagusnya seperti apa?, untuk diketahui, grid viewport 3DSMax itu adalah parameter marker kita, jadi jika kita mau mengukur pas-nya objek 3D saat dirender diatas marker, kita harus memperhatikan bahwa objek 3D kita harus sudah PAS di layer viewport perspective. 

Ok, Sekian.. Solusi dari Permasalahan Kenapa Objek tidak di terlihat saat di Render. intinya, Your Grid is Your Marker...!! Semoga Bermanfaat. jika, masih ada masalah, komen saja dibawah..

Salam
ART

Dapatkan Buku Kami Disini:
www.nulisbuku.com

Read More