{"id":2700,"date":"2026-07-14T10:28:53","date_gmt":"2026-07-14T08:28:53","guid":{"rendered":"https:\/\/costabravaparcaventura.com\/2700-2\/"},"modified":"2026-07-16T12:36:10","modified_gmt":"2026-07-16T10:36:10","slug":"2700-2","status":"publish","type":"page","link":"https:\/\/costabravaparcaventura.com\/en\/2700-2\/","title":{"rendered":"Web development"},"content":{"rendered":"\n<!-- ==================================================\n     COSTA BRAVA PARC AVENTURA \u00b7 CAS D\u2019ESTUDI\n     ESCENA 1 \u00b7 TERMINAL \u2192 HERO\n================================================== -->\n\n<section class=\"cbpa-case-scene cbpa-case-scene--hero\" id=\"cbpa-case-scene-1\" aria-labelledby=\"cbpa-case-hero-title\">\n\n  <div class=\"cbpa-case-scene__ambient\" aria-hidden=\"true\">\n    <span class=\"cbpa-case-scene__glow cbpa-case-scene__glow--one\"><\/span>\n    <span class=\"cbpa-case-scene__glow cbpa-case-scene__glow--two\"><\/span>\n    <span class=\"cbpa-case-scene__grid\"><\/span>\n  <\/div>\n\n  <div class=\"cbpa-case-scene__container\">\n\n    <div class=\"cbpa-case-transform\" data-cbpa-scene=\"terminal-hero\">\n\n      <!-- ==============================================\n           ESTAT 1 \u00b7 TERMINAL\n      =============================================== -->\n\n      <div class=\"cbpa-case-transform__layer cbpa-case-transform__layer--terminal\" aria-hidden=\"false\">\n\n        <div class=\"cbpa-case-terminal\">\n\n          <div class=\"cbpa-case-terminal__glow\" aria-hidden=\"true\"><\/div>\n\n          <div class=\"cbpa-case-terminal__window\">\n\n            <header class=\"cbpa-case-terminal__header\">\n\n              <div class=\"cbpa-case-terminal__controls\" aria-hidden=\"true\">\n                <span class=\"cbpa-case-terminal__control cbpa-case-terminal__control--red\"><\/span>\n                <span class=\"cbpa-case-terminal__control cbpa-case-terminal__control--yellow\"><\/span>\n                <span class=\"cbpa-case-terminal__control cbpa-case-terminal__control--green\"><\/span>\n              <\/div>\n\n              <div class=\"cbpa-case-terminal__file\">\n                 <span class=\"cbpa-case-terminal__file-icon\" aria-hidden=\"true\">\n >\n                <\/span>\n\n                <span class=\"cbpa-case-terminal__file-name\">\n costa-brava-experience.js\n                <\/span> \n              <\/div>\n\n              <div class=\"cbpa-case-terminal__status\">\n                <span class=\"cbpa-case-terminal__status-dot\"><\/span>\n building\n              <\/div>\n\n            <\/header>\n\n            <div class=\"cbpa-case-terminal__body\">\n\n              <div class=\"cbpa-case-terminal__code\" id=\"cbpa-case-terminal-code\" aria-label=\"Proc\u00e9s de construcci\u00f3 de l\u2019experi\u00e8ncia digital\"><\/div>\n\n              <span class=\"cbpa-case-terminal__cursor\" aria-hidden=\"true\"><\/span>\n\n            <\/div>\n\n            <footer class=\"cbpa-case-terminal__footer\">\n\n              <span class=\"cbpa-case-terminal__branch\">\n                <span aria-hidden=\"true\">\u2318<\/span>\n main\n              <\/span>\n\n              <span class=\"cbpa-case-terminal__progress\">\n                <span class=\"cbpa-case-terminal__progress-track\">\n                  <span class=\"cbpa-case-terminal__progress-bar\"><\/span>\n                <\/span>\n\n                <span class=\"cbpa-case-terminal__progress-text\">\n Initializing experience\n                <\/span>\n              <\/span>\n\n            <\/footer>\n\n          <\/div>\n\n        <\/div>\n\n      <\/div>\n\n\n      <!-- ==============================================\n           ESTAT 2 \u00b7 HERO FINAL\n      =============================================== -->\n\n      <div class=\"cbpa-case-transform__layer cbpa-case-transform__layer--content\" aria-hidden=\"true\">\n\n        <article class=\"cbpa-case-hero\">\n\n          <div class=\"cbpa-case-hero__visual\" aria-hidden=\"true\">\n\n            <div class=\"cbpa-case-hero__orb cbpa-case-hero__orb--outer\"><\/div>\n            <div class=\"cbpa-case-hero__orb cbpa-case-hero__orb--middle\"><\/div>\n            <div class=\"cbpa-case-hero__orb cbpa-case-hero__orb--inner\"><\/div>\n\n            <div class=\"cbpa-case-hero__signal\">\n              <span><\/span>\n              <span><\/span>\n              <span><\/span>\n            <\/div>\n\n          <\/div>\n\n          <div class=\"cbpa-case-hero__content\">\n\n            <div class=\"cbpa-case-hero__eyebrow\">\n              <span class=\"cbpa-case-hero__eyebrow-dot\"><\/span>\n Digital Case Study\n            <\/div>\n\n            <h1 class=\"cbpa-case-hero__title\" id=\"cbpa-case-hero-title\">\n A new digital experience for\n              <span>Costa Brava Parc Aventura<\/span>\n            <\/h1>\n\n            <p class=\"cbpa-case-hero__description\">\n Web redesign, digital architecture, and visual experience\n built from scratch to transform a complex offering\n into a clear, attractive, and growth-ready system.\n            <\/p>\n\n            <div class=\"cbpa-case-hero__meta\">\n\n              <div class=\"cbpa-case-hero__meta-item\">\n                 <span class=\"cbpa-case-hero__meta-label\">\n Project\n                <\/span>\n\n                <strong class=\"cbpa-case-hero__meta-value\">\n Digital Redesign\n                <\/strong> \n              <\/div>\n\n              <div class=\"cbpa-case-hero__meta-item\">\n                 <span class=\"cbpa-case-hero__meta-label\">\n Scope\n                <\/span>\n\n                <strong class=\"cbpa-case-hero__meta-value\">\n Web \u00b7 UX \u00b7 SEO\n                <\/strong> \n              <\/div>\n\n              <div class=\"cbpa-case-hero__meta-item\">\n                 <span class=\"cbpa-case-hero__meta-label\">\n Status\n                <\/span>\n\n                <strong class=\"cbpa-case-hero__meta-value\">\n System Deployed\n                <\/strong> \n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n        <\/article>\n\n      <\/div>\n\n    <\/div>\n\n    <div class=\"cbpa-case-scene__scroll\" aria-hidden=\"true\">\n      <span class=\"cbpa-case-scene__scroll-line\"><\/span>\n      <span class=\"cbpa-case-scene__scroll-text\">Explore the project<\/span>\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n<!-- ==================================================\n     COSTA BRAVA PARC AVENTURA \u00b7 CAS D'ESTUDI\n     ESCENA 2 \u00b7 ARQUITECTURA DEL PROJECTE\n================================================== -->\n\n<section class=\"cbpa-case-scene-two\" id=\"cbpa-case-scene-two\" aria-labelledby=\"cbpa-scene-two-title\">\n\n  <!-- Decoraci\u00f3 ambiental -->\n  <div class=\"cbpa-case-scene-two__ambient\" aria-hidden=\"true\">\n    <span class=\"cbpa-case-scene-two__glow cbpa-case-scene-two__glow--one\"><\/span>\n    <span class=\"cbpa-case-scene-two__glow cbpa-case-scene-two__glow--two\"><\/span>\n    <span class=\"cbpa-case-scene-two__grid\"><\/span>\n  <\/div>\n\n\n  <div class=\"cbpa-case-scene-two__container\">\n\n    <!-- Cap\u00e7alera narrativa -->\n    <header class=\"cbpa-case-scene-two__header\">\n\n      <span class=\"cbpa-case-scene-two__eyebrow\">\n  02 \u00b7 Digital architecture\n      <\/span>\n\n      <h2 class=\"cbpa-case-scene-two__title\" id=\"cbpa-scene-two-title\">\n  Every piece is part<br\/> of the same system.\n      <\/h2>\n\n      <p class=\"cbpa-case-scene-two__description\">\n  The project was structured from the roots: content,\n navigation, visual experience, performance, and positioning.\n      <\/p>\n\n    <\/header>\n\n\n    <!-- Escenari principal -->\n    <div class=\"cbpa-case-scene-two__stage\">\n\n      <!-- Terminal inicial -->\n      <div class=\"cbpa-case-scene-two__terminal\" data-scene-two-terminal=\"\" aria-label=\"Terminal mostrant l'arquitectura del projecte\">\n\n        <div class=\"cbpa-case-scene-two__terminal-bar\">\n\n          <div class=\"cbpa-case-scene-two__terminal-controls\" aria-hidden=\"true\">\n            <span><\/span>\n            <span><\/span>\n            <span><\/span>\n          <\/div>\n\n          <span class=\"cbpa-case-scene-two__terminal-name\">\n  project-architecture.js\n          <\/span>\n\n          <span class=\"cbpa-case-scene-two__terminal-status\">\n  system online\n          <\/span>\n\n        <\/div>\n\n\n        <div class=\"cbpa-case-scene-two__terminal-body\">\n\n          <div class=\"cbpa-case-scene-two__line-numbers\" aria-hidden=\"true\">\n            <span>01<\/span>\n            <span>02<\/span>\n            <span>03<\/span>\n            <span>04<\/span>\n            <span>05<\/span>\n            <span>06<\/span>\n            <span>07<\/span>\n            <span>08<\/span>\n            <span>09<\/span>\n            <span>10<\/span>\n          <\/div>\n\n          <pre class=\"cbpa-case-scene-two__code\" aria-live=\"polite\"><code data-scene-two-code=\"\"><\/code><span class=\"cbpa-case-scene-two__cursor\" data-scene-two-cursor=\"\" aria-hidden=\"true\"><\/span><\/pre>\n\n        <\/div>\n\n      <\/div>\n\n\n      <!-- Sistema visual final -->\n      <div class=\"cbpa-case-scene-two__system\" data-scene-two-system=\"\">\n\n        <!-- Nucli central -->\n        <div class=\"cbpa-case-scene-two__core\">\n\n          <div class=\"cbpa-case-scene-two__core-ring\" aria-hidden=\"true\"><\/div>\n          <div class=\"cbpa-case-scene-two__core-ring cbpa-case-scene-two__core-ring--outer\" aria-hidden=\"true\"><\/div>\n\n          <div class=\"cbpa-case-scene-two__core-content\">\n\n             <span class=\"cbpa-case-scene-two__core-label\">\n Costa Brava\n            <\/span>\n\n            <strong class=\"cbpa-case-scene-two__core-title\">\n Parc Aventura\n            <\/strong>\n\n            <span class=\"cbpa-case-scene-two__core-meta\">\n Digital ecosystem\n            <\/span> \n\n          <\/div>\n\n        <\/div>\n\n\n        <!-- Connexions decoratives -->\n        <svg class=\"cbpa-case-scene-two__connections\" viewbox=\"0 0 1000 650\" preserveaspectratio=\"none\" aria-hidden=\"true\">\n          <path class=\"cbpa-case-scene-two__connection\" d=\"M500 325 C390 270 300 175 195 130\"><\/path>\n\n          <path class=\"cbpa-case-scene-two__connection\" d=\"M500 325 C610 270 700 175 805 130\"><\/path>\n\n          <path class=\"cbpa-case-scene-two__connection\" d=\"M500 325 C360 350 270 420 165 510\"><\/path>\n\n          <path class=\"cbpa-case-scene-two__connection\" d=\"M500 325 C640 350 730 420 835 510\"><\/path>\n\n          <path class=\"cbpa-case-scene-two__connection\" d=\"M500 325 C500 410 500 500 500 590\"><\/path>\n        <\/svg>\n\n\n        <!-- M\u00f2duls del projecte -->\n        <article class=\"cbpa-case-scene-two__module cbpa-case-scene-two__module--architecture\" data-scene-two-module=\"\">\n          <span class=\"cbpa-case-scene-two__module-number\">01<\/span>\n\n          <div>\n            <span class=\"cbpa-case-scene-two__module-label\">\n  Structure\n            <\/span>\n\n            <h3>Web architecture<\/h3>\n\n            <p>\n  Page hierarchy, navigation, and content organization.\n            <\/p>\n          <\/div>\n        <\/article>\n\n\n        <article class=\"cbpa-case-scene-two__module cbpa-case-scene-two__module--experience\" data-scene-two-module=\"\">\n          <span class=\"cbpa-case-scene-two__module-number\">02<\/span>\n\n          <div>\n            <span class=\"cbpa-case-scene-two__module-label\">\n  Experience\n            <\/span>\n\n            <h3>Visual interface<\/h3>\n\n            <p>\n  A clear, immersive experience adapted to every device.\n            <\/p>\n          <\/div>\n        <\/article>\n\n\n        <article class=\"cbpa-case-scene-two__module cbpa-case-scene-two__module--content\" data-scene-two-module=\"\">\n          <span class=\"cbpa-case-scene-two__module-number\">03<\/span>\n\n          <div>\n            <span class=\"cbpa-case-scene-two__module-label\">\n  Content\n            <\/span>\n\n            <h3>Digital narrative<\/h3>\n\n            <p>\n  Information transformed into easy-to-understand visual journeys.\n            <\/p>\n          <\/div>\n        <\/article>\n\n\n        <article class=\"cbpa-case-scene-two__module cbpa-case-scene-two__module--seo\" data-scene-two-module=\"\">\n          <span class=\"cbpa-case-scene-two__module-number\">04<\/span>\n\n          <div>\n            <span class=\"cbpa-case-scene-two__module-label\">\n  Visibility\n            <\/span>\n\n            <h3>Technical SEO<\/h3>\n\n            <p>\n  Semantic structure, performance, and content ready to rank.\n            <\/p>\n          <\/div>\n        <\/article>\n\n\n        <article class=\"cbpa-case-scene-two__module cbpa-case-scene-two__module--performance\" data-scene-two-module=\"\">\n          <span class=\"cbpa-case-scene-two__module-number\">05<\/span>\n\n          <div>\n            <span class=\"cbpa-case-scene-two__module-label\">\n  Technology\n            <\/span>\n\n            <h3>Performance<\/h3>\n\n            <p>\n  Modular components, optimized loading, and scalable maintenance.\n            <\/p>\n          <\/div>\n        <\/article>\n\n\n        <!-- Estat inferior -->\n        <div class=\"cbpa-case-scene-two__system-status\">\n\n          <span class=\"cbpa-case-scene-two__status-dot\" aria-hidden=\"true\"><\/span>\n\n           <span>\n 5 connected systems\n          <\/span>\n\n          <span class=\"cbpa-case-scene-two__status-separator\" aria-hidden=\"true\"><\/span>\n\n          <span>\n 1 coherent experience\n          <\/span> \n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n<section class=\"cbpa-case-scene-three\" id=\"cbpa-case-result\">\n\n  <div class=\"cbpa-case-scene-three__ambient\" aria-hidden=\"true\">\n    <span class=\"cbpa-case-scene-three__glow cbpa-case-scene-three__glow--one\"><\/span>\n    <span class=\"cbpa-case-scene-three__glow cbpa-case-scene-three__glow--two\"><\/span>\n    <span class=\"cbpa-case-scene-three__grid\"><\/span>\n  <\/div>\n\n  <div class=\"cbpa-case-scene-three__container\">\n\n    <!-- INTRODUCCI\u00d3 -->\n    <header class=\"cbpa-case-scene-three__header\">\n\n      <div class=\"cbpa-case-scene-three__status\">\n        <span class=\"cbpa-case-scene-three__status-dot\"><\/span>\n Project implemented\n      <\/div>\n\n      <p class=\"cbpa-case-scene-three__eyebrow\">\n Final result\n      <\/p>\n\n      <h2 class=\"cbpa-case-scene-three__title\">\n A new digital architecture\n        <span>ready to grow.<\/span>\n      <\/h2>\n\n      <p class=\"cbpa-case-scene-three__lead\">\n The project transforms the Costa Brava Parc Aventura digital experience into a visual, structured, and scalable system,\n designed to connect every activity with its audience.\n\n      <\/p>\n\n    <\/header>\n\n    <!-- RESULTATS -->\n    <div class=\"cbpa-case-scene-three__results\">\n\n      <article class=\"cbpa-case-scene-three__result\">\n\n        <span class=\"cbpa-case-scene-three__result-number\">\n  01\n        <\/span>\n\n        <div class=\"cbpa-case-scene-three__result-content\">\n          <span class=\"cbpa-case-scene-three__result-label\">\n  Experience\n          <\/span>\n\n          <h3>\n Clear and visual navigation\n          <\/h3>\n\n          <p>\n A structure that allows users to discover circuits,\n activities, rates, and essential information with\n a coherent experience on any device.\n          <\/p>\n        <\/div>\n\n      <\/article>\n\n      <article class=\"cbpa-case-scene-three__result\">\n\n        <span class=\"cbpa-case-scene-three__result-number\">\n  02\n        <\/span>\n\n        <div class=\"cbpa-case-scene-three__result-content\">\n          <span class=\"cbpa-case-scene-three__result-label\">\n System\n          <\/span>\n\n          <h3>\n Modular architecture\n          <\/h3>\n\n          <p>\n Each page is part of a reusable system\n that facilitates the expansion of content, activities,\n languages, and future functionalities.\n          <\/p>\n        <\/div>\n\n      <\/article>\n\n      <article class=\"cbpa-case-scene-three__result\">\n\n        <span class=\"cbpa-case-scene-three__result-number\">\n  03\n        <\/span>\n\n        <div class=\"cbpa-case-scene-three__result-content\">\n          <span class=\"cbpa-case-scene-three__result-label\">\n Positioning\n          <\/span>\n\n          <h3>\n SEO-ready foundation\n          <\/h3>\n\n          <p>\n Content hierarchies, specific pages, and\n a technical structure oriented towards improving the\n organic visibility of the project.\n          <\/p>\n        <\/div>\n\n      <\/article>\n\n    <\/div>\n\n    <!-- SISTEMA CONSTRU\u00cfT -->\n    <div class=\"cbpa-case-scene-three__system\">\n\n      <div class=\"cbpa-case-scene-three__system-header\">\n\n        <div>\n          <span class=\"cbpa-case-scene-three__system-kicker\">\n System deployed\n          <\/span>\n\n          <h3>\n Connected pieces within a single experience.\n          <\/h3>\n        <\/div>\n\n        <span class=\"cbpa-case-scene-three__system-state\">\n ONLINE\n        <\/span>\n\n      <\/div>\n\n      <div class=\"cbpa-case-scene-three__modules\">\n\n        <div class=\"cbpa-case-scene-three__module\">\n           <span class=\"cbpa-case-scene-three__module-icon\">\n UI\n          <\/span>\n          <span>Visual interface<\/span>\n        <\/div>\n\n        <div class=\"cbpa-case-scene-three__module\">\n           <span class=\"cbpa-case-scene-three__module-icon\">\n UX\n          <\/span>\n          <span>User experience<\/span>\n        <\/div>\n\n        <div class=\"cbpa-case-scene-three__module\">\n           <span class=\"cbpa-case-scene-three__module-icon\">\n SEO\n          <\/span>\n          <span>Content architecture<\/span>\n        <\/div>\n\n        <div class=\"cbpa-case-scene-three__module\">\n           <span class=\"cbpa-case-scene-three__module-icon\">\n CMS\n          <\/span>\n          <span>Modular management<\/span>\n        <\/div>\n\n        <div class=\"cbpa-case-scene-three__module\">\n           <span class=\"cbpa-case-scene-three__module-icon\">\n 4\u00d7\n          <\/span>\n          <span>Multilingual experience<\/span>\n        <\/div>\n\n        <div class=\"cbpa-case-scene-three__module\">\n           <span class=\"cbpa-case-scene-three__module-icon\">\n \u2197\n          <\/span>\n          <span>Scalable system<\/span>\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n    <!-- TANCAMENT -->\n    <footer class=\"cbpa-case-scene-three__footer\">\n\n      <div class=\"cbpa-case-scene-three__footer-copy\">\n\n        <span class=\"cbpa-case-scene-three__footer-label\">\n From concept to digital system\n        <\/span>\n\n        <h3>\n We build projects that can continue to evolve.\n        <\/h3>\n\n      <\/div>\n\n      <a class=\"cbpa-case-scene-three__cta\" href=\"https:\/\/www.bitb.cat\/contact\/\" target=\"_blank\" rel=\"noopener noreferrer\">\n        <span>Start a conversation<\/span>\n\n        <svg viewbox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n          <path d=\"M7 17L17 7M9 7h8v8\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n        <\/svg>\n      <\/a>\n\n    <\/footer>\n\n  <\/div>\n\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>> costa-brava-experience.js building \u2318 main Initializing experience Digital Case Study A new digital experience for Costa Brava Parc Aventura Web redesign, digital architecture, and visual experience built from scratch to transform a complex offering into a clear, attractive, and growth-ready system. Project Digital Redesign Scope Web \u00b7 UX \u00b7 SEO Status System Deployed Explore the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2700","page","type-page","status-publish","hentry"],"blocksy_meta":[],"featured_image_src":null,"_links":{"self":[{"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/pages\/2700","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/comments?post=2700"}],"version-history":[{"count":8,"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/pages\/2700\/revisions"}],"predecessor-version":[{"id":2877,"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/pages\/2700\/revisions\/2877"}],"wp:attachment":[{"href":"https:\/\/costabravaparcaventura.com\/en\/wp-json\/wp\/v2\/media?parent=2700"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}