flipnote.js

A JavaScript library for parsing, converting, and in-browser playback of the proprietary animation formats used by Nintendo's Flipnote Studio and Flipnote Studio 3D apps. | flipnote.js.org

Features | Background | Get Started | Web Components | API | Special Thanks

Looking for an online Flipnote player and converter? Check out Flipnote Player!

Features

• Full file parser implementations for animations from both Flipnote Studio and Flipnote Studio 3D, with a consistent API for dealing with metadata, thumbnails, frames, audio, signatures, and more
• High emphasis on accuracy, with reverse-engineered code being referenced as much as possible; frame rendering and audio mixing/interpolation are identical to console output
• Realtime browser-based playback for frames and audio, with a player API based on the HTML5 Video and Audio APIs
• Optional web component for easily embedding a Flipnote player UI on any web page
• WebGL renderer with crisp pixel scaling (using sharp-bilinear filtering), with a HTML5 canvas fallback
• Supports Flipnote Studio 3D's layer depth feature with stereoscopic rendering.
• Built-in GIF and WAV converters
• Works in web browser and NodeJS environments
• Exports full Typescript types
• Surprisingly small once minified & gzipped

Status

🔆 I consider this library to be feature complete - notwithstanding a new Flipnote Studio release, of course!

It's been a fun pet project so I may return to do some tweaks, implement support for interesting web features as they come, etc, etc. Please also understand that I consider Flipnote encoding to be beyond the scope of what I set out to accomplish (making Flipnote content viewable outside of the original apps) and as such I will not be implementing it here.

Background

Released in 2009, Flipnote Studio is an application for the Nintendo DSi console which allows users to create flipbook-style animations with the console's touch screen, cameras and microphone. In 2013 it recieved a sequel on the Nintendo 3DS called Flipnote Studio 3D, which expanded upon the original's feature set and added the ability to use 3D depth.

Flipnote Studio has had quite a legacy. The British animation studio Aardman created several original shorts for it, it's been used to create multiple music videos, and a user even spent 4 years creating a full 30-minute anime primarily animated in Flipnote Studio 3D.

Even though it has been several years since the last Flipnote Studio installment was released (and the online services for both apps have since been retired) there is still a notable community of people actively creating Flipnotes, thanks mostly to fan-built services such as Sudomemo and Kaeru Gallery. There's even several high-profile artists such as Kéké who are rocking their Flipnote Studio creations on social media!

Why this library exists

Nintendo created proprietary file formats for storing user-created Flipnote animations; Flipnote Studio uses .ppm (not to be confused with the Netpbm format of the same extension) and Flipnote Studio 3D uses .kwz respectively. While they may seem superficially similar, the two formats are quite different internally.

At the time of writing, the only official software that can load and play these animations are the original Flipnote Studio apps themselves, which are now rather hard to obtain due to the Nintendo DSi Shop closing down in 2016, and Flipnote Studio 3D having a limited release outside of Japan (not to mention the now shaky future of the 3DS eShop). For various reasons we also think it's unlikely that Nintendo is going to produce a new entry in the series.

This library hopes to aid in the long-term preservation and enjoyment of these animations by enabling them to be played in any modern web browser. In addition, it provides a consistent API and various utilities for dealing with both animation formats so that other developers can easily create their own tools and applications around them!

Projects using flipnote.js

• Flipnote Archive - an archive of Flipnote animations posted to Flipnote Hatena before its closure in 2013
• Flipnote Player - web-based browser, player and converter for Flipnote animations
• Kaeru Gallery - fan-made replacement online service for Flipnote Studio 3D
• IPGFlip - (in hiatus) fan-made replacement online service for Flipnote Studio

---

🐸