Lompat ke konten Lompat ke sidebar Lompat ke footer

Tutorial Cara Menciptakan Game 2D Memakai Unity Dan Orthello Framework



Unity yaitu sebuah game engine dimana engine ini mempunyai kemampuan untuk menciptakan game-game 3D dengan banyak sekali dampak yang memukau, mirip dampak lighting, physics, dsb. Namun tahukah Anda bahwa Unity sanggup pula dipakai untuk menciptakan game 2D? Ya, selain untuk menciptakan game-game 3D ternyata unity juga mempunyai kemampuan untuk menciptakan game 2D. Namun seberapa ampuhkah kemampuan unity untuk menciptakan game 2D? Apakah bisa seampuh engine 2D lain mirip flash, game maker, dsb? Hal ini merupakan pertanyaan yang cukup sulit, sebab setiap developer tentu mempunyai tools-tools andalan mereka dalam menciptakan produknya. Namun bagi saya eksklusif sebagai seorang developer yang sering memanfaatkan tools Unity, saya sangat yakin bahwa Unity sama sekali tidak kalah dengan engine-engine 2D lainnya asalkan developer bisa memanfaatkan tools-tools dalam unity secara maksimal. Hal ini dibuktikan dengan munculnya banyak sekali game-game 2D yang cukup fenomenal yang dibentuk memakai Unity. Sebut saja Bad piggies, game 2D besutan Rovio yang sangat sangat populer ternyata juga dibentuk memakai Unity.


Selain kemampuannya yang sudah cukup sakti, kemampuan Unity dalam menciptakan game-game 2D juga sangat didukung dengan adanya banyak sekali library/framework pemanis yang sangat memudahkan untuk menciptakan game-game 2D. Contoh framework yang sangat populer yaitu 2DToolkit dan Orthello. Khusus untuk artikel kali ini saya bermaksud untuk membahas perihal pembuatan animasi simple memakai salah satu framework 2D yaitu Orthello. Kenapa orthello saya pilih sebab alasan utamanya yaitu orthello merupakan framework yang gratis namun mempunyai kemampuan yang tidak kalah dengan framework berbayar lainnya. Adapun alat dan materi yang perlu dipersiapkan untuk mengikuti tutorial ini yaitu sbb :

  1. Unity (Yang ini pastinya lah, judulnya aja Simple 2D Sprite di Unity. Anda sanggup mendownload Unity di situs resminya di sini)
  2.  Orthello framework (Anda sanggup mendownload orthello free di situs resminya di sini)
    Texture packer (Tools untuk menciptakan sprite 2D, Anda sanggup mendownloadnya di situs resminya di sini)
  3.  Asset, optional (Ini yaitu pola sprite sederhana buatan saya, Anda sanggup mendownloadnya di sini)
Peringatan : 
Sebelum Anda membaca lebih jauh saya memperlihatkan alternatif tutorial menciptakan game 2D tanpa memakai orthello framework disini

Nah… Jika semua tools telah siap saatnya kita mulai percobaannya. Langkah pertama sebagai pemanasan yaitu siapkan spritenya. Dalam tutorial ini saya mempunyai 4 buah gambar yang akan saya jadikan sebuah sprite dengan 2 animasi, yaitu idle (diam) dan walk_right (berjalan ke kanan).


Langkah selanjutnya kita buat project gres di Unity. Ketik file >> new project >> buat project baru


Dengan Unity masih aktif terbuka selanjutnya buka file orthello dan lakukan double click untuk mengimport orthello ke dalam project


Setelah double click Anda akan diberi konfirmasi komponen apa saja yang akan di import. Centang semua dan klik import


Jika orthello sudah berhasil di import maka akan muncul susunan file-file orthello mirip pada gambar


Sebagai langkah awal masukkan object orthello dalam Orthello >> Object >> OT ke dalam scene dengan melaksanakan drag drop ke window hierarchy


Kemudian lakukan pengaturan resolusi pada Player setting mirip gambar di bawah



Lakukan juga pengaturan resolusi game pada object view dalam Child object OT


Setelah semua pengaturan dilakukan maka pengaturan kamera secara otomatis akan dirubah oleh orthello menjadi tampilan Orthographic yaitu tampilan kamura 2D. Lihat gambar di bawah


Kemudian saya akan menciptakan sebuah object 2D stickman. Buat susunan folder mirip gambar di bawah. Susunan folder ini bukanlah hukum baku, Anda sanggup mengatur susunannya sesuai cita-cita Anda.


Setelah kerangka folder-folder siap saatnya menciptakan sprite, dengan langkah awal menciptakan Texture Atlas. Texture Atlas dibentuk dengan memakai software tersendiri, yaitu Texture Packer. Buka texture packer maka akan muncul tampilan di bawah.


Kemudian klik Use Free (lite) Version untuk masuk ke dalam program. Setelah masik, saatnya menciptakan Texture Atlas gres dengan melaksanakan drag & drop sprite 2D ke dalam Texture Packer pada kepingan Sprites


Kemudian rubah pengaturan layout mirip pada gambar di bawah. Perhatikan pada kepingan yang diberi tanda


Setelah layout rubah pengaturan output. Perhatikan pula pada kepingan yang diberi tanda. Untuk data file masukkan pada [lokasi project]/Assets/User Assets/Stickman/Texture Atlases. Beri nama Stickman.xml. Peringatan : Pada kondisi default Texture packer akan memberi ekstensi .plst pada data file. Namun biar sanggup di baca unity maka format data harus dirubah dari .plst ke .xml. Lihat gambar di bawah


Setelah semua pengaturan selesai maka berikut yaitu preview dari Texture Atlas yang telah kita buat


Setelah semua siap tinggal kita buat Texture Atlas dengan klik Publish


Setelah kita lakukan publish maka kalau penyimpanan lokasi benar maka data dan texture akan ada dalam folde Texture Atlases di Unity


Secara default semua image yang diimport dalam Unity mempunyai type Texture. Typeini menciptakan gambar lebih ringan untuk di load namun akan terlihat sedikit kabur. Dalam game 2D hampir tidak ada bedanya antara object (yang seharusnya jadi texture) dengan object user Interface GUI. Untuk itu meskipun pada bekerjsama image dipakai sebagai texture, maka akan lebih baik alhasil kalau kita ruba typenya ke GUI. Bentuk GUI akan menciptakan gambar lebih terperinci dan tidak kabur. Klik image yang di rubah, pada Texture Type pilih GUI.


Selanjutnya untuk menciptakan sebuah animasi langkah pertama yaitu menciptakan sebuah object Container. Container sanggup saya ibaratkan sebagai data image apa saja yang akan load di suatu scene. Image ini berupa Texture Atlas dimana di dalamnya terdapat data pada Texture Atlas dan Image itu sendiri. Pada kasus ini kita akan menciptakan container dari Stickman, dengan Texture Atlas yang telah kita buat tadi memakai Texture Packer. Langkah pertama yaitu drag drop object Orthello dari Orthello >> Objects >> Sprites >> Sprite Atlas >> SpriteAtlasCocos2SD ke dalam scene atau ke window Hierarchy


Setelah kita drag drop maka secara otomatis akan ada object Container gres dalam child Containers.


Selanjutnya kita lakukan pengaturan, berupa setting nama container dan lakukan drag & drop data dari Texture Atlas ke dalam container.


Ketika data di drag & drop maka seharusnya secara otomatis image dari Texture Atlas akan terinclude dan Orthello akan mengenerate sprite-sprite pada Texture Atlas Anda.


Setelah Container dibentuk maka langkah selanjutnya yaitu menciptakan Animasi dari container. Animasi kita buat dengan melaksanakan drag & drop object dari Orthello >> Objects >> Sprites >> Animation ke dalam scene window Hierarchy.


Kemudian beri nama animasi


Buat animasi dengan mengisi frameset sesuai jumlah animasi yang diinginkan. Pada setiap frameset masukkan container yang telah kita buat dengan melaksanakan drag & drop


Kemudian atur nama animasi dan range frame dari animasi tersebut sesuai Texture Atlas yang telah dibentuk sebelumnya


Object container beres, animasi beres, selanjutnya tinggal menciptakan object dari animasi yang telah kita buat. Hal ini hampir sama dengan menciptakan object biasanya. Caranya drag & drop object Animating Sprite dari Orthello >> Objects >> Animating Sprite ke dalam scene.


Beri nama object animasinya dan masukkan animasi yang telah kita buat sebelumnya.


Sekarang untuk ujicoba tinggal play deh project kita, maka seharusnya akan muncul animasi rang bergerak. Selamat, Anda berhasil menciptakan animasi 2D di unity… ^^


Nah… Selanjutnya apakah berhenti hingga disini? Terus gimana kalo setiap kita menekan key tertentu muncul animasi yang berbeda? Ya… Tentu harus memakai script. Ok, kali ini saya akan memberi pola object akan me-load animasi berbeda ketika saya menekan key Panah kanan. Langkah awalnya non-aktifkan dulu auto start animasinya.


Kemudian saya bikin sebuah script StickmanBehaviour, dan jangan lupa untuk menaruh script ini di object Stickman.


Nah isi scriptnya kurang lebih mirip ini

 using UnityEngine; using System.Collections;  public class StickmanBehaviour : MonoBehaviour {     private OTAnimatingSprite otAnimatingSprite;      void Start() {         otAnimatingSprite = this.GetComponent();     }      void Update() {         // Get keyboard input         if (Input.GetKey(KeyCode.RightArrow))             MoveRight();         else             Idle();     }      public void MoveRight() {         otAnimatingSprite.PlayLoop("Walk Right");          //Some script to translate object     }      public void Idle() {         otAnimatingSprite.PlayLoop("Idle");     } }  

Ato kalau mau screenshotnya silahkan liat gambar di bawah



Ok… Sekarang jadilah animasi Anda. Silahkan tekan panah kanan dan liat apa yang terjadi. Selamat Anda telah mengilkuti tutorial ini dengan baik ^^

Kesimpulan :
Mungkin dari beberapa step yang Anda lakukan terlihat cukup ribet dan sulit, terdapat beberapa tahap hanya untuk menciptakan 1 animasi 2D. Nah, bekerjsama tidak ribet, namun kita harus mengetahui step-stepnya secara urut. Berikut yaitu rangkuman step-step yang harus dilakukan
  • Siapkan materi (unity, orthello framework, texture packer)
  • Buat new project unity, atur banyak sekali keperluan mirip resolusi dsb, import orthello framework
  • Masukkan object orthello ( OT ) ke dalam scene dan atur resolusi dan pengaturan lain di View
  • Buat Texture Atlas memakai software Texture Packer
  • Buat object Container dan masukkan Texture Atlas yang telah dibentuk pada step sebelumnya. Container  yaitu mirip mendefinisika Texture Atlas yang akan dipakai di scene biar sanggup di proses oleh orthello dan dijadikan kumpulan Sprite
  • Buat animation. Animation yaitu mirip mendefinisikan animasi dari Container yang dibentuk pada step sebelumnya. Misal : Animasi jalan, berasal dari container A, dari frame 1-10
  • Buat object animasi. Ini mirip menciptakan object biasa, tinggal masukkan animasinya
Ok… Mungkin cukup sekian saja artikel dari saya. Mohon maaf kalau mungkin ada kesalahan, saya ucapkan selamat mencoba dan terus berkarya ^^

Sumber : Blog pribadiAndengine, library imut yang tangguh untuk Android game developer 
Sumber http://duniadigit.blogspot.com/