---
title: "Iso Miko"
url: "https://aigamehub.app/en/games/iso-miko-e11411"
source: "https://github.com/userJesus/iso-miko"
source_type: "github"
play_url: "https://userjesus.github.io/iso-miko/"
platform: "both"
login_required: false
pricing: "free"
origin: "original"
ai_tools: []
game_languages: ["pt"]
author: "userJesus"
author_handle: "userJesus"
category: "Adventure"
categories: ["adventure", "casual"]
tags: ["ai-generated", "browser-game", "isometric", "open-source", "sprite-animation", "three.js"]
added: "2026-10-23T02:47:39.576Z"
updated: "2026-10-23T02:47:47.616Z"
locale: "en"
content_locale: "en"
---

# Iso Miko

Ilha isométrica jogável no navegador: movimente uma personagem 2D em 8 direções por uma ilha pintada, com parar, andar, correr, deslizar e lançar bola de fogo.

## Description

Iso Miko é um projeto independente de estudo e experimentação: uma ilha pintada transformada em mapa jogável, com alturas, escadas, paredes e objetos que escondem a personagem quando ela passa por trás. O foco é a movimentação natural de uma personagem 2D em 8 direções (parar, andar, correr, deslizar e lançar bola de fogo), com animação dirigida pela distância e colisão. Na primeira visita, a personagem apresenta a ilha com voz e texto. Código, arte, animações, sons e vozes foram criados com Inteligência Artificial (spritesheets geradas por IA passam por um pipeline próprio em Node; o cenário parte de uma pintura ampliada com Real-ESRGAN). Feito com three.js, TypeScript e Vite, sob licença MIT.

## Original post

Ilha isométrica jogável no navegador, com personagem 2D em 8 direções. Código, arte, animações, sons e vozes criados com IA. three.js + TypeScript.

Topics: ai-generated, browser-game, game, gamedev, isometric, open-source, sprite-animation, threejs, typescript, vite, webgl

<p align="center"> <img src="docs/media/social-preview.jpg" alt="Iso Miko: ilha isométrica jogável no navegador" width="100%"> </p> <h1 align="center">Iso Miko</h1> <p align="center"> Uma ilha isométrica jogável no navegador, com personagem 2D em 8 direções.<br> Código, arte, animações, sons e vozes criados com Inteligência Artificial. </p> <p align="center"> <a href="https://userjesus.github.io/iso-miko/"><b>▶ Jogar no navegador</b></a> · <a href="#rodar-localmente">Rodar localmente</a> · <a href="docs/TECNICO.md">Documentação técnica</a> · <a href="https://www.linkedin.com/in/ojesus">LinkedIn do autor</a> </p> <p align="center"> <a href="https://github.com/userJesus/iso-miko/actions/workflows/deploy.yml"><img alt="Deploy no GitHub Pages" src="https://github.com/userJesus/iso-miko/actions/workflows/deploy.yml/badge.svg"></a> <a href="LICENSE"><img alt="Licença MIT" src="https://img.shields.io/badge/licen%C3%A7a-MIT-green"></a> <img alt="three.js" src="https://img.shields.io/badge/three.js-0.186-black"> <img alt="TypeScript" src="https://img.shields.io/badge/TypeScript-7-3178c6"> <img alt="Vite" src="https://img.shields.io/badge/Vite-8-646cff"> </p> <p align="center"> <img src="docs/media/gameplay.webp" alt="Gameplay: andar, correr, deslizar e lançar bola de fogo na praia da ilha" width="800"> </p> ## Sobre Iso Miko é um projeto independente, feito para estudo, experimentação e aprendizado. A ideia foi testar até onde dá para chegar construindo um jogo pequeno, mas caprichado, com IA em todas as etapas: a ilha pintada, a personagem e as animações dela, os efeitos, os sons, as falas e o código. O foco é a **movimentação natural de uma personagem 2D em 8 direções**: parar, andar, correr, deslizar e lançar bola de fogo. O cenário é uma **pintura isométrica transformada em mapa jogável**, com alturas, escadas, paredes e objetos que escondem a personagem quando ela passa por trás. | | | | --- | --- | | <img src="docs/media/presentation.jpg" alt="Apresentação inicial: a Iso Miko fala numa caixa de pergaminho"> | <img src="docs/media/island.jpg" alt="Visão aberta da ilha: torii, cerejeiras, cascata e praia"> | | **Apresentação inicial**: na primeira visita, a Iso Miko apresenta a ilha com voz e texto. | **A ilha**: praia, degraus de pedra, escadaria até o torii, cascata e mar animado. | ### Destaques - **Animação dirigida pela distância**: a cadência do passo acompanha a velocidade e os pés não patinam. O giro passa pelas direções intermediárias em vez de estalar. - **Pipeline de sprites**: as spritesheets geradas por IA chegam com escala variando, tremido e ciclos desalinhados. Ferramentas próprias em Node normalizam altura, alinham o tronco, detectam o ciclo do passo e montam os atlas. - **Cenário a partir de uma pintura**: a ilha é ampliada com rede neural (Real-ESRGAN), recortada e classificada pixel a pixel (areia, grama, pedra, água). Cada pixel ganha profundidade, para a personagem sumir atrás de árvores, rochas e do torii. - **Física**: colisão
