Tutorial membuat Web Design menggunakan Dreamweaver CS6

Tutorial membuat Web Design menggunakan Dreamweaver CS6

Pada postingan ini saya akan meberitahu cara membuat web design menggunakan dreamweaver. Disini web design saya berhubungan dengan game yang saya buat dengan rekan saya Rahmad H untuk memenuhi tugas mata kuliah Web Application. 

berikut langkah-langkahnya...

1. Buka aplikasi Dreamweaver CS6

2. Pilih Create New > HTML

3. Ubah title web sesuai yang ingin anda buat. Disini saya memberi nama Candlelight Pocong

4. Save project dengan nama Index atau nama lainnya sesuai keinginan anda. lalu save.

5. Pilih File > New, untuk membuat halaman baru.

6. Pada Blank Space > pada kolom Page Type > pilih CSS > klik Create.

7. Beri nama CSS sesuai dengan keinginan anda. disini saya beri nama style.css

8. Berikut adalah format untuk membuat background.

9. Hubungkan antara HTML dengan CSS seperti pada gambar berikut.

10. Tambahkan script berikut ini untuk membuat menu bar pada bagian atas.

11. lalu buka CSS dan tambahkan seperti digambar dibawah ini untuk pengaturan menu bar tadi.

12. Pada menu bagian kiri diisi dengan icon play untuk memulai game yang saya buat.

13. Untuk mengaturnya, ketik script dibawah ini di CSS.

14. Tambahkan untuk pembuatan menu bagian tengah, masih di CSS.

15. Berikut adalah script untuk menu tengah.

16. Untuk menampilkan slideshow, aturlah pada CSS terlebih dahulu dengan script seperti berikut.

17. Lalu untuk menampilkan slideshow pada halaman web, menggunakan script dibawah ini

18. Ketik script dibawah ini untuk menu bagian kanan.

19. script berikut untuk mengaturnya di CSS.

20. Beri background untuk menu bar atas.

21. Rapihkan tampilkan sesuai dengan konten isi web anda.

22. Untuk pengaturannya lakukan di CSS dengan script berikut.

23. Atur bagian Footer dengan script dibawah ini.

24. untuk menampilkan footer yang sudah diatur tadi, tambahkan seperti gambar dibawah ini pada html

25. Berikut ini adalah tampilan web design sementara untuk kelompok saya.

26. selanjutnya ini script untuk menampilkan menu info saat diklik.

27. ini script unutk menampilkan menu character saat diklik.

28. ini script untuk menampilkan info salah satu karakter saat diklik.

29. lalu ini script untuk menampilkan info karakter lain ketika diklik.

30. ini script untuk menampilkan news saat diklik.

31. dan ini script untuk menampilkan Developer info saat diklik.

note : semua size gambar sudah disesuaikan dengan ukuran pada web.

Jadi sampai untuk sementara samapai sini progres web design yang sudah kami buat.. untuk kelanjutannya akan segera menyusul.. Terimakasihh :)))

Read More →

Progres Game "Candlelight Pocong"

 Progres Game "Candlelight Pocong"

Pada postingan kali ini saya akan menampilkan progres game yang saya dan rekan saya Rahmad Hidyat buat, dengan nama "Candlelight Pocong". Game ini merupakan sebuah game platform sederhana. Pada game ini, pocong berpetualang ke berbagai kota untuk mencari lilin yang berguna untuk menerangin kuburannya. Teknik/cara-cara pembuatan game ini sudah saya jelaskan pada postingan "How to Make a Game" di sebelumnya. Berikut adalah tampilan level 1 yang sudah kami buat...

finish untuk level 1 !!! saat pocong melewati batu nisan secara otomatis akan lompat ke level selanjutnya, untuk level 2 coming soon... ditunggu ya.... Terimakasiih:)))

Read More →

How to Make a Game (Menambahkan Score)

Cara Menambahkan Score pada Game menggunakan Construct 2

Berikut adalah langkah-langkahnya..
1. Buka project yang sudah dibuat sebelumnya, yaitu project pada postingan How to Make a Game (Menambahkan Touching Control). klik disini untuk melihat.

2. klik kanan pada layer > insert new object > pilih sprite > lalu open file > pilih gambar untuk dijadikan coin (saya memilih gambar lilin) pastikan gambar dalam format .png > resize ukuran gambar menjadi 15x21. 
3. lalu perbanyak lilin (coin) dengan mengcopy-paste.
4. lalu klik kanan pada layer > edit event sheet
5. klik add event > pilih sprite2 > next

6. lalu pilih on collision with another object > next > pilih object (click to choose) > pilih candle > ok > lalu done.

7. klik add action > pilih candle > next > pilih destroy > done.

8. kembali ke halaman layout awal, klik kanan > insert new object > pilih Text Box namai dengan totalCandle > insert.

9. pastikan text box totalCandle berada pada layer HUD.

10. klik kanan > edit event sheet
11. klik kanan pada event sheet > Add global variable

12. beri nama global variable dengan nama totalCandle2 > ok
13. klik add action > pilih system > next > pilih add to > next > ubah variable ke totalCandle2 > value = 1 > done.

14. selanjutnya add event > pilih system > next > pilih every tick > done

15. lalu add action > pilih totalCandle > next > set text > edit text menjadi totalCandle2 > done.

16. lalu Run App

 

Read More →