Desain antarmuka untuk game, menggambar paket ikon

Halo semuanya!

Saya Mikhail Kravchenko, perancang antarmuka game.

Artikel ini adalah tentang cara menggambar paket ikon untuk permainan. Di bawah ini Anda melihat hasilnya.



Kami memperbaiki persyaratan untuk hasilnya


Jadi tugas tentang konten ini melayang ke kami. Dalam permainan, sebuah acara dimulai - invasi ras alien di planet kita. Kami akan mengalahkan penjajah, berbagai objek akan keluar dari mereka, dan benda-benda ini perlu ditarik.

Pertama-tama, perlu merumuskan dan memperbaiki persyaratan untuk hasilnya, ini adalah dasar dari pekerjaan kami. Memiliki persyaratan seperti itu di depan mata kita, dengan peluang yang lebih kecil kita tidak akan menarik apa yang dibutuhkan, kita akan memiliki lebih banyak saling pengertian dengan pelanggan dan tim, dan juga akan ada sesuatu untuk memeriksa hasil kerja kita dengan.

Daftar persyaratan harus dikompilasi berdasarkan deskripsi masalah dan ide Anda sendiri tentang cara mengatasi masalah ini. Selanjutnya, Anda harus pergi ke pelanggan dengan daftar ini dan memastikan bahwa kami memahami tugas dengan cara yang sama. Mungkin daftarnya perlu diperbaiki. Sebagai hasilnya, kami memperoleh daftar persyaratan untuk hasilnya.

Berikut adalah contoh daftar tersebut:

  • Item harus serupa dengan item serupa lainnya dari intrusi masa lalu;
  • Akan ada 5 jenis barang - cincin, gelang, bros, liontin dan batu;
  • Setiap jenis barang akan memiliki tiga derajat kelangkaan. Semakin jarang objek, semakin banyak kekuatan yang diberikannya;
  • Tingkat kelangkaan barang tersebut entah bagaimana harus ditunjukkan secara visual;
  • Selain langka, batu memiliki 4 warna - biru, merah, kuning dan hijau;
  • Barang-barang keluar dari tentara pasukan penjajah, oleh karena itu, mereka harus memiliki sifat dan warna yang khas dari lawan-lawan ini;
  • Gambar diperlukan dalam format Tga, ukuran - 128x128 piksel.

Kami telah memutuskan persyaratan, sekarang Anda dapat mulai bekerja dengan referensi.

Referensi


Temukan benda-benda yang telah dilukis untuk acara semacam itu. Kita perlu menggambar ke arah yang sama, dan benda-benda ini akan membantu kita untuk tidak menyimpang dari jalan yang benar.



Selain itu, kita harus mempelajari tentara dari pasukan penjajah. Barang-barang kami harus memiliki beberapa fitur umum dengannya, jadi ada baiknya mengumpulkan lebih banyak gambar dengan penjajah dan membangun desain berdasarkan padanya.



Lawan berbeda dalam kekuatan mereka - ada yang biasa, sedang dan kuat. Anda dapat mendorong dari ini. Misalnya, untuk menggunakan bagian dari lawan yang lemah dalam desain objek biasa, dan bagian dari lawan yang kuat dalam desain lebih jarang.



Palet


Kita perlu menggambar banyak ikon dalam satu gaya, itu akan jauh lebih nyaman untuk bekerja jika kita membuat satu palet dan itu. proses pengecatan untuk semua item. Jika kami tidak membuat palet, tetapi memilih warna dengan pipet dari referensi, kemungkinan besar benda akan menimbulkan korosi dalam warna.

Kami memilih referensi untuk warna dari objek yang sudah ada dalam game. Lawan kami adalah ras tanaman, jadi warna hijau sangat cocok. Dan sebagai warna kedua, Anda bisa mengambil emas. Di bawah ini Anda melihat gambar dengan referensi.



Sekarang Anda perlu mengumpulkan warna dari referensi dan menjadikannya palet. Ambil warna utama, dia
Letaknya kira-kira di tengah antara area terang dan gelap subjek, warna untuk tempat terang dan gelap, warna untuk sorotan dan terutama tempat gelap. Dan juga warna untuk refleks dari lingkungan. Ternyata dua set warna, satu untuk bagian emas, dan yang kedua untuk hijau.



Persiapan selesai, kami lanjutkan ke garis besar.

Garis besar


Dalam prosesnya, kami akan mencoba opsi yang berbeda untuk desain objek, dan ketika kami mendapatkan hasil yang memuaskan kami, kami akan mengoordinasinya dengan pelanggan. Keinginan dan saran akan datang dari pelanggan, beberapa di antaranya akan membantu kami meningkatkan hasilnya, kami akan mendiskusikan dan menolak yang lain. Beberapa hal dalam desain kami tidak akan sepenuhnya cocok dan sejumlah poin perlu diperbaiki atau dibuat ulang.

Poin penting
Jika kami segera melakukan pekerjaan dalam kualitas akhir, itu akan memakan banyak waktu. Maka kita sangat mungkin diminta untuk memperbaiki atau mengubah sesuatu, dan tentu saja tidak akan berhasil melakukan ini dengan mudah dan cepat. Kemungkinan besar Anda perlu menghabiskan banyak waktu dan upaya lagi.

Karena itu, pertama-tama kita membuat sketsa. Sketsa itu membutuhkan sedikit waktu dan usaha, sementara itu memungkinkan untuk menguraikan secara umum apa hasil akhirnya. Itu berarti kita dapat dengan cepat dan murah melewati beberapa opsi desain, dan jika mereka meminta kita untuk memperbaiki sesuatu, tidak akan ada masalah dengan itu juga.



Sketsa dimulai dengan sebuah lineart. Lebih baik mengambil sikat bundar dengan parameter Opacity dan Flow di wilayah 30%, yang bervariasi tergantung pada gaya yang menekan pena. Di depan mata kita, kita memegang bagian-bagian dari lawan yang telah kita pilih untuk menunjukkan kelangkaan benda, serta gambar perhiasan yang sudah ada dalam permainan. Kami mencari bentuk yang cocok untuk objek, dalam proses pencarian seperti itu, Anda dapat melalui beberapa opsi, di bawah ini Anda melihat contoh pencarian seperti itu.



Jika beberapa elemen dalam desain Anda diulang, masuk akal untuk membungkusnya dengan benda-benda pintar. Mungkin seiring waktu Anda ingin mengubah sesuatu di dalamnya, dan mengoreksi satu objek pintar jauh lebih mudah daripada melewati semua tempat di mana elemen tersebut digunakan.



Dan sekarang lineart untuk semua objek sudah siap. Anda dapat melanjutkan melukis. Kami menempatkan palet dan gambar benda referensi untuk bunga secara jelas.

Pertama, Anda perlu mewarnai satu item untuk memastikan bahwa palet saat ini memungkinkan Anda untuk mencapai hasil yang diinginkan. Dan dapatkan sampel, berdasarkan mana kita bisa mewarnai semua benda lain.

Anda tidak dapat menggambar pola seperti itu dalam satu lapisan karena dalam kasus ini kami tidak akan dapat melukis objek lain dengan cara yang sama. Oleh karena itu, kami menambahkan setiap warna dari palet dalam lapisan terpisah untuk memiliki proses pengecatan di depan mata kami dan dapat mengulanginya ketika kami melukis objek lain.



Sangat mungkin bahwa hasil yang akan kita dapatkan tidak akan sesuai dengan kita dan akan perlu untuk sedikit mengubah warna agar lebih cocok. Adalah baik bahwa setiap warna terletak pada lapisan terpisah dan Anda dapat mengedit warna apa pun secara terpisah dari yang lainnya. Jika kita mengubah warna objek sampel, kita tidak boleh lupa untuk memperbaiki warna yang sama pada palet.

Ini adalah contoh untuk lukisan siap, itu sangat cocok untuk kami dan Anda juga bisa mengecat semua item lainnya.



Kami membuat topeng dalam bentuk semua objek agar tidak merayap di tepinya, membuat grup terpisah untuk bagian emas dan hijau dari objek, dan membuat konten grup ini sama seperti pada objek sampel. Berikut ini menunjukkan proses melukis satu item.



Kami juga memiliki masalah batu dan mereka memiliki warna yang berbeda - biru, kuning, hijau dan biru. Untuk mendapatkan hasil yang diinginkan, cukup gambar satu set batu, buat tiga salinannya, letakkan layer dengan mode blending Color di atasnya, dan cat inti batu dalam warna yang kita butuhkan. Anda juga dapat meletakkan layer dengan Overlay overlay di atas layer dengan mode Color dan bereksperimen dengan melukis di dalamnya, menggambar di layer tersebut meningkatkan kontras gambar dan saturasi warna.



Di sini kami memiliki sketsa siap untuk semua objek dan Anda dapat melanjutkan ke tahap berikutnya - persetujuan desain dengan pelanggan dan kolega.



Persetujuan desain


Sebelum menunjukkan sketsa kepada pelanggan, Anda perlu tempat untuk memperbaiki jalur yang digunakan untuk mengambil keputusan ini dan menunjukkannya bersama sketsa tersebut. Ketika jalur ini terlihat oleh pelanggan dan kolega, banyak pertanyaan hilang dengan sendirinya, dan kami menghabiskan lebih sedikit waktu untuk penjelasan. Figma, atau layanan online serupa lainnya, sangat cocok untuk menghadirkan jalur seperti itu.

Kami menunjukkan sketsa itu kepada pelanggan. Kemungkinan dia akan meminta untuk memperbaiki beberapa poin, kami akan siap untuk ini. Ketika kami setuju dengan pelanggan, kami perlu menunjukkan hasilnya kepada kolega dan meminta mereka untuk membagikan pendapat mereka tentang hasilnya. Ini layak dilakukan karena beberapa alasan.

Pertama, rekan kerja dapat memperhatikan hal-hal yang tidak kita perhatikan. Sebagai contoh, saya pernah menggambar simbol untuk kelas baru dan cocok dengan deskripsi tugas dengan baik, tetapi kemudian seorang rekan melihat simbol itu dan mengatakan bahwa simbol satu-satu mirip dengan logo layanan Target Mei dan karena ini terlihat agak aneh. Saya googled logo ini, dan ternyata ikon saya sangat mirip dengannya.

Kedua, kolega mungkin mengalami asosiasi yang tidak menyenangkan, atau aneh dengan subjek. Dan jika asosiasi semacam itu muncul dalam satu orang, mereka mungkin akan muncul pada para pemain, dan sama sekali tidak menguntungkan bagi kita untuk memancing emosi negatif di dalamnya.

Ketiga, seseorang mungkin ingat bahwa kita sudah memiliki objek serupa dalam permainan, dan jika Anda menambahkan yang lain hampir sama, itu akan membingungkan pemain.

Artinya, memeriksa hasilnya dengan bantuan rekan kerja membantu kita menghindari beberapa kesalahan, atau setidaknya mengurangi kemungkinan terjadinya mereka.

Contoh bekerja dengan umpan balik dari rekan kerja


Berikut ini adalah contoh bekerja dengan komentar kolega.

Komentar 01
Bentuk batu hampir sama dengan ras invasi lain.

Kami melihat semua batu dan melihat bahwa ras yang berbeda memiliki batu dengan bentuk yang berbeda, dan batu kami benar-benar mirip dengan bentuk batu dari ras lain.



Kami mengubah bentuk batu.



Komentar 02
Bentuk inti batu ini memberikan asosiasi dengan beberapa jenis tumor yang menyakitkan, yang membuat benda itu tidak menarik.

Jika asosiasi semacam itu muncul dalam satu orang, dapat diasumsikan bahwa orang lain akan muncul. Sesuatu yang lain perlu diciptakan.



Komentar 03
Hal ini diperlukan untuk memperbaiki inti dari batu tengah - itu mirip dengan batu setan.

Kita melihat batu-batu dari ras iblis, kita melihat bahwa batu-batu itu sangat berbeda dan versi saat ini cocok, dan penulis komentarnya salah.



Komentar 04
Ada proposal untuk meningkatkan bagian tengah batu, tergantung pada kelangkaannya.

Kedengarannya logis, mari kita coba.



Ternyata cukup baik, biarkan saja seperti itu.

Komentar 05
Bros terlalu banyak seperti bagian atas cincin. MB mereka membutuhkan beberapa jenis media atau bentuk lainnya.

Bandingkan item.



Tampaknya itu benar-benar dapat membingungkan seseorang, kami mengubah bentuk bagian hijau.



Komentar 06
Sekarang bros berbeda dari cincin, tetapi mulai terlihat seperti jimat. Anda dapat meningkatkan perbedaan mereka.

Bandingkan benda, perkuat perbedaannya, membuat bagian emas lebih masif.



Poin penting
Untuk mengedit sketsa lebih cepat, Anda dapat menyalin grup dengan mereka dan menciutkannya menjadi satu layer, hotkey - Ctrl + E. Buat perubahan di layer yang dihasilkan, dan salinan grup dari mereka. proses melukis untuk ditabung untuk nanti. Ini akan dibutuhkan ketika Anda perlu menggambar objek dalam kualitas akhir.

Dan jadi kami menyetujui garis besar objek - semua orang setuju dengan segalanya dan kami dapat melanjutkan ke rendering objek final.



Rendering yang Baik


Hal terpenting pada tahap ini adalah mengamati satu teknologi. proses menggambar untuk setiap item. Dalam hal ini, semua objek akan digambar dengan cara yang sama dan tidak ada yang akan tersingkir dari gaya umum. Untuk mempercepat proses, Anda dapat menggambar dalam vektor, pada skala 100% dari yang dibutuhkan. Untuk menampilkan formulir utama dengan pena, lalu membuat layer di atasnya, ubah menjadi Kliping dan lukis di atas area yang diinginkan dengan sikat lembut. Hotkey pada Clipping Mask - Ctrl + Alt + G. Gambar di bawah ini menunjukkan proses melukis bagian dari subjek.



Ini semua barang yang sudah siap dan bisa ditunjukkan kepada pelanggan dan tim.



Kemungkinan besar akan ada minimum keinginan dan komentar karena kami telah menyetujui semuanya pada tahap konsep.

Setelah barang disetujui, Anda harus menyimpannya dalam format yang benar. Saya sangat merekomendasikan menandai dokumen dengan alat Slice dan memberi nama untuk setiap sel. Dan kemudian menyimpan semua item sekaligus melalui fungsi Simpan untuk Web. Sangat nyaman.

Semoga artikel ini bermanfaat bagi Anda. Saya doakan semoga sukses dan sukses kreatif.

Source: https://habr.com/ru/post/id477562/


All Articles