This app is deployed here.
This project is inspired by VA-11 Hall-A, a game by Sukeban Games. This game is very stylish, and I wanted to share the uniqueness in a simple web app. Besides teaching myself React, there were a few hurdles to overcome in order to get a satisfactory experience.
- The app runs with a virtual canvas of 820x482. Most elements adhere to the pixel grid, with the goal to attempt to render the app in a pixel style. There are a few cases where this is broken or cheated:
- Fonts do not maintain a standard of conversion from their em height to pixels. More reading here. Fonts are scaled in the app to the best of my ability by sight, but still may appear blurry in some situations.
- Images utilize the
image-rendering: pixelated;css attribute. The Calicomp logo and drink pictures would appear markedly blurry without the css applied.
- Sounds play on a delay or not at all in the Safari browser. This is disheartening as a valuable use case of this app would be to be displayed as a kiosk full screen application on a tablet device. This seems to be by design, to save on bandwidth.