From 243ced7498c72d3f3b90629b962133197219e34a Mon Sep 17 00:00:00 2001 From: Sergio Valor Date: Thu, 7 May 2026 13:08:13 +0200 Subject: [PATCH] =?UTF-8?q?feat(title):=20seq=C3=BC=C3=A8ncia=20d'intro=20?= =?UTF-8?q?temporitzada=20amb=20slide-in=20del=20peu?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- data/ui.yaml | 18 ++- source/core/ui/ui_config.cpp | 23 +++- source/core/ui/ui_config.hpp | 18 ++- source/game/scenes/logo_scene.hpp | 2 +- source/game/scenes/title_scene.cpp | 196 ++++++++++++++++++++--------- source/game/scenes/title_scene.hpp | 19 ++- source/utils/defaults.hpp | 25 +++- 7 files changed, 226 insertions(+), 75 deletions(-) diff --git a/data/ui.yaml b/data/ui.yaml index 803051c..f286c7d 100644 --- a/data/ui.yaml +++ b/data/ui.yaml @@ -164,10 +164,20 @@ title: # mosaic — capa negra lineal damunt del canvas. La música no es toca: # `title.ogg` continua sonant cap a LOGO, que ja veurà què en fa. attract_fade_to_black_ms: 800 - # Fade-in inicial: capa negra al començament que s'esvaeix cap al fons. - # Mateix valor que `room_intro.fade_in_ms` (data/scenes/game.yaml) perquè - # l'arribada a la TITLE i a una sala de joc tinguin el mateix ritme. - intro_fade_in_ms: 500 + # Seqüència d'aparició dels elements de la TITLE en fase IDLE. Tots + # els temps són absoluts des de l'entrada a l'escena. `fade_in_ms` és + # la capa negra inicial que s'esvaeix cap al fons; els altres marquen + # quan apareix cada element. Si l'usuari prem START en qualsevol + # moment, la seqüència es completa instantàniament. + intro: + fade_in_ms: 500 # fade-in negre inicial sobre el fons + game_logo_at_ms: 1500 # visibilitat binària del game_logo + mini_logo_at_ms: 2000 # inici del slide-in del mini-logo + mini_logo_slide_ms: 500 # durada del slide + copyright_at_ms: 2200 # inici del slide-in del copyright + copyright_slide_ms: 500 # durada del slide + slide_curve: outCubic # corba compartida per mini_logo i copyright + press_start_at_ms: 3000 # quan apareix PRESS START amb parpadeig # Distorsió sinusoidal del fons (efecte de calor del desert). # `amplitude_px`: desplaçament màxim de cada fila en píxels. # `wavelength_px`: distància vertical entre dos pics de l'ona. diff --git a/source/core/ui/ui_config.cpp b/source/core/ui/ui_config.cpp index 2f9d6ae..a23546f 100644 --- a/source/core/ui/ui_config.cpp +++ b/source/core/ui/ui_config.cpp @@ -113,7 +113,16 @@ UiConfig::UiConfig() title_fade_out_max_block_(Defaults::UI::Title::FADE_OUT_MAX_BLOCK), title_music_fade_out_ms_(Defaults::UI::Title::MUSIC_FADE_OUT_MS), title_attract_fade_to_black_ms_(Defaults::UI::Title::ATTRACT_FADE_TO_BLACK_MS), - title_intro_fade_in_ms_(Defaults::UI::Title::INTRO_FADE_IN_MS), + title_intro_{ + .fade_in_ms = Defaults::UI::Title::Intro::FADE_IN_MS, + .game_logo_at_ms = Defaults::UI::Title::Intro::GAME_LOGO_AT_MS, + .mini_logo_at_ms = Defaults::UI::Title::Intro::MINI_LOGO_AT_MS, + .mini_logo_slide_ms = Defaults::UI::Title::Intro::MINI_LOGO_SLIDE_MS, + .copyright_at_ms = Defaults::UI::Title::Intro::COPYRIGHT_AT_MS, + .copyright_slide_ms = Defaults::UI::Title::Intro::COPYRIGHT_SLIDE_MS, + .slide_curve = curveByName(Defaults::UI::Title::Intro::SLIDE_CURVE), + .press_start_at_ms = Defaults::UI::Title::Intro::PRESS_START_AT_MS, + }, title_heat_haze_{ .enabled = Defaults::UI::Title::HeatHaze::ENABLED, .amplitude_px = Defaults::UI::Title::HeatHaze::AMPLITUDE_PX, @@ -251,7 +260,17 @@ void UiConfig::load(const std::string& file_path) { readField(t, "fade_out_max_block", title_fade_out_max_block_); readField(t, "music_fade_out_ms", title_music_fade_out_ms_); readField(t, "attract_fade_to_black_ms", title_attract_fade_to_black_ms_); - readField(t, "intro_fade_in_ms", title_intro_fade_in_ms_); + if (t.contains("intro")) { + const auto& in = t["intro"]; + readField(in, "fade_in_ms", title_intro_.fade_in_ms); + readField(in, "game_logo_at_ms", title_intro_.game_logo_at_ms); + readField(in, "mini_logo_at_ms", title_intro_.mini_logo_at_ms); + readField(in, "mini_logo_slide_ms", title_intro_.mini_logo_slide_ms); + readField(in, "copyright_at_ms", title_intro_.copyright_at_ms); + readField(in, "copyright_slide_ms", title_intro_.copyright_slide_ms); + readCurve(in, "slide_curve", title_intro_.slide_curve); + readField(in, "press_start_at_ms", title_intro_.press_start_at_ms); + } if (t.contains("heat_haze")) { const auto& hh = t["heat_haze"]; readField(hh, "enabled", title_heat_haze_.enabled); diff --git a/source/core/ui/ui_config.hpp b/source/core/ui/ui_config.hpp index 2e60237..a108e0a 100644 --- a/source/core/ui/ui_config.hpp +++ b/source/core/ui/ui_config.hpp @@ -89,6 +89,20 @@ class UiConfig { float speed_hz; }; + // Seqüència d'aparició dels elements en fase IDLE: tots els temps + // són absoluts des de l'entrada a l'escena. `slide_curve` es + // comparteix entre el slide-in del mini-logo i el del copyright. + struct TitleIntro { + int fade_in_ms; + int game_logo_at_ms; + int mini_logo_at_ms; + int mini_logo_slide_ms; + int copyright_at_ms; + int copyright_slide_ms; + CurveFn slide_curve; + int press_start_at_ms; + }; + [[nodiscard]] auto titleDurationMs() const -> int { return title_duration_ms_; } [[nodiscard]] auto titleBgColor() const -> Uint8 { return title_bg_color_; } [[nodiscard]] auto titleTextColor() const -> Uint8 { return title_text_color_; } @@ -106,7 +120,7 @@ class UiConfig { [[nodiscard]] auto titleFadeOutMaxBlock() const -> int { return title_fade_out_max_block_; } [[nodiscard]] auto titleMusicFadeOutMs() const -> int { return title_music_fade_out_ms_; } [[nodiscard]] auto titleAttractFadeToBlackMs() const -> int { return title_attract_fade_to_black_ms_; } - [[nodiscard]] auto titleIntroFadeInMs() const -> int { return title_intro_fade_in_ms_; } + [[nodiscard]] auto titleIntro() const -> const TitleIntro& { return title_intro_; } [[nodiscard]] auto titleHeatHaze() const -> const TitleHeatHaze& { return title_heat_haze_; } // Corbes d'easing triades al YAML. Si el nom no és conegut, s'usa @@ -192,7 +206,7 @@ class UiConfig { int title_fade_out_max_block_; int title_music_fade_out_ms_; int title_attract_fade_to_black_ms_; - int title_intro_fade_in_ms_; + TitleIntro title_intro_; TitleHeatHaze title_heat_haze_; std::string menu_select_sound_; diff --git a/source/game/scenes/logo_scene.hpp b/source/game/scenes/logo_scene.hpp index 6621dce..6f418ea 100644 --- a/source/game/scenes/logo_scene.hpp +++ b/source/game/scenes/logo_scene.hpp @@ -16,7 +16,7 @@ class Surface; // es demana la mateixa pista que ja sona). // // Skip: qualsevol tecla no reservada salta directament a la transició -// (sense fade-out) — el TitleScene té el seu propi `intro_fade_in_ms`, +// (sense fade-out) — el TitleScene té el seu propi `intro.fade_in_ms`, // així que la transició queda visualment continua igualment. // // Si arriba amb `reset=true` (acció "Reiniciar" del menú de servei), diff --git a/source/game/scenes/title_scene.cpp b/source/game/scenes/title_scene.cpp index 5866a92..9dfa613 100644 --- a/source/game/scenes/title_scene.cpp +++ b/source/game/scenes/title_scene.cpp @@ -25,6 +25,7 @@ #include "game/scenes/scene_flow.hpp" #include "utils/defaults.hpp" #include "utils/defines.hpp" +#include "utils/easing.hpp" namespace { @@ -87,7 +88,7 @@ TitleScene::TitleScene(std::shared_ptr condensed_font, std::shared_ptr= intro.press_start_at_ms) { + // Resetegem el cicle del parpadeig a l'instant en què el + // PRESS START passa a ser visible per primera vegada, perquè + // el primer frame caigui en estat "on" (si no, el modulus + // amb el contador acumulat des de t=0 podria caure mig + // cicle i donar un primer "off" estrany). + press_start_armed_ = true; + blink_elapsed_ms_ = 0; + } + } + const bool P1_START = pressedStart(0); const bool P2_START = pressedStart(1); @@ -148,6 +166,24 @@ void TitleScene::enterStarting(DebugConfig::StartingPlayers players) { // STARTING comenci visible — sense això, el modulus amb el nou // període podria caure mig cicle i donar un primer "off" estrany. blink_elapsed_ms_ = 0; + + // Shortcut: si l'usuari ha premut START durant la intro, saltem al + // final de la seqüència perquè el frame de STARTING comenci amb + // tot a la posició final i visible (sense salts ni elements en + // moviment a meitat). FadeToBlack::tick clampeja internament a + // duration_ms, així que un delta gegant l'avança a finished sense + // efectes secundaris. + const auto& intro = UiConfig::get().titleIntro(); + const int INTRO_END_MS = std::max({ + intro.game_logo_at_ms, + intro.mini_logo_at_ms + intro.mini_logo_slide_ms, + intro.copyright_at_ms + intro.copyright_slide_ms, + intro.press_start_at_ms, + }); + intro_elapsed_ms_ = std::max(intro_elapsed_ms_, INTRO_END_MS); + press_start_armed_ = true; + intro_fade_.tick(INTRO_END_MS); + // Fade-out de la música. Si l'altre jugador prem START i el timer // es reseteja, no rearranquem la música: es manté la fosa iniciada // ací (consistent amb el fade visual, que tampoc es reverteix). @@ -237,9 +273,19 @@ void TitleScene::advanceToLogo() { } void TitleScene::render() { - const auto& ui_config = UiConfig::get(); - const auto& palette = Resource::Cache::get().getPalette("ui"); + const auto& intro = UiConfig::get().titleIntro(); + renderBackground(); + renderGameLogo(intro); + renderPressStart(intro); + renderFooter(intro); + Notifier::get().render(); + renderTransitions(); + RenderInfo::get().render(); + Screen::get().present(); +} + +void TitleScene::renderBackground() { // Fons: la imatge si està disponible (cobreix tot el canvas amb la // seua paleta nadiua), opcionalment amb heat-haze; en cas contrari, // color pla de la paleta UI com a fallback defensiu. @@ -249,79 +295,114 @@ void TitleScene::render() { } else { background_->render(0, 0); } - } else { - Screen::get().fillRect(0, 0, GameCanvas::WIDTH, GameCanvas::HEIGHT, palette[ui_config.titleBgColor()]); + return; } + const auto& ui_config = UiConfig::get(); + const auto& palette = Resource::Cache::get().getPalette("ui"); + Screen::get().fillRect(0, 0, GameCanvas::WIDTH, GameCanvas::HEIGHT, palette[ui_config.titleBgColor()]); +} + +void TitleScene::renderGameLogo(const UiConfig::TitleIntro& intro) { + // Visibilitat binària gestionada per la seqüència d'intro: a IDLE + // només es pinta a partir de `game_logo_at_ms`; fora d'IDLE sempre. + // TODO: aplicar fade-in alpha quan Surface suporti renderWithAlpha. + const bool VISIBLE = phase_ != Phase::IDLE || intro_elapsed_ms_ >= intro.game_logo_at_ms; + if (!game_logo_ || !VISIBLE) { return; } + const auto& ui_config = UiConfig::get(); + const int LOGO_Y = (GameCanvas::HEIGHT * ui_config.titleLogoYPercent()) / 100; + const int LOGO_X = GameCanvas::CENTER_X - (game_logo_->getWidth() / 2); + game_logo_->render(LOGO_X, LOGO_Y); +} + +void TitleScene::renderPressStart(const UiConfig::TitleIntro& intro) { + // A IDLE només apareix a partir de `press_start_at_ms`; fora d'IDLE + // (STARTING o ATTRACT_OUT) sempre, com fins ara. + const bool VISIBLE = phase_ != Phase::IDLE || intro_elapsed_ms_ >= intro.press_start_at_ms; + if (!condensed_font_ || !VISIBLE) { return; } + + // Cicle de parpadeig: a IDLE pren visible_ms+hidden_ms del yaml + // (asimètric, 80/20 per defecte); a STARTING commuta a 50/50 amb + // `starting_blink_period_ms` per donar feedback de "polsat". + // Si el cicle val 0 (configuració degenerada), cau a "sempre visible". + const auto& ui_config = UiConfig::get(); + int cycle_ms = 0; + int visible_ms = 0; + if (phase_ == Phase::STARTING) { + cycle_ms = std::max(0, ui_config.titleStartingBlinkPeriodMs()); + visible_ms = cycle_ms / 2; + } else { + visible_ms = std::max(0, ui_config.titleBlinkVisibleMs()); + cycle_ms = visible_ms + std::max(0, ui_config.titleBlinkHiddenMs()); + } + const bool BLINK_ON = (cycle_ms == 0) || ((blink_elapsed_ms_ % cycle_ms) < visible_ms); + if (!BLINK_ON) { return; } - const Uint8 TEXT_COLOR = ui_config.titleTextColor(); - const Uint8 OUTLINE_COLOR = ui_config.titlePressStartOutlineColor(); constexpr Uint8 OUTLINE_DIST = 1; constexpr Uint8 STROKE4 = Text::CENTER_FLAG | Text::COLOR_FLAG | Text::STROKE4_FLAG; + const int PROMPT_Y = (GameCanvas::HEIGHT * ui_config.titlePromptYPercent()) / 100; + condensed_font_->writeDX(STROKE4, + GameCanvas::CENTER_X, + PROMPT_Y, + Locale::get().text("title.press_start"), + condensed_font_->getDefaultKerning() - 1, + ui_config.titleTextColor(), + OUTLINE_DIST, + ui_config.titlePressStartOutlineColor()); +} - // Logotip del joc: GIF amb la seua paleta nadiua, centrat - // horitzontalment al canvas i ancorat al mateix Y on abans naixia - // la primera línia del text. Substitueix els dos `display_font_` - // que pintaven "Aventures en Egipte" + "A R C A D E". - if (game_logo_) { - const int LOGO_Y = (GameCanvas::HEIGHT * ui_config.titleLogoYPercent()) / 100; - const int LOGO_X = GameCanvas::CENTER_X - (game_logo_->getWidth() / 2); - game_logo_->render(LOGO_X, LOGO_Y); - } - - if (condensed_font_) { - // Cicle de parpadeig: a IDLE pren visible_ms+hidden_ms del yaml - // (asimètric, 80/20 per defecte); a STARTING commuta a 50/50 amb - // `starting_blink_period_ms` per donar feedback de "polsat". - // Si el cicle val 0 (configuració degenerada), cau a "sempre visible". - int cycle_ms = 0; - int visible_ms = 0; - if (phase_ == Phase::STARTING) { - cycle_ms = std::max(0, ui_config.titleStartingBlinkPeriodMs()); - visible_ms = cycle_ms / 2; - } else { - visible_ms = std::max(0, ui_config.titleBlinkVisibleMs()); - cycle_ms = visible_ms + std::max(0, ui_config.titleBlinkHiddenMs()); - } - const bool VISIBLE = (cycle_ms == 0) || ((blink_elapsed_ms_ % cycle_ms) < visible_ms); - - if (VISIBLE) { - const int PROMPT_Y = (GameCanvas::HEIGHT * ui_config.titlePromptYPercent()) / 100; - condensed_font_->writeDX(STROKE4, - GameCanvas::CENTER_X, - PROMPT_Y, - Locale::get().text("title.press_start"), - condensed_font_->getDefaultKerning() - 1, - TEXT_COLOR, - OUTLINE_DIST, - OUTLINE_COLOR); - } - } - +void TitleScene::renderFooter(const UiConfig::TitleIntro& intro) { // Footer: minilogo centrat horitzontalment damunt del © de // copyright. El text va al `title.copyright_y_percent`, el logo just // damunt amb un petit gap (`title.mini_logo_gap_px`). El copyright fa // servir una font pixel-art pròpia (Tiny5-Regular size 8) — més neta // i petita que la del "press start" perquè la jerarquia tipogràfica // del peu quedi clara. - if (copyright_font_) { - const int COPY_Y = (GameCanvas::HEIGHT * ui_config.titleCopyrightYPercent()) / 100; - if (mini_logo_) { - const int LOGO_X = GameCanvas::CENTER_X - (mini_logo_->getWidth() / 2); - const int LOGO_Y = COPY_Y - mini_logo_->getHeight() - ui_config.titleMiniLogoGapPx(); - mini_logo_->render(LOGO_X, LOGO_Y); + if (!copyright_font_) { return; } + + const auto& ui_config = UiConfig::get(); + const int COPY_Y = (GameCanvas::HEIGHT * ui_config.titleCopyrightYPercent()) / 100; + const bool IDLE = phase_ == Phase::IDLE; + + // Mini-logo: slide-in vertical des del marge inferior amb la corba + // `slide_curve`. Fora d'IDLE (o un cop completat) la Y és la final. + if (mini_logo_ && (!IDLE || intro_elapsed_ms_ >= intro.mini_logo_at_ms)) { + const int FINAL_Y = COPY_Y - mini_logo_->getHeight() - ui_config.titleMiniLogoGapPx(); + int y = FINAL_Y; + if (IDLE && intro.mini_logo_slide_ms > 0) { + const float T = std::clamp( + static_cast(intro_elapsed_ms_ - intro.mini_logo_at_ms) / static_cast(intro.mini_logo_slide_ms), + 0.0F, + 1.0F); + y = Easing::lerpInt(GameCanvas::HEIGHT, FINAL_Y, intro.slide_curve(T)); + } + const int LOGO_X = GameCanvas::CENTER_X - (mini_logo_->getWidth() / 2); + mini_logo_->render(LOGO_X, y); + } + + // Copyright: mateix patró amb el seu propi tempo. La diferència + // de temps entre `mini_logo_at_ms` i `copyright_at_ms` controla + // el decalatge entre les dues entrades (per defecte 200 ms). + if (!IDLE || intro_elapsed_ms_ >= intro.copyright_at_ms) { + int y = COPY_Y; + if (IDLE && intro.copyright_slide_ms > 0) { + const float T = std::clamp( + static_cast(intro_elapsed_ms_ - intro.copyright_at_ms) / static_cast(intro.copyright_slide_ms), + 0.0F, + 1.0F); + y = Easing::lerpInt(GameCanvas::HEIGHT, COPY_Y, intro.slide_curve(T)); } copyright_font_->writeDX(Text::CENTER_FLAG | Text::COLOR_FLAG, GameCanvas::CENTER_X, - COPY_Y, + y, "© 2026 JailDesigner", copyright_font_->getDefaultKerning(), ui_config.titleCopyrightColor()); } +} - Notifier::get().render(); - +void TitleScene::renderTransitions() { // Fade-in inicial: capa negra que s'esvaeix cap a l'escena durant - // els primers `title.intro_fade_in_ms` ms. `render()` és no-op un + // els primers `title.intro.fade_in_ms` ms. `render()` és no-op un // cop finished, així que es queda penjat aquí sense lògica // condicional. Va per damunt del Notifier — coherent amb la resta // de transicions — però per davall del RenderInfo de debug. @@ -337,7 +418,4 @@ void TitleScene::render() { } else if (fade_out_ && (fade_out_->isActive() || fade_out_->isFinished())) { fade_out_->render(); } - - RenderInfo::get().render(); - Screen::get().present(); } diff --git a/source/game/scenes/title_scene.hpp b/source/game/scenes/title_scene.hpp index 1fa08f6..6fcfd5b 100644 --- a/source/game/scenes/title_scene.hpp +++ b/source/game/scenes/title_scene.hpp @@ -8,6 +8,7 @@ #include "core/rendering/transitions/fade_to_black.hpp" #include "core/rendering/transitions/mosaic.hpp" #include "core/scene/scene.hpp" +#include "core/ui/ui_config.hpp" #include "game/debug_config.hpp" class Surface; @@ -49,6 +50,14 @@ class TitleScene : public Scene { void advanceToIntro(DebugConfig::StartingPlayers players); void advanceToLogo(); + // Helpers de `render()` extrets per evitar que la funció gran acumuli + // massa branques. Cadascun pinta un bloc independent del frame. + void renderBackground(); + void renderGameLogo(const UiConfig::TitleIntro& intro); + void renderPressStart(const UiConfig::TitleIntro& intro); + void renderFooter(const UiConfig::TitleIntro& intro); + void renderTransitions(); + std::shared_ptr condensed_font_; std::shared_ptr copyright_font_; std::shared_ptr background_; @@ -56,6 +65,14 @@ class TitleScene : public Scene { std::shared_ptr mini_logo_; int timer_ms_; int blink_elapsed_ms_{0}; + // Rellotge de la seqüència d'intro (vegeu `title.intro` a ui.yaml). + // Avança sempre amb `delta_ms`. La visibilitat i el slide de cada + // element es deriven d'ell a `render()` — no cal cap altre estat. + int intro_elapsed_ms_{0}; + // Detector de l'instant en què `intro_elapsed_ms_` creua per primera + // vegada `press_start_at_ms`: en aquell frame es reseteja + // `blink_elapsed_ms_` perquè el text aparegui en estat visible. + bool press_start_armed_{false}; std::optional heat_haze_; Phase phase_{Phase::IDLE}; int starting_timer_ms_{0}; @@ -63,7 +80,7 @@ class TitleScene : public Scene { std::optional fade_out_; std::optional attract_fade_; // Fade-in inicial: capa negra que s'esvaeix cap a la imatge de fons - // durant els primers `title.intro_fade_in_ms` ms. Sempre activa al + // durant els primers `title.intro.fade_in_ms` ms. Sempre activa al // ctor; un cop finished, `render()` pinta alpha=0 (no-op) la resta // del cicle de l'escena. Transitions::FadeToBlack intro_fade_; diff --git a/source/utils/defaults.hpp b/source/utils/defaults.hpp index 8831f2c..263105e 100644 --- a/source/utils/defaults.hpp +++ b/source/utils/defaults.hpp @@ -319,12 +319,25 @@ namespace Defaults { // veurà què en fa. constexpr int ATTRACT_FADE_TO_BLACK_MS = 800; - // Fade-in inicial de l'escena: capa negra al començament que - // s'esvaeix cap a la imatge de fons. Lineal, sense mosaic — - // mateixa convenció que el `room_intro.fade_in_ms` del joc - // perquè l'arribada a la TITLE i l'arribada a una sala de - // joc tinguin el mateix ritme visual. - constexpr int INTRO_FADE_IN_MS = 500; + // Seqüència d'aparició dels elements de la TITLE en fase IDLE. + // Tots els temps són absoluts des de l'entrada a l'escena. + // `FADE_IN_MS` és la capa negra inicial que s'esvaeix cap al fons + // (mateixa convenció que `room_intro.fade_in_ms` del joc perquè + // l'arribada a la TITLE i a una sala de joc tinguin el mateix + // ritme). Els altres temps marquen quan apareix cada element; + // `SLIDE_*` defineixen el slide-in des del marge inferior amb + // la corba `SLIDE_CURVE`. Si l'usuari prem START durant la + // seqüència, aquesta es completa instantàniament. + namespace Intro { + constexpr int FADE_IN_MS = 500; + constexpr int GAME_LOGO_AT_MS = 1500; + constexpr int MINI_LOGO_AT_MS = 2000; + constexpr int MINI_LOGO_SLIDE_MS = 500; + constexpr int COPYRIGHT_AT_MS = 2200; + constexpr int COPYRIGHT_SLIDE_MS = 500; + constexpr const char* SLIDE_CURVE = "outCubic"; + constexpr int PRESS_START_AT_MS = 3000; + } // namespace Intro // Distorsió sinusoidal horitzontal de l'imatge de fons // (efecte de calor del desert). `amplitude_px` és el