An .oim is a normal PNG that carries layers, text in several languages, animations and a digital signature. It is an interactive image that stays a single file. Here is how it works, and why the file does not need a server to say what it says.
Almost every image on the web is mute. A PNG stores pixels, and everything else lives elsewhere: the text in the HTML, the translations on another server, the animations in a script, and the proof of who made it nowhere at all.
OIM starts from the opposite idea: an image should carry everything it needs to be itself.
A file, not a system
A .oim is a normal PNG. Any viewer opens it. But inside it carries the whole piece: layers, text in every language, animations and interactions. Copy it and you copy all of it.
An ordinary image viewer shows only the base layer, without the interactive text. To see the texts, the languages and the buttons you need the <oim-player> element, which is covered in the "How to start" section. What the file stores does not change; what changes is which program reads it.
If our server is gone in ten years, the base image will still open in any viewer. What happens to the interactive part depends on whether someone keeps serving the player. If the player script does not load, the reader still sees the base image.
A simple example: a café poster
Imagine the poster of a café. The photo of the coffee is the base layer and never changes. The title and the price are text layers, each with its Spanish and English version. The "See the menu" button is an interactive layer: when someone presses it, the image tells the web page, and the page decides what to do.
When the price of the coffee changes, you fix the text layer. The photo is not touched and not exported again.
Languages inside, not beside
Text in an OIM piece is not translated by rendering another image. Each layer stores its content in all its languages, and the player shows the reader's. One piece, as many languages as needed.
The language is set with the lang attribute on the element. If the page changes language, a call to setLang() switches the text at once, without reloading the image.
The signature as trust
Every .oim is signed with ECDSA. The signature covers the data and the image: if someone alters the file, the player notices and refuses to show it. We do not ask you to trust us; you can check.
An image that cannot prove where it came from is an image anyone can rewrite.
The signature has its own article, with the protocol details: digital signature for images: how to verify authorship. For now it is enough to know that the signature exists and is checked in the reader's browser.
No phoning home
The player draws in your browser. No domain list, no trackers, no request to our servers each time someone looks at the image. The only request it can make is for a public key it does not have yet. It loads no external fonts: the fonts a piece uses travel inside the file. What you see is what the file contains.
What comes next
This blog is also a test bench: the image above is a real .oim, made through our MCP connector and published as is. We will use this section to show how pieces like this are built, step by step. If you want to see how a piece changes with the language, read multilingual images: one PNG for ten languages.
Why it matters
An image that carries its own content does not depend on a page explaining it well. If someone forwards the file by email, the message still has the layers, the texts in their languages and the signature. If the same image is published on three sites, it is the same file on all three. There are no three copies to keep in step, because there are no copies to align. The same goes for a poster, a chart or a screenshot: the piece travels with what it says. That also means thinking of each piece as one complete file, not as an image with notes beside it.
How to start
- Load the player script from the CDN in your page head:
<script src="https://cdn.oim.media/player/v1/oim-player.js"></script>
- Declare the image with the
<oim-player>element and the language you want to show:
<oim-player src="my-poster.oim.png" lang="en" mode="full"></oim-player>
- If the file lives on another server, check that the server allows your origin (CORS). The full guide is in the quick start.
Frequently asked questions
Can a .oim be opened like any PNG?
Yes. Any viewer shows the base image. Interactive text, languages and animations appear only with the player.
Do I need to code to use an OIM image?
Not to display it. You only need code if you want the page to react to a click: the player fires an oim:action event that your code can listen to.
What happens if someone edits the file?
If the file is altered, the signature no longer matches and the player does not show the image. The details are in digital signature for images: how to verify authorship.