Logiczna gra z owockami

Mój w założeniu miesięczny projekt przeciągnął się do pół roku, a do zrobienia zostało mi jeszcze dużo. Główne mechaniki są już sfinalizowane i zrobiłem już setki poziomów, więc dzielę się grą ze Światem, bo naprawdę jest w co pograć.

Chciałem zrobić od podstaw zupełnie nową grę logiczną, z mechaniką jakiej jeszcze nigdy nie spotkałem. Łatwo skopiować czyjąś sprawdzoną i szeroko przyjętą mechanikę i zrobić dzięki temu w miarę grywalną gierkę. Moje podejście było jednak odmienne. Wziąłem koncepcję, którą wszyscy znają i zaprojektowałem do niej własne zasady, które są nie tylko ciekawe, ale też pozwalają na utworzenie całego spektrum poziomów trudności. W swojej grze mam poziomy bardzo proste i podstawowe, poprzez średniej trudności, na trudnych i bardzo trudnych kończąc. Plansza gry wypełniona jest owocami, które trzeba zbić, ale zbija się je w nietypowy sposób.

Klikasz na owocka i w ten sposób zaznaczasz go. Następnie klikasz na drugiego takiego samego owocka, który znajduje się w tej samej linii. Może to być ta sama kolumna, wiersz albo przekątna. Po kliknięciu drugiego owocka, te dwa owocki, oraz wszystkie pomiędzy nimi, znikają.

Na poniższym przykładzie zaznaczam kokosa w prawym górnym rogu.

Następnie, po kliknięciu na dolnego prawego kokosa – wisienki, kokos oraz banan znajdujące się pomiędzy dwoma wybranymi przeze mnie kokosami zostają zbite razem z nimi.

Można zbijać owoce na różne sposoby, w różnej kolejności i różnie dobierać pary owoców, przez co powstaje multum możliwości. Proste plansze można przejść na wiele różnych sposobów. W trudniejszych planszach trzeba więcej pomyśleć, bo losowe klikanie może szybko doprowadzić nas do sytuacji, w której na planszy zostaną nam owoce nie do zbicia. Żeby przejść poziom i otrzymać trzy gwiazdki, trzeba zbić wszystkie owoce.

W grę jak na razie grało około 80 osób i odzew od nich był naprawdę pozytywny, więc zachęcam do zagrania 🙂 Można zagrać na komputerze, tablecie czy telefonie. Jest to gra na przeglądarkę. Podczas jej tworzenia używałem przeglądarki Chrome i wiem, że gra działa dobrze zarówno na komputerowej wersji Chrome jak i na mobilnej na Androidzie.

Zagraj pod adresem:

owocki.tymski.pl

 

 

All Play Game Jam

Poznańska Gildia Graczy oraz Koło Naukowe Pyra to główni organizatorzy Game Jamu „All Play”, który odbył się w Poznaniu 02-05/grudnia/2016. Gry wykonane na tym game jamie, z założenia przystosowane są dla jak największego grona odbiorców. Gry są dostępne dla graczy niepełnosprawnych dzięki zastosowaniu na przykład alternatywnych kontrolerów takich jak Eye Trackery śledzące wzrok gracza, albo dodatkowe większe przyciski podłączane do portu USB. Gry wykorzystują palety barwne odpowiednie dla osób ze ślepotą barwną, bądź komplementują barwy symbolami, aby gracze mogli bez przeszkód rozróżnić szczegóły plansz rozgrywki. Niektórzy developerzy całkowicie zrezygnowali z obrazu, na rzecz gier głosowych, a inni na nowo przemyśleli sterowanie swoich gier, aby większa liczba osób mogła czerpać przyjemność z ich dzieł.

W mojej grze można ćwiczyć śledzenie ruchu, reagowanie na pojawiające się koła, trafianie w nieporuszające się albo ruchome obiekty. Zasady gry można zmienić podczas trwania rozgrywki. Można zmieniać dynamikę kół, albo metodę ich zbijania.

Koło i powiększony wskaźnik

Zwiększenie dostępności mojej gry:

  • Sterowanie w grze może odbywać się za pomocą jednej ręki.
  • Elementy interaktywne wyróżniają się od tła przez co są lepiej widoczne dla osób ze słabszym wzrokiem.
  • Łatwo zmienić wielkość wskaźnika.
  • Elementy gry są duże, aby ułatwić graczowi interakcje.
  • Umiejętność rozróżniania kolorów w grze nie jest istotna dla rozgrywki.
  • Ilość elementów na polu gry można dostosować indywidualnie dla każdego gracza.
  • Dźwięki nie stanowią istotnego elementu rozgrywki, ale mogą być pomocne dla osób z wadami wzroku.

Sterowanie i kontrola:

Do klikania w kółka, możesz używać myszy, tabletu graficznego lub palca w przypadku ekranów dotykowych.

Z powodu ograniczonego czasu implementacji, nie udało mi się stworzyć interfejsu graficznego, przez co do zmiany parametrów i zasad gry trzeba używać skrótów klawiaturowych.

  • ] – zwiększ rozmiar wskaźnika
  • [ – zmniejsz rozmiar wskaźnika
  • c – rozpocznij challenge
  • spacja – dodaj nowe koło do pola gry (maksymalnie 50)
  • 1 – nowe koła będą pływać po planszy
  • 2 – nowe koła będą spadać z góry
  • 3 – dotknięcie koła powiększa wskaźnik
  • Enter – nie trzeba klikać
  • z – włącza tryb klikania na kółka (jedno kliknięcie działa maksymalnie na jedno koło)(działa w trybie gry 1 i 2)
  • x – wyłącza powyższy tryb
  • m – wycisza dźwięki
  • F11 – (skrót przeglądarki) włącza tryb pełnoekranowy
  • F5 – (skrót przeglądarki) odświeża przeglądarkę całkowicie resetując wszelkie ustawienia
  • e, c – zacznij wyzwanie z łatwiejszymi ustawieniami
  • h, c – zacznij wyzwanie z trudniejszymi ustawieniami

kliknij aby zagrać

Plansza gry "klikanie kółek"

Linki zewnętrzne:

PGG JAM: ALL PLAY

Fraktale

Dywan Sierpińskiego możemy skonstruować przez podzielenie kwadratu na dziewięć mniejszych, a następnie usunięcie centralnego z nich. W ten sposób otrzymaliśmy pierwszy poziom aproksymacji dywanu Sierpińskiego. Kolejnym poziom można osiągnąć przez powtórzenie powyższej procedury dla każdego z ośmiu pozostałych kwadratów.

Po nieskończonej ilości kroków dla każdego z kwadratów, otrzymamy dwuwymiarowy fraktal zwany dywanem Sierpińskiego. Można się zastanowić, jak wyglądałaby jego trójwymiarowa wersja. Jak się okazuje, nie jest ona zbyt widowiskowa. Sześcian dzielimy na 27 mniejszych i usuwamy środkowy z nich. Z zewnątrz wygląda to więc jak zwykły sześcian. Nie chcę tu wchodzić w kolejne kroki konstrukcji a wolę opisać jak dla mnie ciekawszą figurę trójwymiarową.

Gąbkę Mengera w trzech wymiarach stworzymy przez podzielenie sześcianu na 27 sześcianów, ale usuwamy sześć sześcianów ze środka, o kształcie trójwymiarowego plusa. I procedurę powtarzamy dla każdego z podzielonych sześcianów, w nieskończoność. Poniżej grafika kostki w trzecim poziomie aproksymacji.

menger sponge lvl 3

Połączyłem gąbkę Mengera z dywanem Sierpińskiego na poniższej ilustracji. Każdą ścianę aproksymacji gąbki pokryłem teksturą aproksymacji dywanu.

Gąbka Mengera z dywanem Sierpińskiego

Obrazek ten możesz pobrać z mojego profilu na Pixabay.

Kolejną ciekawą rzeczą jest przekrój gąbki Mengera. Wyobraźmy sobie dwuwymiarowy ekran przecinający kostkę Mengera. Jeżeli przetniemy ją równolegle do powierzchni, możemy otrzymać dywan Sierpińskiego. Najciekawszy kształt otrzymamy jednak przy przekroju w poprzek, przez długą przekątną kostki. Efekt taki możesz zobaczyć w pierwszych 10 sekundach animacji:

Jump – gra przeglądarkowa

Screenshots from game jump by Tymon Oziemblewski

Jump – gra w której wcielamy się w małą skaczącą świnkę. Zbieramy różne bonusy napotkane na naszej  pełnej wrogów ścieżce. Staramy się wskoczyć jak najwyżej, jednak nie jest to łatwe, bo im wyżej się wdrapiesz, tym rozgrywka staje się trudniejsza.

Sterowanie:
Strzałki na boki albo klawisze: [A][D] – ruch w lewo i prawo.Strzałka w górę, klawisz [W] albo [spacja] – strzał ognistą kulą.

Bonusy:
• Duża strzałka: jeden ogromny skok.
• Mała strzałka: jeden duży skok.
• Dwie małe strzałki: dwa duże skoki jeden po drugim.
• +250: Dodatkowe dwieście pięćdziesiąt punktów.
• 2x: Podwaja wszystkie zdobywane punkty, np. zmienia +250 na +500.

Przeciwnicy:
• Smok – jeśli zderzysz się ze smokiem, odpycha Cię on z dużą siłą aby zepchnąć Cię z planszy.
• Pająk – przy zderzeniu z siecią zostajesz w nią złapany. Następnie pająk zatruwa Cię, zadając obrażenia periodyczne i powstrzymuje regenerację zdrowia na około 10 sekund.

Pokonywanie przeciwników:
Strzel kulą ognia do przeciwnika aby go usmażyć.
Smoka można zabić również skacząc mu na głowę.
Zabicie smoka: 50 punktów.
Zabicie pająka: 35 punktów.

Punkty życia:
• Masz 100 punktów życia, które regeneruje się powoli w przypadku gdy je stracisz.
• Spadnięcie zabiera 60pkt. życia,
• Uderzenie przez smoka zabiera 45pkt. życia,
• Trucizna zabiera 2,7pkt. zdrowia na sekundę i działa przez 10 sekund od momentu uwolnienia się z pajęczyny.

Mana:
Posiadasz 100 punktów many, która regeneruje się w tempie 6 pkt. na sekundę (3pkt/sek jeśli jesteś zatruty przez pająka).
Strzał kulą ognia kosztuje 35 pkt. many.

Kliknij tutaj aby zagrać.

Akrobata – animacja w Blenderze

Moja pierwsza animacja postaci wykonana w Blenderze. Czas pracy to 6 godzin.

Dwanaście zasad animacji

Tworzenie animacji ułatwiło mi stosowanie się do kilku z dwanastu zasad animacji Disneya.

Jako, że animacji nie rysowałem poklatkowo, a do tego moim celem było stworzenie bardzo krótkiej animacji, część zasad pominąłem.

Z użyciem Wikipedii, wolnej encyklopedii:

  • wyprzedzanie – stosowane, by przygotować odbiorcę na ruch. Każde działanie poprzedzone jest przygotowaniem do niego – np. tancerka, żeby podskoczyć najpierw musi zgiąć nogi, golfista, żeby uderzyć w piłeczkę najpierw musi wykonać zamach kijem. Zasada ta może być pominięta wtedy, gdy widz spodziewa się jakiegoś zachowania – wtedy uzyskamy komediowy efekt zaskoczenia.
  • inscenizacja – umieściłem postać po środku sceny i zrezygnowałem z tła i zdarzeń drugoplanowych, aby nie rozpraszać uwagi odbiorcy.
  • wykorzystanie klatek kluczowych – Metoda od pozy do pozy, polega na wykonaniu klatek kluczowych do ustawienia pozycji postaci. Program Blender sam wypełnia klatki pomiędzy kluczowymi.
  • rozpędzenie i zwolnienie – obiekty organiczne i większość przedmiotów potrzebuje czasu by rozpocząć ruch, lub się zatrzymać – trwa to tym dłużej, im większą masę, a więc i bezwładność ma dane ciało. Z tego powodu animacja wygląda bardziej realistycznie, jeśli zawiera więcej klatek przy początku i końcu ruchu niż w jego środku – kiedy jest najszybszy. Zasada odnosi się zarówno do obiektów w ruchu między dwoma ekstremalnie różnymi pozami (np. wstający człowiek), jak i do będących już w ruchu (np. szybkie machanie ręką).
  • łuki – w procesie animacji powinniśmy uwzględnić, że ruchy obiektów organicznych zazwyczaj odbywają się po trajektorii łuku. Podkreślenie tego aspektu w animacji powoduje zwiększenie poczucia realizmu.
  • taktowanie – odnosi się do czasu w pojęciu fizycznym i teatralnym. Czas ruchu musi odnosić się zarówno do praw fizyki, jak i do historii opowiadanej przez animację. Jeśli nie mamy do czynienia z przypadkiem szczególnym, zamierzonym przez twórcę w celu osiągnięcia odpowiedniego efektu, taktowanie jest poprawne wtedy, gdy obiekty pojawiają się zgodnie z prawami fizyki.
  • urok – coś, co w animacji odpowiada charyzmie aktora. Postać, która pojawia się na ekranie nie musi być sympatyczna – ważne jest, by odbiorca czuł, że postać jest prawdziwa i interesująca.

O wszystkich możesz przeczytać tu:
Wikipedia: Film_animowany ► 12_zasad_animacji
Wikipedia: 12_basic_principles_of_animation

Allegro.js

Czym jest Allegro.js?

Allegro.js to biblioteka JavaScript napisana przez Sosa Sosowskiego. Przepisał on stare, poczciwe Allegro4, aby można było go używać do pisania gier przeglądarkowych, kompatybilnych z HTML5. Nasze aplikacje zadziałają więc na komputerze, smartfonie i tablecie. Na stronie domowej biblioteki, możemy przeczytać, że allegro.js nie jest zorientowane obiektowo oraz że można używać go za darmo. Jest tam też dostępny tutorial.

Pong

Moja pierwsza gra w allegro.js to prosty Pong, inspirowany między innymi grą Jardinains. Poruszamy się paletką za pomocą strzałek i staramy się zdobyć jak najwięcej punktów odbijając spadające klocki. Im dłużej odbijamy konkretny klocek, tym więcej punktów on daje. Po kilku odbiciach dostajemy też bonus – poszerzenie paletki lub dodatkowe punkty.

Aby zagrać, kliknij w ten link.

Skrót implementacji

Implementacja używa zwykłych tablic, w których znajdują się struktury. Dla przykładu tablica klocki[] posiada pola: x, y, vx, vy, width, height zapamiętujące pozycję, prędkość i rozmiar każdego klocka. Dodatkowo w strukturze mam zmienne boolowskie(prawda albo fałsz), aby sprawdzić, czy klocek jest zbity.

Kolizje ze ścianami bocznymi: Jeśli klocek wyleciał za daleko, czyli jego pozycja w osi X, jest większa od szerokości ekranu lub jest mniejsza od zera, mnożę jego prędkość razy minus jeden, przez co klocek zawraca, gdy spotyka krawędź ekranu.

Kolizja klocka z paletką nie jest aż tak prosta. Musimy bowiem nadać klockowi pewną prędkość zależną od miejsca, w którym zderzył się z paletką. Im bliżej środka rakietki, tym mniejszy kąt odbicia (klocek.vx zależy od klocek.x-paletka.x).
Samo sprawdzenie czy kolizja wystąpiła, można przeprowadzić następująco:

 

Głeboki sen – co widzi algorytm Google do rozpoznawania obrazów?

DeapDream - Mandelbrot Set
Połączenie artystyczne zbioru Mandelbrota z algorytmem Deep Dream.

Rozpoznawanie obrazów przez komputery posunęło się w ostatnich latach  bardzo dużo do przodu. Bez problemu rozpoznają one obiekty codziennego użytku, ludzi, zwierzęta, pojazdy… To wszystko dzięki zaprogramowanemu modelowi połączeń neuronowych i odpowiednim algorytmom.

DeepDream, algorytm stworzony przez Google i udostępniony publicznie pozwala zwykłym ludziom tworzyć niesamowite obrazy. Aby działanie programu było widoczne dla człowieka, efekty wizualne wzmacnia się do absurdalnej mocy, co całkowicie zmienia postrzegany obraz.

Poniżej kilka obrazów: ja, pieseł, zbiór mandelbrota i spiderman. 😀
(Kliknij na zdjęcia aby je powiększyć)