> For the complete documentation index, see [llms.txt](https://docs.allout.game/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.allout.game/all-out-docs/docs-es/primeros-pasos/testing-and-publishing.md).

# Construyendo un juego básico

### Colección de manzanas

{% hint style="info" %}
Este juego de ejemplo pasa por alto detalles que se tratan en profundidad en otras guías. Si necesitas ayuda, consulta la barra lateral izquierda o usa la función de búsqueda en la parte superior para obtener información adicional.
{% endhint %}

#### Construyendo el mapa

Empezaremos creando un mundo básico con una isla para caminar y una manzana para recoger más tarde.

1. Busca una Manzana y una Isla en el [Catálogo de recursos](/all-out-docs/docs-es/uso-del-editor/asset-catalog.md) y arrástralas a la vista de escena de tu juego.

<figure><img src="/files/2a52184c58ba7e4da96ee1bab277988aade4161f" alt="Apple and island assets placed in the scene"><figcaption></figcaption></figure>

2. ¡Esa isla es bastante pequeña! En el [Inspector](/all-out-docs/docs-es/uso-del-editor/inspector.md) configura el `Escala` a 10x10 para hacerla más grande

<figure><img src="/files/0113d80e7e957917eb7904d9504c5f559077bd56" alt="Island scale set in the Inspector"><figcaption></figcaption></figure>

3. Ahora la isla tiene un tamaño adecuado, ¡pero la manzana está detrás de la isla! Establece la `Capa` a -10 para ponerla detrás de todo lo demás.

<figure><img src="/files/1ff0f185def108f946c107d730c070f42a85143a" alt="Island rendering layer set in the Inspector"><figcaption></figcaption></figure>

#### Añadiendo scripts

En el directorio de tu proyecto de juego, `scripts` crea un nuevo archivo llamado `pickup_apple.csl` y ábrelo en un editor de texto o usa un [IDE basado en IA](/all-out-docs/docs-es/programacion/cursor-claude-antigravity-setup.md).

Pega el siguiente script de ejemplo y guarda el archivo:

```go
// Esto crea el componente que hace que la manzana sea interactiva,
// lo añadiremos a la Manzana en el siguiente paso del tutorial.
Pickup_Apple :: class : Interactable {
    is_picked_up: bool;

    ao_start :: method() {
        this.set_listener(this);
        this.set_text("Recoger");
    }

    can_use :: method(player: Player) -> bool {
        if is_picked_up return false;
        return true;
    }

    on_interact :: method(player: Player) {
        if is_picked_up return;
        is_picked_up = true;

        // Inicia el efecto pop
        effect := new(Apple_Pop_Effect);
        entity.set_active_effect(effect);
    }
}

// Una animación genial para cuando te la comes :D
Apple_Pop_Effect :: class : Effect_Base {
    sprite: Sprite_Renderer;
    start_scale: v2;
    start_pos: v2;

    effect_start :: method() {
        sprite = entity.get_component(Sprite_Renderer);
        start_scale = entity.local_scale;
        start_pos = entity.local_position;
        set_duration(0.4);
    }

    effect_update :: method(dt: float) {
        t := get_elapsed_time() / 0.4;

        // Escala hacia arriba y luego encoge rápidamente hasta desaparecer
        scale_curve: float;
        if t < 0.3 {
            // Aparición rápida (escala a 1.3x)
            scale_curve = lerp(1.0, 1.3, Ease.out_back(t / 0.3));
        } else {
            // Encoger hasta desaparecer
            scale_curve = lerp(1.3, 0.0, Ease.in_back((t - 0.3) / 0.7));
        }

        entity.set_local_scale(start_scale * scale_curve);

        // Flota ligeramente hacia arriba
        rise := Ease.out_quad(t) * 0.5;
        entity.set_local_position({start_pos.x, start_pos.y + rise});

        // Desvanece al final
        if sprite != null {
            alpha := 1.0 - Ease.in_quad(max(0.0, (t - 0.5) / 0.5));
            sprite.color.w = alpha;
        }
    }

    effect_end :: method(interrupt: bool) {
        entity.destroy();
    }
}
```

> Al guardar un archivo CSL, se detecta y compila automáticamente. En una prueba en ejecución, pulsa **Alt+F9** para cargar manualmente los scripts compilados en caliente. Detén y reinicia para los cambios de escena. **Ctrl+R** recarga todo el proyecto del editor y no es necesario para la compilación normal de scripts.

#### Añadiendo el componente de la manzana

Ahora que has creado tu script de manzana, tendremos que aplicarlo a la manzana de la escena. Para hacerlo, añadiremos el nuevo `Pickup_Apple` componente del script usando el Inspector.

1. Selecciona tu Manzana en la escena.
2. Haz clic en el botón "Add Component" del Inspector.
3. Busca el componente "Pickup\_Apple" y haz clic en él para añadirlo a la manzana.

<figure><img src="/files/a4b4915a9f19f2603b54ba94329fa64ed8b3076e" alt="Adding the Pickup Apple component in the Inspector"><figcaption></figcaption></figure>

Ahora verás que el componente se ha añadido a la manzana. Puedes ajustar algunos campos de la Manzana cambiando los valores en el inspector:

<figure><img src="/files/8fff290ca31fb488f083a75b4552a0a6f9f82ab6" alt="Pickup Apple component fields in the Inspector"><figcaption></figcaption></figure>

#### Jugando a tu juego

Cuando estés listo, pulsa el divertido triángulo verde y prueba tu juego.

<figure><img src="/files/395afcf7047e1828cf972084923b087a68b90058" alt="Apple collection game running in a local test"><figcaption></figcaption></figure>

### Próximos pasos

En las próximas secciones, aprenderás a probar tu juego con varios jugadores, crear tus propios scripts y construir el mundo de tus sueños.

**Aquí tienes algunos desafíos para probar:**

* Haz muchas manzanas para que el jugador las coma
* Reproduce efectos de sonido al ser comidas
* **Avanzado:** intenta escribir un script para hacer reaparecer más manzanas después de que se las coman

\--

{% hint style="info" %}
NOTA: Si tu isla tiene una baja resolución o se ve pixelada, haz clic en el activo png de la isla en la sección "Assets" y establece el Multiplicador de remuestreo en 1 y haz clic en Aplicar

<img src="/files/27ba4dfb30fe1a02632bf7de906fe1a6186fbf6b" alt="Texture settings with Resample Multiplier set to 1" data-size="original">
{% endhint %}
