Cube Beat War

Cube Beat War allows players to cast the magical Kame Hame Ha with their hands. To do this, players must perform specific hand gestures, such as bringing their palms together and then opening them to generate magic, and pushing forward to cast it. The game includes a menu and a scoring system, and consists of eliminating colored cubes that appear randomly. The game uses a gesture detection library that allows players to interact with the menu using the finger pointing gesture, as if it were a laser pointer. The game ends when all the cubes are eliminated. The application uses the Oculus XR plugin and requires Unity 2021.2.5f1 and an Oculus Quest 2 to work.

View More

React Depth 3d Viewer

Pseudo 3D photo viewer from a depth layer for React using pixi.js.

In 3D computer graphics and computer vision, a depth map is an image or image channel that contains information relating to the distance of the surfaces of scene objects from a viewpoint. The depth map applied to a texture as a displacement filter can achieve a 3D effect, other implementations such as Facebook also allow interpolation of the non-visible areas of the texture when moving in 3D.

The pseudo 3D photo viewer for React uses the pixi.js library and the bit displacement technique from a depth layer to create a 3D effect on photos.

Pixi.js is a widely used JavaScript library in the development of 3D games and applications due to its ease of use and optimized performance. The bit displacement technique is used to apply a displacement filter to the photo’s texture, achieving a 3D effect from the information contained in the depth layer.

To apply the displacement filter to the texture, the pixi.js function filters.DisplacementFilter(depthMap, 0) is used. This function takes as parameters the depth map and a displacement on the Z axis, and applies the displacement effect to the texture. In addition, some implementations such as Facebook’s also allow interpolation of the non-visible areas of the texture when moving in 3D, increasing the realism of the pseudo 3D photo viewer.

In summary, the pseudo 3D photo viewer for React is a tool that uses the pixi.js library and the bit displacement technique to create a 3D effect on photos using a depth layer. Thanks to its ease of use and optimized performance, this tool is an excellent option for those who want to add a touch of realism to their photos.

Download on Github.

Seville, around 1870, Panorama

Conversion of the photos taken by Jean Laurent, the French photographer based in Spain who took 7 snapshots to form a great panorama of the river and its surroundings.

Description

High-resolution photos were coloured with different algorithms, then blended and processed, a believable sky was recreated and a false bottom fill was added to make it more integrated.

You can try it out at mappuzzle.xyz/sevilla360

Source code of the project at Github

MapPuzzle.xyz

MapPuzzle.xyz is a fun way to learn geography in a playful way. The game features a list of puzzle pieces on the left side of the screen, which can be countries, states, cities, or provinces, among others. Each piece is shown with a map illustration and when clicked, it follows the mouse and the player must find its match on the map. It also has a counter for found pieces, pieces to be found, and mistakes made. Players can choose the map they want to play and filter it by continent and region.

One of the interesting features of the game is that it allows players to translate the names of the puzzle pieces into different languages. This allows them to learn the names of the places in different languages, enriching their gaming experience and helping them develop their language skills.

In addition, every time a piece is placed on the map, players can access Wikipedia data about the place they are exploring. This allows them to obtain additional information about the geography, history, culture, and other areas related to the place, helping them learn more about the world around them.

In summary, the map puzzle game offers a complete and fun educational experience for all ages. Don’t miss out on trying it!

View More

@deck.gl/carto Demo

Test application of Deck.gl using React. The application has been divided into different components of React, communicating with each other. In the tool panel, the following modifications can be made on the map:

  • Change view (Show GeoJsonLayer)
  • Select the continent
  • Thickness of the line
  • Color scale height
  • Line colour
  • Colour of the polygon (the colour will be darker depending on the population level of the country)
  • Table with country information when you place the mouse over the polygon
  • Legend population and country count by Continent

Other features I have yet to explore:

  • Try some other ArcLayer, HexagonLayer, GridCellLayer components, etc
  • To be able to select the layers to be displayed and to zoom into the scope of each one.

Test app in http://aaranda.es/static/deckgl/

Download on Github.

localPrintService

This application allows you to select a printer and automatically print a PDF document through a web link. This tool is ideal for setting up a local service for receiving invoices or other periodic PDF documents. The application can be downloaded from my Github repository.

This application is developed in Visual Studio 2015 and uses Windows Forms and C# as a desktop application. This means that it runs on a local computer and does not require an internet connection to work. The user interface is designed using the XAML markup language and can be customized according to the user’s needs. In addition, the application is compatible with most printers on the market.

Some examples of useful applications for this application are:

  • In an office where electronic invoices are regularly received, the application can be configured to automatically print invoices received on a specific printer.

  • In a warehouse of a logistics company, the application can be used to automatically print shipping labels or delivery guides when a purchase order is received.

  • In a hospital or clinic, the application can be used to automatically print medical reports or prescriptions when a request is received from a doctor.

  • In a retail store, the application can be used to automatically print invoices or receipts when a purchase order is received.

Download on Github.

 

ConsoleToGUI

This script is used to generate a log file with all the information from the Unity Debug.Log console. It also includes the option to show a Textbox Log in the application UI.

Features:

  • Create log file in app path or local resources path
  • Verbose debugging with stack trace
  • Display in UI or silent mode

Other features:

  • FPSDisplay.cs for displaying framerate on the UI
  • FlyCamera.cs for simple WASD and mouse camera control for test scenes
  • Utils.cs some useful functions

To use this script, simply copy it to the assets folder and add it to any game object.

Download from my Github

Shader Man Selection for Unity 3D

I adapted from the ShaderMan project, a series of Shaders for Unity, although it is not 100% my creation, except some, are interpretations and conversions of shaders found in ShaderToy mostly.

Also the project includes some interesting shaders that are not my creation, and that I wanted to incorporate to the project for its later study.

You can find the source code in my GitHub