YomoraOS es uno de mis primeros proyectos personales en el mundo del desarrollo web. Nació como una idea sencilla: explorar cómo sería construir un sistema operativo directamente en el navegador, con ventanas, aplicaciones básicas y una experiencia de escritorio accesible desde cualquier dispositivo.

Lo que empezó como un experimento terminó convirtiéndose en un proyecto clave para mi aprendizaje, especialmente en arquitectura front-end, manejo de estados, organización de vistas y diseño de interfaces.

¿Qué me motivó a crearlo?

Siempre me llamó la atención cómo funcionan los sistemas operativos por dentro: cómo abren ventanas, cómo manejan aplicaciones y cómo organizan la interacción con el usuario.
Quise replicar esa experiencia, pero usando únicamente tecnologías web, para aprender:

• cómo estructurar un entorno complejo desde cero,

• cómo crear componentes reutilizables,

• cómo resolver problemas reales de interacción,

• y cómo lograr que todo funcione sin recargar la página.

YomoraOS se convirtió en el laboratorio perfecto para experimentar.

Tecnologías utilizadas

• HTML5 para la estructura principal

• CSS3 (diseño adaptable, animaciones y estilos de ventanas)

• JavaScript puro para toda la lógica del sistema

  • administración de ventanas

  • eventos

  • render dinámico

  • manejo de aplicaciones internas

Sin frameworks, sin librerías: todo escrito a mano para aprender desde lo más esencial.

¿Qué hace exactamente YomoraOS?

✔ Un escritorio web interactivo

Con íconos, barra de herramientas y un sistema básico de ventanas.

✔ Aplicaciones esenciales

Incluye apps simples como:

• Notas

• Navegador interno

• Calculadora

• Explorador de archivos (simulado)

✔ Manejo de ventanas en tiempo real

Mover, cerrar, abrir varias apps, superponer ventanas… todo desarrollado manualmente.

✔ Experimento en UX y diseño

El sistema permite ver el contraste entre dos etapas del proyecto:

Evolución del proyecto

Primera versión: enfoque en funcionalidad

La versión inicial se centra en el funcionamiento general:

• ventanas dinámicas

• apps básicas

• interacción fluida

• estructura modular

El diseño era simple, minimalista y con pocos efectos visuales. El objetivo era hacer que el sistema funcionara, no que fuera bonito.

Segunda versión: diseño + funcionalidad avanzada

La siguiente etapa se enfocó en mejorar:

• la estética (inspiración en Windows 11 y sistemas modernos)

• la experiencia de usuario

• las animaciones

• la organización interna del código

• el rendimiento general

Se añadieron elementos visuales más atractivos, sombras, transparencias y una interfaz más profesional.

Lo que aprendí con este proyecto

• Cómo estructurar interfaces complejas sin frameworks

• Manejo avanzado de eventos y estados en JavaScript

• Diseño modular y escalabilidad

• Organización de un “ecosistema” con apps internas

• UX aplicado a escritorio web

• Cómo mejorar un proyecto iterando sobre él con nuevas ideas

Este proyecto marcó un antes y un después en mi forma de programar, ya que me obligó a pensar como un arquitecto de software y no solo como un desarrollador web.