Jika Anda bermain kubus untuk waktu yang lama , mereka berubah menjadi bola
Melihat nama game Lines 9753, Anda mungkin berpikir bahwa cerita ini adalah tentang klon 9753 dari game Color Lines yang terkenal, di mana Anda perlu membuat 5 bola dalam satu baris dengan warna yang sama. Ya, itu adalah tiruan. Nah, apa lagi yang bisa jadi baru? Saya akan membagikan ide-ide saya dan beberapa seluk beluk implementasi dalam HTML + CSS + JavaScript. Saya akan memberi tahu Anda apa arti angka-angka 9753. Saya akan mengusulkan cara untuk menemukan kombinasi angka lainnya dan melihat bagaimana permainan berubah. Ini akan menjadi lebih menarik atau membosankan - Anda yang memutuskan. Sudahkah Anda menebak apa artinya 9753? Lalu, tolong, di bawah kucing.
Berbagai pilihan permainan
Pernah bertanya-tanya di mana dalam game aslinya datang dimensi bidang 9x9? Sungguh menakjubkan betapa baiknya tidak hanya dimensi permainan yang dipilih, tetapi juga parameter lainnya, sehingga menarik untuk dimainkan: jumlah warna adalah 7, jumlah bola berturut-turut adalah 5 dan jumlah bola yang muncul per giliran adalah 3. 4 parameter ini dimasukkan dalam nama permainan - Lines 9753 Empat inilah yang, pada umumnya, menentukan kompleksitas permainan, yang kemungkinan besar tidak cocok untuk semua orang.Mungkin seseorang akan menyukai set yang berbeda. Contohnya:- 3333 - kesendirian seperti solitaire, Anda tidak bisa takut untuk menemui jalan buntu dan mencoba merobohkan bola sebanyak mungkin dalam satu waktu (5 masih mudah, 6 lebih sulit, 7 dan 8 hampir tidak realistis), cocok dalam kasus ketika Anda tidak ingin berpikir sama sekali;
- 5643 - pada papan 5x5, sel tidak sekecil 9x9, jadi nyaman untuk bermain di telepon, tetapi kesulitannya tampaknya sedikit lebih tinggi daripada di 9753;
- 5543 adalah pilihan yang sedikit lebih mudah daripada 5643, karena jumlah warna yang berbeda lebih sedikit, yang berarti lebih mungkin untuk membuat serangkaian bola dengan warna yang sama;
- 4443 - sebanding dalam kerumitan dengan 5643, tetapi bola bahkan lebih besar - hanya 4 bola di sisi pendek layar.
Saya pikir semua orang akan menemukan opsi permainan yang cocok untuk diri mereka sendiri. Jangan terputus dari jaringan dan bersama-sama kita akan dapat melihat opsi paling populer di tabel di situs.Mundur
Diijinkan untuk bergerak kembali. Suatu ketika, ketika pohon-pohon itu tinggi, dan saya masih mahasiswa, saya harus bermain Color Lines. Saya sangat menyukai permainan ini. Suatu kali, setelah kehilangan setengah hari di dalamnya, dan setelah mencetak beberapa ribu poin, saya terhenti. Kesadaran datang bahwa itu adalah suatu kecelakaan, bahwa bola-bola itu jatuh dengan sukses, dan bahwa dalam waktu dekat aku tidak bisa melangkah sejauh ini. Untuk memecahkan rekor saya sendiri, saya harus membunuh sepuluh kali lebih banyak, dan kemudian jika saya beruntung. Sejak itu, saya belum memainkan game ini untuk waktu yang lama. Perasaan ketidakadilan universal ada dalam jiwaku. Dan itu duduk di sana sampai rencana berbahaya balas dendam mengkristal - untuk membuat permainan yang sama, tetapi dengan kemampuan untuk mundur bergerak kembali setidaknya ke awal. Pilihan ini telah menjadi alasan utama bagi saya untuk menulis permainan dengan cara saya sendiri.Memperbaiki keacakan
Beberapa pemain mengatakan bahwa kadang-kadang mobil dengan sengaja menempatkan bola di tempat yang tidak nyaman untuk menyulitkan perjalanan. Terutama ketika ada sangat sedikit sel bebas yang tersisa, tidak mungkin untuk menunggu bola yang tepat di tempat yang tepat. Dengan kata lain, keacakan dalam game jauh dari acak. Dengan peluang baru untuk memundurkan gerakan mundur, tidak logis untuk menawarkan setiap kali tempat baru untuk bola baru. Jadi akan mungkin untuk bolak-balik sampai bola yang tepat muncul di tempat yang tepat. Oleh karena itu, dalam permainan semua gerakan mesin ditentukan dan bergantung secara acak pada jumlah gerakan dan lokasi bola di lapangan. Apalagi semua orang memainkan game yang sama. Artinya, permainan dimulai dengan pengaturan yang sama (langkah pertama mobil), dan kemudian gerakan mobil tergantung pada bagaimana pemain berjalan: jika para pemain pergi dengan cara yang sama,kemudian di lapangan mereka akan memiliki susunan bola yang sama. Ini memungkinkan Anda untuk secara objektif dan terlepas dari kesempatan untuk membandingkan solusi yang berbeda. Beberapa orang suka mengukur siapa yang berikutnya, siapa yang lebih cepat ... Keputusan dalam bentuk urutan gerakan pemain dikirim ke server. Pergerakan mobil dihitung berdasarkan algoritma acak yang sama. Server tidak bisa diakali, seluruh urutan diperiksa untuk kebenaran, dan hanya kemudian hasilnya dimasukkan ke dalam tabel. Semua catatan disimpan bersama dengan urutan gerakan pemain. Kemudian kami menganalisis dan menerbitkan keputusan terbaik dari mereka yang mendapat skor 9999 poin. Penting untuk menghasilkan kriteria apa untuk memilih yang terbaik.Pergerakan mobil dihitung berdasarkan algoritma acak yang sama. Server tidak bisa diakali, seluruh urutan diperiksa untuk kebenaran, dan hanya kemudian hasilnya dimasukkan ke dalam tabel. Semua catatan disimpan bersama dengan urutan gerakan pemain. Kemudian kami menganalisis dan menerbitkan keputusan terbaik dari mereka yang mendapat skor 9999 poin. Penting untuk menghasilkan kriteria apa untuk memilih yang terbaik.Pergerakan mobil dihitung berdasarkan algoritma acak yang sama. Server tidak bisa diakali, seluruh urutan diperiksa untuk kebenaran, dan hanya kemudian hasilnya dimasukkan ke dalam tabel. Semua catatan disimpan bersama dengan urutan gerakan pemain. Kemudian kami menganalisis dan menerbitkan keputusan terbaik dari mereka yang mendapat skor 9999 poin. Penting untuk menghasilkan kriteria apa untuk memilih yang terbaik.
cepat
Posisi dan warna bola-bola berikut ditunjukkan. Karena kenyataan bahwa permainan dapat diputar ulang maju dan mundur, tidak masuk akal untuk menyembunyikan langkah selanjutnya. Itu dapat ditunjukkan beberapa gerakan ke depan, tetapi itu tidak terjadi pada antarmuka yang sederhana (perlu diingat bahwa gerakan mobil berubah jika sel ditempati sebagai akibat dari tindakan pemain).Mencetak gol
Penilaian dilakukan sesuai dengan rumus klasik N * (1 + N - DIMENSI), di mana N adalah jumlah bola dalam garis, DIMENSI adalah dimensi dari lapangan permainan. Yaitu, 5, 6, 7, 8 bola yang dikumpulkan bersama masing-masing memberikan 5, 12, 21 dan 32 poin. Untuk opsi game 3333, ketika 3, 4, 5, dan 6 bola jatuh, 3, 8, 15, 24 diperoleh.Seni grafis
Grafiknya hanya vektor - saya tidak suka mengubah skala artefak, terutama batas fuzzy. Elemen grafis animasi utama: tape recorder vintage dan bola memantul dengan highlight dan pencahayaan gradien. Mereka dibuat menggunakan CSS dan dibumbui dengan potongan JavaScript. Awalnya, skema warna gelap dibuat. Anda dapat mencobanya dengan menyalakannya di pengaturan. Namun, semuanya terlihat suram. Saya lebih suka yang ringan.Bola tiga dimensi
Paradoksikal seperti yang terdengar, tetapi dari 3 persegi panjang bersarang satu sama lain, bola tiga dimensi diperoleh:- wadah menentukan ukuran dan posisi di layar
- bujur sangkar, menciptakan bentuk dua dimensi, berkontraksi dan meregang saat memantul
- kotak dengan gradien elips yang menentukan warna dan pencahayaan bola, menambahkan dimensi ketiga.
Dengan wadah, semuanya sederhana. CSS atributnya posisi, kiri dan atas menentukan koordinat bola di lapangan, dan ukuran font menentukan ukuran relatif di mana dua kotak lainnya diskalakan. Kotak bulat, seperti sebagian besar putaran, di halaman web kami, hanya kotak dengan sudut paling bulat. Ketika kita klik di atasnya dengan mouse, itu akan rata, meremas dari atas dan memperluas sisi. Dan jika klik ternyata secepat mouse klik, maka bola mulai memantul.
@keyframes flat {
0% {height: 1.0em; width: 1.0em; top: 0; left: 0em;}
100% {height: 0.9em; width: 1.05em; top: 0.1em; left: -0.025em;}
}
@keyframes jumping {
0% {height: 0.9em; width: 1.025em; top: 0.1em; left: -0.0125em;}
10% {height: 1.02em; width: 1.0em; top: -0.02em; left: 0em;}
40% {height: 1.008em; width: 1.0em; top: -0.18em; left: 0em;}
50% {height: 1.01em; width: 1.0em; top: -0.2em; left: 0em;}
60% {height: 1.0em; width: 1.0em; top: -0.18em; left: 0em;}
70% {height: 1.0em; width: 1.0em; top: -0.1em; left: 0em;}
90% {height: 1.0em; width: 1.0em; top: 0em; left: 0em;}
100% {height: 0.9em; width: 1.025em; top: 0.1em; left: -0.0125em;}
}
Jumlah warna maksimum adalah 15.Tidak semua warna memiliki gradien yang cukup halus bahkan pada monitor yang bagus, jadi saya memilih warna untuk mata. Semakin banyak warna, semakin sulit untuk membedakan bola dengan warna di lapangan. Sepertinya 15 warna sudah cukup.Melawan
Rahasia utama konter adalah dalam rekaman dengan angka. Setiap pita disembunyikan di dalam persegi panjang yang hanya menampilkan satu digit. Tepi persegi panjang ini sedikit gelap untuk membuat efek pembulatan, seolah-olah di dalamnya tidak ada kaset, tetapi disk. Kecepatan animasi gulir sebanding dengan kenaikan penghitung yang tersisa dan dibatasi oleh beberapa nilai wajar. Digit terakhir berputar 1 detik.Suara
Suara (ledakan dan lompatan) adalah sintetis. Mereka dihasilkan oleh rumus matematika yang tidak rumit. Ini menciptakan beberapa aftertaste tahun 80-an ketika sebagian besar suara dalam game dihasilkan menggunakan generator frekuensi tunggal. Kelebihannya meliputi kekompakan program: generator sederhana dari efek suara seperti itu, yang ditulis dalam JavaScript, jauh lebih kecil daripada file mp3. Untuk setiap bola, pilih pasangan Anda sendiri dari lowFreq dan highFreq notes (lihat wikipedia ) dan isi buffer audio seperti ini: var soundUpBuffer = audioCtx.createBuffer(1, frameCount, sampleRate);
for (var i = 0; i < frameCount; i++) {
var x = i / frameCount;
var time = duration * x;
var volume = Math.sin(x * Math.PI);
var freq = lowFreq + Math.sqrt(x) * (highFreq - lowFreq);
buffer[i] = volume * Math.sin(2 * Math.PI * freq * time);
}
Di sini frekuensi berubah dari lowFreq ke highFreq di sepanjang kurva x ½ , dan volume sin ((x).Pada ledakan, volume meluruh sesuai dengan rumus 1 / (1 + 10 * x + 1000 * x * x), dan frekuensi dipilih secara acak dari oktaf pertama ke kelima.Ukuran kotak dialog adaptif
Menerapkan algoritme untuk memilih ukuran kotak dialog sehingga memakan ruang sebanyak mungkin dan tidak melampaui batas area yang terlihat. Masalahnya adalah bahwa pada perangkat yang berbeda ukuran dialog berbeda - kadang-kadang ternyata terlalu kecil, dan kadang-kadang tidak masuk ke layar. Saya membuat ukuran dialog tergantung pada ukuran font (unit CSS em). Selanjutnya, saya memilah-milah ukuran font sehingga dialog memakan waktu tidak lebih dari 95% dari dimensi layar. Jadi saya tidak perlu membuat kasus untuk CSS adaptif.Ukuran program kecil
Seluruh gim ini muat dalam satu file html sekitar 150Kb. Sekitar 3000 baris kode sumber (tentu saja, tanpa sisi server). Tidak ada pustaka dan kerangka JavaScript yang digunakan - semuanya alami, seperti pada Zaman Batu. Terkadang Anda hanya tidak ingin berurusan dengan API pihak ketiga, dan kadang-kadang berguna untuk memahami seberapa banyak kerangka kerja yang menyederhanakan kehidupan seorang penemu sepeda dan tester rake baru. Berguna untuk pertama kali memunculkan sendiri cara menerapkan gagasan ini atau itu, dan baru kemudian membandingkannya dengan cara orang lain melakukannya. Sebagai contoh, versi untuk Android hanya membutuhkan 250Kb. Ini terdiri dari bungkus WebView tipis dan paket png-shek untuk resolusi telepon yang berbeda. Ngomong-ngomong, png-shki dapat diganti dengan satu vektor xml-koy. Itu akan muncul tepat dalam semangat minimalis.Forum
Forum ini berjalan di phpBB . Akun ini memungkinkan Anda untuk:- simpan prestasi Anda di server agar tidak hilang saat mengganti ponsel atau komputer Anda
- bermain secara bergantian di satu perangkat, lalu di yang lain
- tinggalkan pesan dan ajukan pertanyaan ke pemain atau pengembang lain.
i18n dan l10n
Internasionalisasi dan lokalisasi. Permainan telah diterjemahkan ke dalam bahasa Rusia dan Inggris. Hanya 35 frasa pendek. Saya tidak akan menolak bantuan gratis dalam menerjemahkan ke beberapa bahasa yang lebih populer (Cina, Jerman, ...).Tanpa iklan
Anda dapat sering mendengar pendapat bahwa jika program ini gratis dan tanpa iklan, itu berarti trojan, backdoor, virus ... Dengan kata lain, keju gratis hanya dalam perangkap tikus. Kalau tidak, mengapa? Mengapa seseorang rela melakukan sesuatu untuk orang lain secara gratis? Saya tidak tahu jawaban umum. Tidak hanya itu, saya tidak tahu persis mengapa saya melakukannya sendiri. Saya hanya penasaran. Jika Anda menyukai sesuatu, maka saya sering bertanya-tanya bagaimana penulisnya berhasil. Saya ingin mencoba melakukan hal yang sama atau bahkan lebih baik. Terkadang saya menyukai semuanya, dengan pengecualian beberapa detail, dan ada keinginan untuk melakukan sesuatu seperti ini, tetapi dengan blackjack dan ujung jari saya.Kesimpulan
Itu saja untuk saat ini. Saya harap Anda menikmati permainan sebanyak saya tertarik untuk membuatnya. Saya akan senang dengan komentar apa pun.Referensi