Cara membuat ubin isometrik miring (tinggi)

11

Ini mungkin paling baik dijelaskan secara gambar. Saya mencoba membuat game isometrik 2.5D. Visi saya adalah agar permainan terlihat seperti tujuan saya:

lanskap isometrik

Saya bukan seniman grafis, jadi saya mengalami masalah saat membuat ubin "miring" untuk mensimulasikan medan dengan ketinggian berbeda. Membuat ubin isometrik dasar mudah menggunakan langkah-langkah berikut:

  1. Buat ubin versi 64x64 persegi
  2. Putar 45 derajat
  3. Skala ketinggian turun dengan faktor 2

Membuat ubin "miring" lebih merupakan tantangan. Yang saya miliki saya punya Photoshop, tapi saya jauh dari ahli dalam menggunakannya. Inilah masalah saya saat ini:

masukkan deskripsi gambar di sini

Saya tidak yakin bagaimana saya bisa memanipulasi simpul, kalau tidak ini akan mudah, tetapi pada dasarnya, untuk mendapatkan ubin "miring" dari ubin isometrik dasar saya, yang perlu saya lakukan adalah menggeser bagian bawah dan simpul kanan ke bawah sebesar 16 piksel , sambil memperbaiki dua simpul lainnya. Ini akan menghasilkan ubin yang saya inginkan.

Apa cara mudah untuk mencapai ini. Apakah Photoshop alat yang tepat untuk ini? Ada saran?

tiles isometric Filip Jeremic
sumber
sistem grafis apa yang digunakan build Anda saat ini menggunakan directX, openGL, atau proprietary untuk engine? jawaban dasar akan menyimpan vertex, dan kemudian memodifikasi vertex sesuai kebutuhan (Anda dapat melakukan ini sebagai array dari 8 vektor), tetapi cara Anda mengirimkannya ke layar biasanya dengan utilitas grafik / perpustakaan seperti directX, openGL
gardian06
Saya menggunakan SFML untuk membuat sprite ke layar, jadi itu akan menjadi openGL. Saya menyimpan sprite sebagai 64x64 ubin pada disk.
Filip Jeremic
@FilipJeremic, Hmm .. Apakah ini game neopets?
Pacerier

Jawaban:

3

Anda dapat membuat ubin jika Anda mau - menggunakan Photoshop atau yang lainnya. Saya akan merekomendasikan program menggambar vektor, bukan program menggambar pixel (saya tidak cukup tahu tentang Photoshop dll, untuk mengetahui apa yang disediakannya saat ini).

Secara pribadi saya sarankan Anda tidak repot-repot membuat ubin, alih-alih memiliki permainan yang benar-benar menggambar mereka menggunakan API menggambar Anda, itu akan menjadi jauh lebih mudah (terutama jika Anda menyadari berapa banyak ubin miring yang Anda butuhkan).

MarkR
sumber
Tidak yakin saya setuju dengan memiliki ubin render permainan untuk Anda kecuali mesin / kerangka kerja Anda akan membiarkan Anda dengan mudah melakukan ini (dalam 2D)
John McDonald
3

Pertahankan gambar persegi 64x64 sebagai sumber, untuk mendapatkan versi miring, pertama-tama Anda akan memiringkan gambar di sisi kanan (untuk mencocokkan contoh gambar Anda), lalu putar 45 derajat dan turunkan ketinggiannya. Hasilnya adalah kemiringan yang Anda cari (dengan sedikit trial-and-error untuk berapa banyak condong).

Melihat semua langkah (mengubah bayangan, skewing, memutar, penskalaan) selain membuat kuadrat awal cukup sederhana, Anda mungkin ingin melihat ke dalam melakukan langkah-langkah ini dengan openGL baik dalam memulai permainan Anda, atau sebagai langkah otomatis dalam pembuatan proses (cukup buat program kecil yang dapat melakukan semua skewing / rotasi yang Anda butuhkan dan tambahkan ke skrip build).

Menggunakan grafik vektor mungkin merupakan ide jika Anda ingin melanjutkan secara manual membuat setiap ubin miring. Photoshop memiliki dukungan untuk lapisan vektor sehingga Anda tidak perlu mempelajari program baru untuk mencoba ini.

Daniel Carlsson
sumber
Mengapa Anda menggunakan Photoshop, bukan Fireworks dan lain-lain?
Pacerier
@Pacerier Saya tidak, pertanyaan asli menyebutkan photoshop. Saya pribadi mulai menggunakan Krita baru-baru ini, sebelum itu Paint.net (yang saya masih gunakan untuk pekerjaan yang lebih cepat).
Daniel Carlsson