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 metadata, frames, audio, signature verification, and more
• 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
• Built-in GIF and WAV converters
• Works in web browser and NodeJS environments
• Exports full Typescript types
• 24kb minified & gzipped

Status

I consider this library more-or-less feature complete at this stage (notwithstanding a new Flipnote Studio release, of course!). There are a still couple of small things to pick at however:

• The Flipnote signature verification API doesn't work in Node. This should be an easy fix.
• Letterboxing so that the player aspect ratio doesn't have to be strictly 3:4. This would also lead into a fullscreen mode for the player UI.

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, Kaeru Gallery, IPGFlip. 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.

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. It also seems particularly unlikely that Nintendo is going to produce a new entry in the series any time soon.

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
• flipnote-video - command line tool for converting Flipnotes to video
• IPGFlip - fan-made replacement online service for Flipnote Studio