Kamis, 24 November 2011

Membuat Objek Game Maker

 Membuat Objek dalam Game Maker
Pernahkah teman-teman bermimpi bisa membuat game yang hebat? , dan mengizinkan teman-taman anda untuk memainkan permainan ciptaan anda?. Jika kedua jawaban tersebut anda jawab”Ya” berarti anda datang ke situs yang tepat, dan jika jawaban anda “tidak” maka anda beruntung karena berkesempatan untuk
bisa mempelajari ilmu yang bermanfaat. Game!, sepertinya kata ini sudah tidak asing terdengar di telinga anda, karena dari mulai anak kecil samapai orang dewasa pun semua mengenalnya. Setiap detik, setiap menit, setiap jam, pokoknya setiap saat anda selalu bersamanya (maaf berlebihan, nggak juga kali ya! ). Ok deh sekarang langsung ke intinya, di sini anda akan belajar bagaimana membuat game dengan software yang keren bin canggih yaitu “Game Maker”. Game maker atau biasa disingkat”GM” adalah sebuah software komputer yang bisa memberikan akses untuk anda agar bisa membuat game hanya dengan metode mudah yaitu Drag & Drop.Bahkan jika anda bisa sedikit menguasai bahasa GML (Game maker Language) saya yakin anda akan mampu membuat game yang professional(di bahas pada bab selanjutnya). Game Maker terdiri dari dua edisi yaitu Edisi Lite dan Edisi Pro. Kedua-duanya memiliki potensi besar untuk bisa membuat game yang hebat. Namun Edisi Pro memiliki keunggulan lebih yaitu: Menghilangkan logo game maker di saat loading, dan fitur tambahan lain. Namun kabar baiknya, tidak seperti software lain yang mempunyai jangka waktu, Game Maker bisa di gunakan selama-lamanya (sasebeuhna) walaupun anda tidak melakukan register. Dan hebatnya lagi, jika anda pandai anda bisa mengakali kode-kode yang ada di versi Pro sehingga bisa di gunakan di Versi yang Lite. Jadi apa yang anda tunggu, mari kita langsung menuju ke TKP dan bersiap untuk membuat Game impian anda.Pada tutorial game maker sebelumnya kamu telah mempelajari mengenai bagaimana Memasukan sprites (gambar) ke dalam game maker. Pada tutorial game maker kali ini kamu akan mempelajari mengenai bagaimana cara membuat Objek dalam game maker. Objek adalah komponen dalam game maker yang berfungsi untuk menuliskan perintah-perintah yang harus di jalankan oleh suatu sprites atau resources lain. Objek memiliki peranan penting karena mengatur segala interaksi yang terjadi dalam game, misalnya karakter bergerak, menembak, atau menghindar.Untuk membuat objek dalam game maker caranya yaitu : “Klik kanan Object --) Create Object “, maka akan muncul tampilan berikut ini:
Menu objek cukup kompleks, karena di bagian kiri terdapat informasi mengenai sprites yang akan di pakai, di bagian tengah terdapat “menu event” dan di bagian kanan terdapat “menu Action”. Menu event dan action akan kamu pelajari pada pembahasan selanjutnya. Lalu masukan sprites yang kamu inginkan ke dalam objek. Menu visible berfungsi untuk menentukan apakah sprites yang kita masukan harus terlihat dalam permainan atau tidak. Sebagian besar Sprites dibuat visible tapi adakalanya Sprites di buat invisible (tidak terlihat), misalnya untuk membuat jalur gerak monster atau membuat pintu rahasia dalam game. Sedangkan menu Solid berfungsi untuk menentukan apakah objek tersebut harus di buat padat dan keras atau tidak , (biasanya menu ini solid di gunakan untuk membuat tembok). 
Membuat Event dalam Game Maker
  Untuk membuat Event caranya cukup mudah yaitu masuk ke menu objek lagi, lalu klik add event. Di bawah ini merupakan penjelasan fungsi-fungsi tombol yang ada pada menu event.
Create Event
Menu ini berfungsi untuk membuat suatu event ( kejadian) ketika suatu objek tersebut dibuat. Menu ini biasanya digunkan untuk membuat variable objek dalam game.
Destroy Event
Menu ini berfungsi untuk membuat suatu kejadian ketika suatu objek dihancurkan dalam game, menu ini jarang di pergunkan karena menu ini bisa di wakili oleh Action “Destroy Instance”.
Alarm Event
Menu ini berfungsi untuk membuat suatu kejadian yang kita telah set waktunya, (pembahasan yang lebih terperinci akan di bahas pada tutorial selanjutnya).
Step Event
Menu ini berfungsi untuk membuat suatu kejadian yan terjadi di saat suatu objek melakukan gerakan misalnya bergerak, melompat, atau menembak. Jika kamu mengetahui gml atau bahasa pemrograman game maker, maka menu ini sangat efektif untuk membuat perintah perintah menu “action” menjadi lebih singkat dan terorganisir.
Collision Event
Dalam game maker, menu ini berfungsi untuk membuat suatu kejadian yang terjadi persis ketika suatu objek bertumbukan atau menyentuh objek lain. Menu ini sangat efektif untuk membuat kejadian seperti apakah yang terjadi bila peluru menyentuh karakter, atau bila karakter menyentuh power-up atau item.

Keyboard Event
Sesuai dengan namanya, menu ini berfungsi untuk membuat kejadian yang terjadi ketika suatu tombol di keyboard di tekan, misalnya bila keyboard di tekan maka akan membuka jendela inventory atau arah panah untuk menggerakan pemain.
Event Game Maker - bagian dua
Tutorial game maker kali ini merupakan lanjutan dari tutorial sebelumnya yaitu mengenai bagaimana membuat event di game maker. Event yang akan di bahas pada tutorial ini yaitu : mouse event, dan other event.
Mouse Event
Event ini berfungsi untuk membuat suatu kejadian yang terjadi pada saat ada interaksi dengan mouse ( klik kiri, klik kanan, dan lain-lain). Tidak hanya itu saja, event ini pun memungkinkan kamu untuk bisa membuat objek bisa berinteraksi dengan tombol-tombol di joystick.
Other Event
Event ini merupakan event yang paling bervariasi fungsinya :
Outside event : Event ini berfungsi untuk membuat suatu kejadian yang terjadi pada saat suatu objek meninggalkan ruangan (room), contoh penggunaan event ini misalnya untuk membuat kejadian ketika karakter jatuh dari tebing,dll.
Boundary event : sama seperti Outside Event, hanya saja bila outside event akan terjadi jika seluruh bagian objek meninggalkan ruangan, sedangkan bila boundary event akan terjadi walaupun hanya sedikit bagian dari objek yang keluar dari ruangan.
Views event: berfungsi untuk menampilkan ruangan dalam sudut pandang berbeda, event ini biasanya di gunkan untuk game 3D.
Game Start Event : berfungsi untuk membuat suatu kejadian yang terjadi pada saat permulaan game, event ini biasanya di gunakan untuk memanggil load data Secara otomatis atau memainkan musik pada saat intro game.
Game End Event : fungsinya merupakan kebalikan dari game start event, event ini biasanya di gunakan untuk membuat auto saving dalam suatu game.
Room Start event : berfungsi untuk membuat suatu kejadian dalam game yang terjadi pada saat stage di mulai, biasanya event ini digunakan untuk menginisialisasi objek-objek yang ada pada game.
Room End Event : berfungsi untuk membuat suatu kejadian dalam game yang terjadi pada saat stage usai atau pemain kembali lagi ke layer title.
Event Game Maker - bagian tiga
Tutorial game maker kali ini merupakan akhir pembahasan dasar mengenai menu Event di game maker. Event yang akan di bahas pada tutorial ini adalah Other Event, Drawing event, Key Pressed dan Key Released Event.
No More Lives : Event ini berfungsi untuk membuat suatu kejadian di dalam game maker yang terjadi pada saat semua nyawa karakter telah habis terpakai, event ini biasanya di gunakan untuk menampilkan layar game over,dll.
No More Health : Event ini jarang saya gunakan karena fungsinya sangat terbatas, saya mengganti event ini dengan sistem varibel ( pembahasan mengenai variable akan di bahas pada game maker tutorial selanjutnya.
End of Animation : Event ini berfungsi untuk membuat suatu kejadian dalam game yang terjadi pada saat animasi suatu objek berakhir, event ini hanya efektif digunakan bila sprite yang digunakan mempunyai lebih dari satu subimage.
End of path : Event ini berfungsi untuk membuat suatu kejadian yang terjadi ketika suatu objek mencapai batas dari suatu path yang sudah di tentukan ( pembahasan mengenai path akan di bahas pada tutorial game maker selanjutnya).
Close Button : Event ini hanya akan berfungsi jika kita mendisable fungsi “ treat close button as key yang ada pada global game setting---) other.
User Definied : Tidak ada penjelasan untuk Use definied karena event ini di buat dan didefiniskan oleh kamu sendiri dengan menggunakan keahlian gml kode.
Drawing event
Event ini berfungsi untuk menggambar suatu objek , misalnya Health suatu karakter, menggambar poligon ( dalam game 3D ) , dan segala sesuatu yang berhubungan dengan gambar dan settingnya.
Key pressed dan Key Released Events
Kedua event ini fungsinya hampir sama dengan Keyboard Event, di bawah ini merupakan perbedaan diantara ketiga event tersebut.
Keyboard Event : Fungsi ini akan terjadi bila pemain menekan dan menahan tombol, event ini biasanya digunkan untuk menggerakan pemain.
Key Pressed Event: Fungsi ini akan terjadi hanya satu kali yaitu tepat pada saat tombol ditekan sehingga mempunyai jeda waktu, event ini berfungsi untuk membuat karakter dapat menembakan projektil atau peluru kepada musuh.
Key Released Event: Fungsinya merupakan kebalikan dari key pressed event, sehingga event ini akan terjadi bila pemain berhenti melepaskan tombol.
Mengolah Gambar Strips
Pada tutorial game maker sebelumnya kamu telah mempelajari mengenai fungsi dasar event-event yang ada di game maker. Lalu, pada tutorial game maker kali ini kamu akan mempelajari mengenai strips dan bagaimana cara mengolahnya .Strips adalah suatu kumpulan gambar (sprites) yang memuat aksi atau gerak yang saling berkaitan , stripes biasanya di gunakan untuk membuat animasi objek, misalnya : animasi untuk karakter bergerak, animasi karakter menebas musuh, dan lain-lain . Cara mengolah gambar strips cukup mudah yaitu : klik kanan Sprite ---) Create Sprite ---) Edit Sprite ---) File ---) Create From Strips, lalu pilih gambar strips yang akan di gunakan maka Setelah itu akan muncul tampilan seperti berikut ini :
 Penjelasan menu parameter:
Number of Images : Parameter ini untuk menentukan berapa banyak gambar yang akan di ambil dari strips itu, ( jika panjang dan lebar gambar dari strips itu beraturan disarankan menggunkan parameter ini, jika panjang dan lebarnya tidak beraturan disarankan tidak mempergunkan parameter ini ).
Images per row : parameter ini berfungsi untuk menentukan berapa banyak image yang akan di ambil Secara vertical.
Image Width : Lebar gambar yang akan di ambil dari strips.
Image Height: Tinggi gambar yang akan di ambil dari strips.
Vertical Cell Offset dan horizontal Cell Offset : Kedua parameter ini jarang saya gunakan, fungsinya untuk melewati gambar daris strips sebesar Image width dan Image height.
Vertikal dan horizontal pixel offset : Kedua parameter ini berfungsi untuk menentukan koordinat gambar yang akan di ambil dari sebuah strips.
Horizontal separation dan vertical separation: Kedua parameter ini berfungsi untuk memberikan ruang kosong diantara gambar yang akan di ambil, biasanya fungsi ini digunakan bila gambar dalam sebuah strips mempunyai jarak atau ruang kosong. Setelah kamu mendapatkan gambar yang tepat dari sebuah strips , klik tombol OK. Maka gambar yang tadi kamu pilih akan menjadi sebuah sprite, dan jika kamu Memasukan dua sprites atau lebih dari sebuah strips, maka akan terbentuklah sebuah animasi yang kamu inginkan.
Cara Membuat Script di Game Maker
Pada tutorial game maker kali ini kamu akan belajar mengenai cara membuat sebuah script di game maker. Script dalam game maker merupakan sekumpulan perintah yang di tulis dalam bahasa pemrograman yang diberikan kepada suatu objek agar dapat melakukan suatu interaksi dalam game.
Cara membuat script dalam game maker sangatlah mudah , yaitu :
  • Klik kanan Objek yang akan dipakai.
  • Lalu pilih properties.
  • Setelah itu pilih event yang di perlukan ( penjelasan menu event game maker )
  • Pilih “control” .
  • lalu klik kanan execute code, untuk lebih jelasnya perhatikan gambar di bawah ini :
  
Maka setelah itu akan muncul sebuah window box berwarna putih yang diatasnya bertuliskan execute code, di bawah ini merupakan penjelasan dari window box tersebut :
Applies to self : Menu ini berfungsi untuk memberikan perintah bahwa script yang kamu tulis harus di jalankan oleh objek itu sendiri.
Applies to other : Menu ini berfungsi untuk memberi perintah bahwa script yang kamu tulis harus dijalakan oleh objek lain, misalnya oleh objek yang bersentuhan .
Applies to object : Menu ini berfungsi untuk memberi perintah kepada objek bahwa script yang kamu tulis tersebut harus di jalankan oleh objek lain yang sudah di definiskan sebelumnya.
Go to particular line : menu ini berfungsi untuk pergi ke baris yang telah kamu tentukan, menu ini bisanya di gunakan setelah kita tahu pesan error di debug mode.
Check the script for the syntax error : menu ini sangat berguna untuk mendeteksi kesalahan-kesalahan kode yang kamu tulis pada script, kesalahan yang sering terjadi misalnya kurang menambahkan tanda kurung di akhir sebuah statement, atau salah menuliskan ejaan script code. 

Tutorial Pemrograman VB.NET,PHP,MYSQL,MC Office


Tutorial Pemrograman PHP MY SQL DAN HTML
Tutorial VB.NET
Panduan Pembuatan Skripsi
Tutorial Microsoft Office

Selasa, 22 November 2011

Tutorial pemrograman HTML dan PHP


Pemrograman PHP & MySQL

Pada awalnya PHP merupakan singkatan dari Personal Home Page tools, sebuah tool (alat bantu) untuk memonitor pengunjung suatu web. PHP mula-mula dikembangkan oleh Rasmus Lerdofr. Istilah PHP kemudian lebih mengacu pada Hypertext Prepocesor. PHP kemudian lebih dikembangkan untuk membangun aplikasi web, mendukung database (i.e mySQL/Oracle) dan memproses berbagai form. Untuk dapat menjalankan PHP dibutuhkan suatu sistem yang telah terkonfigurasi dengan baik. Sistem ini meliputi suatu web server (i.e Apache Web Server), tools (PHP) dan database (MySQL). Ketiganya merupakan suatu bentuk open source yang dapat berjalan multi platform (Windows maupun Linux/Unix).
1. Instalasi Apache Web Server, PHP dan MySQL dengan XAMPP
         Anda dapat menggunakan program XAMPP untuk menginstal sistem PHP. Program ini sudah menyediakan satu paket instalasi PHP yang meliputi Apache Web Server, PHP dan MySQL. Jalankan instalasi XAMPP 1.5.1 sebagai berikut.
 Ketika proses set up telah selesai, akan muncul pertanyaan apakah Anda juga akan menginstal XAMPP server (Apache, MySQL dan Filezilla) sebagai service. Klik OK dan lanjutkan hingga instalasi lengkap.Lanjutkan proses instalasi hingga muncul tampilan berikut:
 Bukalah sebuah browser (misalnya, Internet Explorer/Mozila Firefox/Opera), pada bagian address ketikkan URL http://localhost/phpmyadmin/. Jika muncul tampilan seperti terlihat pada gambar berikut, berarti instalasi PHP berhasil.
Untuk lebih jelasnya dalam pembuatan website,kini saya sediakan link untuk dapat di download oleh anda dengan cuma-cuma atau gratiss,disini anda dapat membuat website sederhana yang anda inginkan....
klik link di bawah ini untuk mendownloadnya.

Senin, 21 November 2011

Cara Membuat Animasi Dengan Photoshop

kali ini saya akan sedikit berbagi cara membuat gambar animasi atau tulisan bergerak dengan photoshop.Karena banyak kita jumpai diweb maupun diblog banner gambar bergerak atau tulisan bergerak...Anda tertarik....?? Gunakan software Photoshop versi berapa saja,kalo tidak punya ini ada cs3 portable download dan instal.
Ikuti Cara caranya....
Langkah 01
Langkah 02
 Langkah 03
 Langkah 04
 Langkah 05
 Langkah 06
Langkah 07
 Hasilnya:

Yang Lainnya:
 LEBIH BAIK MENCOBA DARI PADA TIDAK SAMA SEKALI,SEMOGA BERMANFAAT
SELAMAT MENCOBA


Minggu, 20 November 2011

Membuat Flash Slideshow dengan PHP


Abstraks

       Terdapatnya animasi flash dalam sebuah website merupakan salah satu nilai lebih. Keragaman efek yang dapat disajikan adalah kekuatan utama dan letak keistimewaan animasi flash. Tak jarang website-website komersial yang menampilkan banyak animasi iklan dalam flash, agar pengunjung web tertarik untuk melihatnya.
       Flash slideshow merupakan salah satu jenis animasi yang acap kali diterapkan dalam website. Biasanya, animasi jenis ini digunakan untuk menampilkan foto-foto. Mungkin bisa, tapi sepertinya sulit jika kita menginginkan flash slideshow tersebut dinamis, artinya bisa berganti dengan sendirinya ketika kita ubah scriptnya, tanpa perlu membongkar isi flash filenya. Kesulitan ini dapat diatasi dengan PHP Flash Slideshow, hasil kreatif dari seorang PHP programmer bernama Adi Setiawan. Seperti apakah cara kerjanya?
       PHP Flash Slideshow merupakan sebuah class PHP yang menggunakan PHP Ming extension (yang harus terinstall dalam PHP kita, cek dengan phpinfo()) untuk menghasilkan flash animation gaya slideshow. Class ini membutuhkan file .jpg untuk di generate menjadi file flash (.swf). Jadi, ketika kita ingin mengganti tampilan, cukup kita ubah array imagenya, yang pastinya ini bisa kita buat panel pengaturan khusus tanpa perlu remote file (dengan database).
File classnya sebagai berikut. 
?php
/**
* PHP Flash Slide Show
*
* Create simple flash slideshow from sequences of JPEG images
* Requirement:
* You MUST have PHP with Ming installed as PHP Extension
* see http://ming.sourceforge.net and http://php.net/manual/en/ref.ming.php
* Ask your web server administrator if you don't know how to install it
*
* @author Adi Setiawan <http://ex3me.org> adisetiawan@gmail.com
* @license GNU/GPL
* @version 0.2
*/

class flashSlideShow
{
//initiate needed variables
var $movie;
var $i;
var $width;
var $height;
var $bgred;
var $bggreen;
var $bgblue;
var $interval;

/**
* Constructor
*
* Create new object
*
* @access public
* @param integer  $width  movie width in pixel
* @param integer  $height  movie height in pixel
* @param integer  $interval interval in second, between each image
* @param string  $bgcolor movie background color in hex
* @return void
*/
function flashSlideShow($width, $height, $interval = 1, $bgcolor = '#FFFFFF')
{
  $this->width = $width;
  $this->height = $height;

  $this->movie = new swfMovie();
  $this->movie->setDimension($width, $height);
  $this->movie->setRate(10);

  $this->setBgColor($bgcolor);
  $this->setInterval($interval);
}

/**
* Set slideshow interval
*
* Set slideshow interval between each image. interval in seconds
*
* @access public
* @param integer  $interval interval in seconds
* @return void
*/
function setInterval($interval)
 
{
  if (is_int($interval) AND $interval >= 1) {
   $this->interval = $interval*10;
  } else {
   $this->interval = 10;
  }
}

/**
* Set background color
*
* Set background color in hex
*
* @access public
* @param string  $bgcolor movie background color in hex
* @return void
*/
function setBgColor($bgcolor)
{
  $this->bgred   = hexdec(substr($bgcolor,0,2));
  $this->bggreen = hexdec(substr($bgcolor,2,2));
  $this->bgblue  = hexdec(substr($bgcolor,4,2));
}

/**
* Set background color in RGB Format
*
* Set background color in RGB Format
*
* @access public
* @param integer  $red Red RGB Format Value for background color
* @param integer  $green Green RGB Format Value for background color
* @param integer  $blur Blue RGB Format Value for background color
* @return void
*/
function setBgColorRGB($red,$green,$blue)
{
  $this->bgred   = $red;
  $this->bggreen = $green;
  $this->bgblue  = $blue;
}

/**
* Add image to slideshow
*
* Add one JPEG file to flash slideshow

*
* @access public
* @param string  $filename JPEG filename
* @return void
*/
function addImage($filename)
{
  //$this->movie->add(new SWFBitmap(fopen($filename, "rb")));

  //create image object
  $b = new SWFBitmap(fopen($filename,'rb'));
   $s = new SWFShape();
   $s->setRightFill($s->addFill($b));
   $s->drawLine($this->width, 0);
   $s->drawLine(0, $this->height);
   $s->drawLine(-$this->width, 0);
  $s->drawLine(0, -$this->height);

  //transition white to image
  $this->i = $this->movie->add($s);
  $r = 255;
  for($n=0; $n<=5; ++$n) {
     //$i->multColor(1.0-$n/10, 1.0, 1.0);
     //$i->addColor(0xff*$n/20, 0, 0);
     $this->i->addColor($r-30, $r-30, $r-30);
     $this->movie->nextFrame();
     $r = $r - 30;
  }

  //static image
  $this->i = $this->movie->add($s);
  $this->addInterval();

  //transition image to white
  $r = 0;
  for($n=0; $n<=5; ++$n)
  {
     //$i->multColor(1.0-$n/10, 1.0, 1.0);
     //$i->addColor(0xff*$n/20, 0, 0);
     $this->i->addColor($r+30, $r+30, $r+30);
     $this->movie->nextFrame();
     $r = $r +30;
  }
}

/**
* Add array of image to slideshow
*
* Add array of JPEG files to flash slideshow
*
* @access public
* @param array  $filename array of JPEG files
* @return void
*/
function addImages($filearray)
{
  foreach($filearray as $key => $val) {
   $this->addImage($val);
  }
}

/**
* Add interval between each image
*
* Add interval between each image
*
* @access private
* @return void
*/
function addInterval()
{
  $i = 1;
  while ($i <= $this->interval) {
   $this->movie->nextFrame();
   $i++;
  }
}

/**
* Save movie
*
* Save movie
*
* @access public
* @param string  $filename name of movie file to saved
* @return void
*/
function save($filename)
{
  $this->movie->save($filename);
}
/**
* Output movie
*
* output movie immediatelly
*
* @access public
* @return void
*/
function output()
{
  header("Content-Type:application/x-shockwave-flash");
  $this->movie->output();
}
}
?>

.
File tersebut disimpan dengan nama class.flashslideshow.php. Untuk menggunakannya, kita buat file dengan nama terserahanda.php dan disimpan dalam folder yang sama dengan file classnya

?php
//include class file
include('class.flashslideshow.php');

/*
create new object with the following variabel
flashSlideShow($width, $height, $interval, $bgcolor)
$width, movie width in pixel
$height, movie height in pixel
$interval, interval in seconds between each images
$bgcolor, movie backgground color in hexadecimal value
*/
$movie = new flashSlideShow(300, 225, 3, '#FFFFFF');


/* we add sequences of images in array
this array may come from readdir function,database query etc
*/
$myfile = array('image1.jpg','image2.jpg','image3.jpg','image4.jpg','image5.jpg');
$movie->addImages($myfile);

/*
output the flash
*/
$movie->output();
?>





Cara membuat animasi Gambar berjalan

Untuk membuat cara animasi teks berjalan yakni dengan menggunakan kode seperti dibawah ini :
<marquee behavior="alternate" direction="right"scrollamount="5" scrolldelay="10" >Selamat Datang di Blog Pembuatan Animasi Dengan Macromedia Flash</marquee>

Sedangkan untuk mengganti teks dengan gambar, kodenya menjadi :
<marquee behavior="alternate" direction="right" scrollamount="5" scrolldelay="10"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8l7pQqqYBTqopRkydPoLVuWGJcDobLfd7hpLdNN7ntrPGPxmQekdnezQLVxJSr6pu3xBhDtVwR5Vfj4EoTxMC8QA9m24OJBt3Q_boEreg6g88WLmAruBz-adgqPzQ1MklT9queZ0UMc8/s200/LOGO_TUTWURI_BW.jpg" width="198" /></marquee>
Dan hasilnya bisa dilihat disini