Unity 3D : Facebook Online Score Board

UnityLeaderboard

Ngelanjutin dokumentasi sebelumnya tentang Porting Game Unity3D ke Facebook App, kali ini gue akan membahas sedikit tentang penambahan fitur yang akan sangat berguna bila Anda ingin porting game unity ke web player Facebook. Yep, online scoreboard. Rasanya kurang lengkap bila game yang dimainkan via Facebook tapi tidak memiliki online score yang rankingnya terdiri dari akun-akun Facebook yang telah memainkan game kita. Sebenarnya ada beberapa cara untuk menampilkan scoreboard memalui Facebook. Facebook sendiri telah menyediakan Scores Api di halaman facebook developer, cuman gue pribadi masih sulit untuk mengimplementasikannya dalam game Unity. Tapi jangan khawatir, gue menemukan Plugin yang sangat keren yang bisa menampilkan score melalui Facebook. Gue sendiri sudah mencobanya dan 100% berhasil, hanya tampilannya masih sederhana. Masih butuh improvisasi untuk UI nya, tapi untuk sementara gue biarin seperti ini dulu.

scoring

Gambar diatas adalah Leaderboard yang sudah gue uji coba pada Game PR Ade yang pada artikel sebelumnya sudah di porting ke facebook web player dengan beberapa penyesuaian seperti kapan game harus inisialisasi dengan facebook atau saat kapan Leaderboard ini muncul. Pluginnya mudah difahami, sehingga kita bisa dengan bebas melakukan kustomisasi agar sesuai dengan yang kita inginkan.

Plugin tersebut adalah Unity 3D Social Leaderboard buatan developer App42 yang membutuhkan service Online Score yang telah disediakan App42 Cloud sebagai database score. Jadi selain kita membutuhkan App ID dari Facebook, kita juga membutuhkan API Key dari App42. Service tersebut tersedia dalam plan free dan berbayar, tapi Anda gak perlu khawatir akun free yang disediakan App42 juga terbilang cukup untuk game kelas indie dengan 1 juta kali Api Call dalam sebulan.

ddKemudian bagaimana caranya kita menambahkan Leaderboard tersebut pada game yang akan di porting menjadi game Facebook tersebut, berikut langkah-langkahnya :

1. Buat app facebook yang nantinya akan menjadi halaman aplikasi untuk game kita. Download official SDK facebook untuk Unity dengan versi paling baru, kemudian integrasikan dengan game kita. Silahkan ikuti langkahnya pada artikel gue sebelumnya tentang Porting Game Unity ke Facebook App Lewat DropBox.

2. Buat akun di App42 Cloud, pastikan akun tersebut sudah diferivikasi melalui email.

3. Silahkan lakukan Login pada laman tadi, kemudian Anda akan diarahkan untuk membuat sebuah App baru, ikuti langkah tersebut. Atau bisa dengan memilih pilihan Create App button.

4. Isi form yang telah disediakan, bila telah selesai maka Anda akan mendapatkan Api Key dan Secret Key untuk Aplikasi Anda.

5. Untuk membuat game service baru, masuk pada menu Business Service Manager di dasboard app yang berada pada sebelah kiri halaman, pilih Game service  pada menu game kemudian pilih Add Game, seperti gambar berikut

6. Download contoh Aplikasi yang telah disediakan oleh App42 berikut, kemudian extract dan buka project tersebut lewat Unity.

7. Pada folder Example anda akan menemukan file dengan nama AppConstant.cs , edit beberapa line pada script tersebut dengan App Key dan Secret Key yang telah didapatkan tadi lewat App42 Cloud.

Ubah value pada variable API_KEY, SECRET_KEY, dan GameName.

8. Run project tersebut dan login dengan facebook Anda, bila berhasil maka akan tampilannya seperti berikut :

9. Untuk menyimpan Score, isikan angka pada textfield kemudian submit score, bila berhasil maka akan muncul pada Leaderboard.

SOLVING ERRORS :

Pada beberapa Unity mungkin akan mengalami error, beberapa kali gue juga mengalami hal yang serupa. Request gue beberapa kali ditolak facebook dengan alasan Credential Fail atau user token error. Error tersebut diakibatkan karena facebook SDK dan App42 SDK pada project tersebut adalah SDK yang lama, sehingga perlu diperbaharui. Maka yang gue lakukan adalah meng-update App42 SDK nya dan mengimplentasikannya langsung pada game, bukan pada sample project dari App42. Berikut langkah-langkahnya :

1. Buka project game yang akan kita porting ke Facebook dengan asumsi Anda sudah memasukan APP ID pada facebook setting di Unity Anda dengan SDK yang paling baru.

2. Download App42 SDK Unity terbaru pada laman berikut, kemudian import file App42_Unity3D_SDK_2.8.dll pada folder asset kita.

3. Buka kembali folder sample app yang telah kita download tadi pada step pertama. Buka direktori example, pada folder Script copy semua filenya kemudian paste-kan di direktori yang serupa pada project game kita. Pada bagian ini Anda akan ditanya apakah akan replace file InteractiveConsole.cs , pilih yes.

4. Buka kembali project Anda. Pada scene yang Anda ingin tampilkan score, buatlah game object baru kemudian tambahkan komponen script InteractiveConsole.cs yang telah kita copy tadi.

5. Run game Anda, kemudian akan muncul popup facebook canvas yang mengharuskan kita memasukan User Token, pilih find user token kemudian Anda akan dinavigasi ke halaman dimana Anda dapat menemukan User Token. Copy semua code User Token, paste-kan pada popup canvas tadi kemudian klik Login. Ternyata hal ini yang membuat kita tidak bisa melakukan login pada sample app. Pada sample App kita tidak ditanyai untuk menginput user token, sehingga credential-nya gagal. Ini disebabkan pada sample app facebook SDK nya masih menggunakan versi lama, yaitu versi 3, sedangkan pada project game sudah menggunakan versi 5. Begitupun App42 SDK-nya.

6. Jika berhasil Anda bisa menginput score dan menampilkannya pada leaderboard. Namun pada awal-awal Anda akan mendapatkan error pada Unity Console bahwa tidak ada score tersedia dan indikator hanya akan menampilkan Loading Data. Jangan khawatir, itu karena dalam database belum tersedia data. Silahkan submit score untuk melihat berhasil atau tidaknya data tersimpan. Jika berhasil Anda akan menemukan data-data score pada halaman Score Board di Dasboard App42 cloud Anda seperti berikut :

Bagaimana, cukup mudah bukan ? Langkah selanjutnya adalah membongkar code untuk melakukan penyesuaian sesuai kebutuhan kita. Semoga membantu 🙂


 

Related Posts:

3 thoughts on “Unity 3D : Facebook Online Score Board

  1. […] tidak ada perubahan yang signifikan antara versi facebook dan mobile (Android), hanya penambahan Scoreboard yang menampilkan score sesama teman facebook yang memainkan game PR Ade […]

  2. desain UI dari score boar nya bisa diubah di app 42 juga?

Leave a Reply to Hendra Permana Cancel reply

Your email address will not be published. Required fields are marked *