This post is about the Pet Pikachu app shown at my site below:
This “Pet Pikachu” was originally an app I made for the Tidbyt device in June-July 2022. The Tidbyt is marketed as a “retro-style display”, which kinda looks like a Lite-Brite. Its resolution is 64x32.
The Pet Pikachu app was based on this 1998 Tamagotchi-like Pokémon Pikachu toy:
I was able to recreate almost all of the animations using helpful Youtube videos, great Pokémon documentation from Serebii, and random photos of the original packaging and marketing material I found online (like the one below).
The first step was to scrub through this Youtube video, which had all of the animations, and recreate them one pixel at a time in Aseprite. In all, I made 205 frames for a total of 37 animations. There were some animations not included for reasons I cannot remember, but likely due to not being able to find a reliable source animation.
Then, each frame of the animations was exported and converted to Base64, so they could be read by the Tidbyt. The Tidbyt’s developer platform was released in February 2022, soon after I got the device. Using the Tidbyt developer docs and the helpful people at their official Discord channel, I built out the app. It was developed using a Python-like language called Starlark. Using its Pixlet tool, you could preview the app in a browser as you developed it (like below) and also push the live code to your physical Tidbyt device.
How the app works
First, the user installs the app through the Tidbyt app on their phone, which adds it to their physical Tidbyt device. They can find these apps in the Tidbyt “store” (all the apps are free to install so it’s not really a store).
If the user gives their Tidbyt permission to access their location, then the Pet Pikachu app will base Pikachu’s animation on the user’s time and date. Once the time and day are determined, the app gets the correct animation via a huge conditional statement that first checks the hour, and then occasionally checks the day of the week.
Once the correct animation is called, the corresponding array is used to correctly display the animation. Below is an example of the READ animation. The frame order is defined, along with the width and height of the frames, their positioning on the screen, and the amount of time between each frame in milliseconds.
# Animations list: [[frames], width, height, xPosition, yPosition, frameMilliseconds]
READ = [[READ_1, READ_2, READ_1, READ_2, READ_1, READ_2, READ_3, READ_3, READ_3], 32, 15, 5, 12, 750]
READ = [[READ_1, READ_2, READ_1, READ_2, READ_1, READ_2, READ_3, READ_3, READ_3], 32, 15, 5, 12, 750]
I think that’s about it! The app was launched in the Tidbyt “store” on July 20, 2022. By August 12th, it was already #54 on the most installed apps list. I haven’t seen any updated lists since, but have gotten some nice comments on the Tidbyt Discord channel about it!
I have converted the app to HTML/JS at the top of the page and it should work as it does in the Tidbyt. Why am I writing about this now, 3 years later? It’s probably one of the things I’m most proud of developing over the years. The pixel art recreation was fun and so was learning a new coding language. But the main reason I’m writing about this now is that I’m worried the Tidbyt will eventually be lost and forgotten and I don’t want my apps to go with it. Maybe one day I’ll convert and write about the other 2 apps I made - Burger of the Day (inspired by the Bob’s Burgers burger board), and Death Valley Thermometer (inspired by the actual thermometer signs in Death Valley).