Broadband Multimedia

3 Nov 2016

Posted by Unknown on 11.52 with 2 comments

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 :)))
Posted by Unknown on 10.21 with No comments

 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:)))

Popular Posts

Social Media

Welcome to Shavira's blog, I hope you enjoy my posts

Pages

Copyright © WebApps | Shav | Powered By Blogger | Published By Blogger Templates20
Design by Carolina Nymark | Blogger Theme by NewBloggerThemes.com