DEV Community: Lily

Rompiendo la cuarta pared en Ren'Py: El "Efecto Monika" y la Esfera Matemática (Parte 1)

Lily — Tue, 02 Jun 2026 03:48:29 +0000

¿Te acuerdas de la primera vez que jugaste Doki Doki Literature Club y Monika te llamó por tu nombre real? Ese escalofrío es el resultado de un truco de ingeniería genial. En esta primera entrega de nuestro Desafío de Construcción Extrema: Edición Ren'Py, vamos a crear una carpa mística donde nuestra adivina, Madame Zora, usará Python para calcular días de la semana y "hackear" el nombre del sistema operativo del jugador.

El Poder Matemático: Adivinar el Día de la Semana 🔮

Detrás de la magia del calendario hay un algoritmo clásico de la matemática (como el de Doomsday). En lugar de calcularlo a mano, usaremos la librería nativa datetime de Python dentro de Ren'Py para procesar cualquier fecha que el usuario ingrese por teclado.

El Truco de Monika: Leyendo el Sistema 🖥️

Los videojuegos corren sobre un sistema operativo que sabe exactamente quién inició sesión. Con las librerías os y getpass, podemos preguntarle a la computadora el nombre del usuario y guardarlo en una variable secreta.

El Código Base (Script.rpy) 📜

Copia y pega este código en tu proyecto de Ren'Py para ver la magia en acción:

init python:
    import datetime
    import getpass
    import os

    # Función para descifrar el día de la semana
    def calcular_dia(fecha_texto):
        try:
            fecha_objeto = datetime.datetime.strptime(fecha_texto, "%d/%m/%Y")
            numero_dia = fecha_objeto.weekday()
            dias_semana = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"]
            return dias_semana[numero_dia]
        except:
            return None # Si el usuario escribe texto inválido, no se rompe el juego

    # Función para obtener el usuario real de la PC
    def obtener_nombre_sistema():
        try:
            return getpass.getuser()
        except:
            return os.environ.get("USERNAME", "Viajero")

define adivina = Character("Madame Zora", color="#993399")

label start:
    scene bg_tienda_mistica
    $ nombre_real = obtener_nombre_sistema()

    adivina "Dime, alma viajera... ¿cómo te llamas en este plano?"
    $ nombre_juego = renpy.input("Introduce tu nombre:").strip()

    if not nombre_juego:
        $ nombre_juego = "Forastero"

    adivina "Bien, [nombre_juego]. Ahora dime una fecha importante en formato DD/MM/AAAA."

label pedir_fecha:
    $ fecha_ingresada = renpy.input("Fecha (ejemplo: 20/05/1995):").strip()
    $ resultado_dia = calcular_dia(fecha_ingresada)

    if resultado_dia is None:
        adivina "Las brumas están densas... Esa fecha no es válida. Inténtalo de nuevo."
        jump pedir_fecha

    adivina "¡La esfera brilla! El día [fecha_ingresada] fue un majestuoso **[resultado_dia]**."
    adivina "Pero mi esfera ve mucho más allá..."

    # Confrontando al jugador con el truco de Monika
    if nombre_juego.lower() == nombre_real.lower():
        adivina "Veo que eres honesto. Tu espíritu coincide con el nombre de tu máquina: **[nombre_real]**."
    else:
        adivina "Has intentado ocultarte bajo el nombre de '[nombre_juego]'..."
        adivina "¡Pero a la esfera no se le miente! Tu verdadero nombre en el mundo de metal es... **[nombre_real]**."

    return

Visita mi canal de Youtube para más explicación:

Ren'Py: ¡Deja de usar mil "if" para tus Sprites! (image vs. ConditionSwitch)

Lily — Thu, 14 May 2026 04:46:22 +0000

Hola a todos. En el proceso de desarrollo de mi visual novel, "Desafío Extremo de Construcción: Edición Ren'Py", me encontré con un problema común: mi código se estaba llenando de condicionales cada vez que quería mostrar a un personaje con una expresión diferente según las decisiones del jugador.

Hoy les comparto cómo pasé de un código manual y propenso a errores a uno dinámico y elegante.

1. El método manual: La sentencia image
Normalmente, definimos una imagen de forma estática. Es sencillo y directo:

Fragmento de código:

image lolo_feliz = "images/lolo/lolo_base_feliz.png"

El problema: Si Lolo (nuestro pragmático constructor) cambia de ánimo basado en una variable, terminamos escribiendo esto en cada parte de la historia:

Fragmento de código:

if puntos_felicidad > 10:
    show lolo_feliz
else:
    show lolo_serio

Esto funciona, pero si tienes 50 escenas, ¡son 50 bloques de código que mantener!.

2. La solución Pro: ConditionSwitch
Aquí es donde aplicamos un verdadero "makeover" al código. ConditionSwitch permite que una sola etiqueta de imagen cambie su contenido automáticamente según el estado de tus variables.

El código elegante:
Fragmento de código:

image lolo = ConditionSwitch(
    "puntos_felicidad > 10", "images/lolo/lolo_base_feliz.png",
    "True", "images/lolo/lolo_base_serio.png" # El "True" actúa como un 'else'
)

¿Por qué es mejor?

1. Automatización: Solo escribes show lolo. Ren'Py se encarga de revisar qué imagen mostrar en cada momento.

2. Limpieza: Tu script de historia se enfoca en la narrativa, no en la lógica de imágenes.

3. Escalabilidad: Si mañana añades una tercera expresión (por ejemplo, "Lolo enojado"), solo cambias la definición inicial en una sola línea.

Conclusión y Aprendizaje
A veces, por querer avanzar rápido, usamos lo que ya conocemos (como los if/else básicos). Pero detenerse a aprender estas herramientas nos hace mejores desarrolladores.

¡Espero que este tip les sirva para sus proyectos! Si quieren ver esto en acción, no se pierdan el Short que acabo de subir al canal:

Para más contenido, visita mi canal:

Abrazos de Programación por Lily - YouTube

📜 Aviso de Derechos de Autor (Copyright) © 2026 Abrazos de Programación por Lily. Todos los derechos reservados. *El contenido de este canal, incluyendo el guion, las animaciones, los guiones de código y la presentación de los personajes (Lala, Marcus, Joy y Lolo), es propiedad intelectual exclusiva de la creadora del canal.* *¿Qué está permitido?* Compartir el enlace de los videos en redes sociales o foros educativos. Utilizar el código y las técnicas explicadas en tus propios proyectos de programación. *¿Qué NO está permitido?* *La descarga, copia, reproducción o resubida total o parcial de este contenido en otras plataformas o canales (YouTube, TikTok, Instagram, etc.) con fines comerciales o sin atribución de la fuente original.* *El uso de nuestros personajes o material gráfico para obras derivadas no autorizadas.* *Cualquier uso no autorizado será reportado bajo las políticas de derechos de autor y las leyes de propiedad intelectual vigentes.*

youtube.com

De la Idea al Píxel: Cómo Implementar el Acotamiento de Cámara Usando Min y Max en Python

Lily — Wed, 06 May 2026 01:46:24 +0000

En la primera parte de nuestro tutorial aprendimos a alinear los elementos de nuestro mundo usando operaciones aritméticas básicas. Hoy daremos el siguiente paso lógico y práctico.

Cuando creamos videojuegos en 2D con mapas basados en cuadrículas (tiles), queremos que la cámara siga al jugador. Pero, ¿qué pasa cuando el jugador se acerca a los bordes del nivel? Sin el control adecuado, la cámara se movería de más, mostrando un fondo vacío o el "vacío" del espacio de la ventana.

Para solucionar esto de forma elegante, utilizamos una técnica matemática llamada acotamiento o clamping.

El Reto Espacial
Imaginemos que tenemos una pantalla con una resolución fija y un mapa que es mucho más grande que dicha pantalla.

Para centrar a nuestro personaje, calculamos un desplazamiento (offset) ideal. Sin embargo, este offset puede salirse de los límites permitidos. Para evitarlo, encerramos nuestro cálculo entre los valores mínimos y máximos que puede tomar la cámara en el mundo.

El Modelo Matemático
Para acotar el valor de la cámara, combinamos las funciones min() y max(). La ecuación general que aplicamos es:

Offset_final = max(Límite_Inferior, min(Límite_Superior, Offset_ideal))

Implementación en el Código
En nuestro script, primero calculamos el tamaño total del mapa en píxeles multiplicando el número de celdas (tiles) por su dimensión:

# El ancho y alto total del mapa en píxeles
map_width_pixels = len(store.nivel_mapa[0]) * store.TILE_SIZE
map_height_pixels = len(store.nivel_mapa) * store.TILE_SIZE

Una vez que tenemos el tamaño del mapa, determinamos los límites del desplazamiento. Por ejemplo, en el eje X, el límite superior no puede ser mayor a cero (de lo contrario, veríamos el fondo a la izquierda de nuestro mapa) y el límite inferior se obtiene restando el ancho de la ventana menos el ancho del mapa.

# Límites del desplazamiento de la cámara para X
max_offset_x = 0
min_offset_x = store.SCREEN_WIDTH - map_width_pixels

Finalmente, calculamos la posición ideal para centrar a nuestro personaje y aplicamos la función matemática de acotamiento:

# Posición ideal de la cámara para centrar a Mario
ideal_camera_x_offset = int(store.SCREEN_WIDTH / 2 - mario_world_center_x)


# Aplicación del límite
store.camera_x_offset = max(min_offset_x, min(max_offset_x, ideal_camera_x_offset))

Nota: Este mismo bloque se aplica para el eje Y, intercambiando las variables correspondientes a la altura.

Conclusión
Con estas sencillas líneas de código, hemos logrado un movimiento de cámara fluido, evitando que se muestren áreas fuera de los límites del nivel. ¡Un paso más para lograr que nuestro juego se vea profesional y pulido!

Si no leíste la primera parte del tutorial:

Lily

May 6

De la Grilla a la Pantalla: Cómo Centrar y Alinear Sprites con Aritmética Básica.

#renpy #python #gamedev #tutorial

Comments

3 min read

Ejemplo de nuestro video explicando este proceso:
(Próximamente en Youtube).
Por mientras, puedes visitar mi canal para aprender Ren'Py:

Coding Cuddles - YouTube

Turn your stories into video games! 🎮✨ Have you ever dreamed of creating your own visual novel or an amazing game, but the code intimidates you a little? You're in the right place! Here, we demystify programming. With Ren'Py and Python, we'll learn from scratch (yes, from "Hello World") to creating amazing mechanics, vibrant characters, and unique systems. No boring language, just lots of patience and, above all, tons of fun! Subscribe and let's start writing the code for your next big hit. Your developer adventure starts today! 🚀 ❤️███████▓▒ IMPORTANT NOTICE ░▒▓████████❤️ "This tutorial has been a labor of love. I've used AI tools (Google AI/Gemini) to bring my protagonist's voice to life and generate visual and audio resources that allow me to focus on what I love most: teaching you programming. AI is my assistant, but the heart and structure of this course are my own. Thank you for being part of this dream!"

youtube.com

Si te ha resultado útil este artículo, recuerda dejar tu reacción y compartirlo. ¡Nos vemos en el próximo tutorial!

De la Grilla a la Pantalla: Cómo Centrar y Alinear Sprites con Aritmética Básica.

Lily — Wed, 06 May 2026 01:32:38 +0000

¡Hola a todos! Bienvenidos a un nuevo tutorial de desarrollo de videojuegos. Si estás dando tus primeros pasos creando un juego basado en rejillas o tiles (como los clásicos juegos de plataformas o RPG de tablero), tarde o temprano te enfrentarás a un problema muy común: ¿cómo hacer que tu personaje quede perfectamente centrado en su celda y no flotando en una esquina?

Hoy vamos a desmitificar la fórmula matemática detrás de la alineación de objetos en pantalla usando aritmética que ya conoces: multiplicar, dividir y sumar.

El Sistema de Coordenadas: Lógica vs. Píxeles.
Cuando diseñamos un mapa en un array o matriz, nuestro juego piensa en "coordenadas lógicas" (bloques enteros):

El jugador está en la columna

X = 0, fila Y = 10.

Sin embargo, el motor gráfico de tu pantalla no entiende de "bloques", sino de píxeles. Para poder dibujar a nuestro personaje, necesitamos traducir esa posición lógica a coordenadas reales de pantalla.

Para esta conversión, necesitamos conocer una variable clave: el tamaño de nuestro tile (en nuestro proyecto, TILE_SIZE = 90 píxeles).

Paso 1: La Conversión Básica (El Desplazamiento)

La primera ecuación intuitiva que se nos viene a la mente para calcular la posición en píxeles es multiplicar la coordenada de la grilla por el tamaño del tile:
`

Posición_píxeles = Posición_grilla x Tamaño_del_Tile

Si Mario está en la columna 0 de la grilla:

Posición = 0 x 90 = 0 (Píxel 0)

Si se mueve a la columna 3:

Posición = 3 x 90 = 270 (Píxel 270)
`

El problema: Esta ecuación calcula la esquina superior izquierda de la celda. Si dibujas el personaje usando este punto de referencia, tu sprite quedará alineado al borde del bloque, dando la sensación de que flota o está descuadrado respecto al entorno.

Paso 2: La Magia de la Alineación (Encontrar el Centro)

Para que el personaje se ubique exactamente en el centro geométrico del bloque, debemos aplicar un desfase o ajuste. ¿Cómo encontramos el punto medio de cualquier objeto? Dividiéndolo entre 2.
Sumando la mitad del tamaño de nuestro tile a la ecuación anterior, logramos el centrado perfecto:
`

Centro = (Posición_grilla x Tamaño_del_Tile) + (Tamaño_del_Tile / 2)
`

Traduciendo la matemática a código (Python/Ren'Py): En nuestro código, el cálculo del centro del mundo para Mario se escribe de la siguiente manera:

# Posición central de Mario en el mundo en píxeles
mario_world_center_x = store.mario_pos_x * store.TILE_SIZE + store.TILE_SIZE / 2
mario_world_center_y = store.mario_pos_y * store.TILE_SIZE + store.TILE_SIZE / 2

Si nuestro TILE_SIZE es de 90 píxeles, el programa calcula la esquina del bloque y le suma exactamente 45 píxeles de ajuste. ¡De esta manera, el punto de registro del personaje coincide siempre con el corazón geométrico de su celda!

Conclusión
Como puedes ver, no necesitas fórmulas físicas súper complejas para empezar a estructurar la lógica espacial de tu juego. Con una simple multiplicación y una división básica, lograste que tu entorno visual responda de forma simétrica y profesional.

En el próximo tutorial, utilizaremos este centro que acabamos de calcular para enseñarle a la cámara cómo seguir al jugador sin salirse de los límites del mapa.

¡Si te ha servido esta explicación, deja tu reacción y escribe en los comentarios qué otra lógica matemática te gustaría desglosar!
Puedes visitar mi canal de Youtube para aprender acerca de Ren`Py:

Coding Cuddles - YouTube

youtube.com