Merge pull request #181 from odracirdev/i18n-ripley

I18n ripley

src/locales/en/common.json

@@ -126,5 +126,31 @@
   "planogram_process_analysis_title": "Analysis",
   "planogram_process_analysis_desc": "In general, many valuable insights were obtained from the different types of users, we spent about 3 days to collect everything, analyze in detail and find the patterns that would be the main indicators to start prioritizing the first MVP in terms of design.",
   "planogram_process_mvp_desc": "Once it was clear what were the main pains and opportunities for improvement for the users, it was necessary to have a session with the entire development team and product owner to ensure that the functionalities of the first MVP are really feasible within the time limit, and that they bring value to the business.",
-  "planogram_designs_desc": "The entire process of sending planograms, implementation and notification that the task was completed by the stores was digitized, it was a very dense and challenging flow that had to be considered as well as the devices on which each user had to access, which had to be fast and intuitive."
+  "planogram_designs_desc": "The entire process of sending planograms, implementation and notification that the task was completed by the stores was digitized, it was a very dense and challenging flow that had to be considered as well as the devices on which each user had to access, which had to be fast and intuitive.",
+  "ripley_hero_title": "Time deposit",
+  "ripley_hero_desc": "The need for a study related to DAP arose, because the flow at that time was functional but had some issues both in desktop and mobile usability and some points of improvement of the front end by the system as the overlapping of components.",
+  "ripley_hero_methodology_desc": "Double diamond",
+  "ripley_hero_time_desc": "1 month",
+  "ripley_hero_device_desc": "Desktop & mobile",
+  "ripley_context_title": "Importance",
+  "ripley_context_desc": "Inquiring about some KPIs, it was learned that on average in the year 2022 86% were online users. In DAP more than 1900 transactions were generated monthly on average, which translated into a large amount of money for the bank, in that year there was an increase in customer investments, which shows the contribution that this product makes to the bank.",
+  "ripley_benchmarks_desc": "Due to time and scope, it was decided to perform two benchmarks evaluating direct competition.",
+  "ripley_benchmarks_banks_numb": "No. of banks studied",
+  "ripley_benchmarks_obj_1_desc": "Map how the competition addresses this flow at a general level in architecture, prioritization, how information is displayed and what components and visual resources they use.",
+  "ripley_benchmarks_obj_2_desc": "Study how the competition provides the user with comparative information when simulating between different investment terms and whether these terms are predefined or not.",
+  "ripley_criterios_title": "Evaluation criteria",
+  "ripley_criterios_1": "1. Number of steps",
+  "ripley_criterios_2": "2. Prioritization and information saturation",
+  "ripley_criterios_3": "3. Flow definition, simulation and contracting",
+  "ripley_criterios_4": "4. Origin and destination of the product",
+  "ripley_criterios_5": "5. Comparison of terms",
+  "ripley_criterios_6": "6. Content level",
+  "ripley_criterios_NPS_desc": "The NPS status was reviewed to reveal what aspects customers value or dissatisfy, thus guiding improvements directly to what most impacts their satisfaction. Based on feedback indicated by detractors and some liabilities we sought to incorporate the option of renewable WTP to further improve flow, as for those users who wanted to have prolonged investments over time did not have this option available.",
+  "ripley_analysis_title": "Final analysis",
+  "ripley_analysis_1": "The competition maintains at least two layers of information, the first with a history of the DAPs in cards with the minimum necessary information and the second layer with the detail.",
+  "ripley_analysis_2": "The current account was recently integrated as an option for the origin of the investment to be made. Previously, only a customer with a demand account could make a time deposit.",
+  "ripley_analysis_3": "The user is notified by e-mail when the automatic renewal is done and a detailed document with the renewal conditions is sent.",
+  "ripley_analysis_4": "",
+  "ripley_designs_title": "Designs",
+  "ripley_designs_desc": "After a process of empathizing and defining opportunities for improvement, the entire flow was refreshed, and additional new functionalities were added to further optimize this flow, which was then tested to ensure its usability and implement it for development."
 }

src/locales/es/common.json

@@ -126,5 +126,31 @@
   "planogram_process_analysis_title": "Análisis",
   "planogram_process_analysis_desc": "A nivel general se obtuvieron muchos insights muy valioso de parte de los diferentes tipos de usuarios, se dedicaron unos 3 días para recopilar todo, analizar detalladamente y encontrar los patrones que serian los indicadores principales para comenzar a priorizar el primer MVP en cuanto a diseño.",
   "planogram_process_mvp_desc": "Ya teniendo claro cuáles eran los principales dolores y oportunidades de mejora para los usuarios había que tener una sesión con todo el equipo de desarrollo y product owner para asegurar que las funcionalidades del primer MVP sean realmente factibles dentro del tiempo límite, y que aporten valor al negocio.",
-  "planogram_designs_desc": "Se logró digitalizar todo el proceso de envío de planogramas, implementación y notificación de que la tarea fue realizada por las tiendas, fue un flujo bastante denso y desafiante que había que considerar tambien los dispositivos en los que cada usuario debía acceder, que fuera rápido e intuitivo."
+  "planogram_designs_desc": "Se logró digitalizar todo el proceso de envío de planogramas, implementación y notificación de que la tarea fue realizada por las tiendas, fue un flujo bastante denso y desafiante que había que considerar tambien los dispositivos en los que cada usuario debía acceder, que fuera rápido e intuitivo.",
+  "ripley_hero_title": "Depósito a plazos",
+  "ripley_hero_desc": "Se levantó la necesidad de realizar un estudio relacionado a DAP, debido a que el flujo en ese momento era funcional pero tenia algunas incidencias tanto de usabilidad en desktop como en mobile y algunos puntos de mejora del front por parte del sistema como la superposición de componentes.",
+  "ripley_hero_methodology_desc": "Doble diamante",
+  "ripley_hero_time_desc": "1 mes",
+  "ripley_hero_device_desc": "Desktop y mobile",
+  "ripley_context_title": "Importancia",
+  "ripley_context_desc": "Indagando algunos KPI, se supo que en promedio en el año 2022 el 86% eran usuarios online. En DAP mensualmente se generaban más de 1900 transacciones en promedio, lo cual se traducía en una gran cantidad de dinero para el banco, en ese año había una alza en las inversiones de los clientes, lo cual muestra el aporte que hace este producto al banco.",
+  "ripley_benchmarks_desc": "Debido al tiempo y alcance, se definió realizar dos benchmarks evaluando competencia directa.",
+  "ripley_benchmarks_banks_numb": "Cant. de bancos estudiados",
+  "ripley_benchmarks_obj_1_desc": "Mapear cómo la competencia aborda este flujo a nivel general en arquitectura, priorización, forma de mostrar información y que componentes y recursos visuales utilizan.",
+  "ripley_benchmarks_obj_2_desc": "Estudiar cómo la competencia le facilita al usuario la información comparativa al momento de simular entre distintos plazos al invertir y si estos plazos vienen predefinidos o no.",
+  "ripley_criterios_title": "Criterios de evaluación",
+  "ripley_criterios_1": "1. Cantidad de pasos",
+  "ripley_criterios_2": "2. Priorización y saturación de información",
+  "ripley_criterios_3": "3. Definición de flujo, simulación y contratación",
+  "ripley_criterios_4": "4. Origen y destino del producto",
+  "ripley_criterios_5": "5. Comparación de plazos",
+  "ripley_criterios_6": "6. Nivel de contenidos",
+  "ripley_criterios_NPS_desc": "Se revisó el estado del NPS para revelar qué aspectos valoran o descontentan a los clientes, guiando así las mejoras directamente hacia lo que más impacta en su satisfacción. Según los comentarios que indican los detractores y algunos pasivos buscamos incorporar la opción de DAP renovable para mejorar aún más el flujo, ya que para aquellos usuarios que querían tener inversiones prolongadas en el tiempo no tenían esta opción disponible.",
+  "ripley_analysis_title": "Análisis final",
+  "ripley_analysis_1": "La competencia mantiene al menos dos capas de información, la primera con un historial de los DAPs en cards con la información mínima necesaria y la segunda capa con el detalle.",
+  "ripley_analysis_2": "Se integró recientemente cuenta corriente como opción de origen de la inversión a realizar. Antes sólo un cliente con cuenta vista podía realizar un depósito a plazo.",
+  "ripley_analysis_3": "Se le notifica al usuario por correo electrónico cuando se hace la renovación automática y se envía un documento detallado con las condiciones de la renovación.",
+  "ripley_analysis_4": "",
+  "ripley_designs_title": "Diseños",
+  "ripley_designs_desc": "Después de un proceso de empatizar y definir cuáles eras las oportunidades de mejora, se hizo un refrescamiento de todo el flujo, y adicional se agregaron nuevas funcionalidades para optimizar aún mas este flujo, posteriormente fue llevado a testeo para asegurar su usabilidad e implementarlo a desarrollo."
 }

src/pages/banco-ripley/_sections/Analysis.astro

@@ -1,38 +1,27 @@
 ---
 import { CardWrapper } from '@components';
+import { t } from 'i18n:astro';
 ---
 
 <div class="container">
-  <h2 class="section-title">Análisis final</h2>
+  <h2 class="section-title">{t('ripley_analysis_title')}</h2>
 
   <div class="grid-auto-fit">
     <CardWrapper class="card | flow">
       <h2 class="card-title">1</h2>
-      <p class="card-description">
-        La competencia mantiene al menos dos capas de información, la primera con un historial de
-        los DAPs en cards con la información mínima necesaria y la segunda capa con el detalle
-      </p>
+      <p class="card-description">{t('ripley_analysis_1')}</p>
     </CardWrapper>
     <CardWrapper class="card | flow">
       <h2 class="card-title">2</h2>
-      <p class="card-description">
-        Se integró recientemente cuenta corriente como opción de origen de la inversión a realizar.
-        Antes sólo un cliente con cuenta vista podía realizar un depósito a plazo.
-      </p>
+      <p class="card-description">{t('ripley_analysis_2')}</p>
     </CardWrapper>
     <CardWrapper class="card | flow">
       <h2 class="card-title">3</h2>
-      <p class="card-description">
-        Se le notifica al usuario por correo electrónico cuando se hace la renovación automática y
-        se envía un documento detallado con las condiciones de la renovación
-      </p>
+      <p class="card-description">{t('ripley_analysis_3')}</p>
     </CardWrapper>
     <CardWrapper class="card | flow">
       <h2 class="card-title">4</h2>
-      <p class="card-description">
-        Se le notifica al usuario por correo electrónico cuando se hace la renovación automática y
-        se envía un documento detallado con las condiciones de la renovación
-      </p>
+      <p class="card-description">{t('ripley_analysis_3')}</p>
     </CardWrapper>
   </div>
 </div>

src/pages/banco-ripley/_sections/Benchmarks.astro

@@ -1,38 +1,31 @@
 ---
 import { CardWrapper } from '@components';
+import { t } from 'i18n:astro';
 ---
 
 <section class="hero">
   <div class="container">
     <h2 class="section-title">Benchmarks</h2>
-    <p class="section-description">
-      Debido al tiempo y alcance, se definió realizar dos benchmarks evaluando competencia directa.
-    </p>
+    <p class="section-description">{t('ripley_benchmarks_desc')}</p>
 
     <!-- Container for the cards -->
     <div class="cards-container | grid-auto-fit">
       <!-- Card 1: Methodology used -->
       <CardWrapper class="card | flow">
-        <h2 class="card-title">Cant. de bancos estudiados</h2>
+        <h2 class="card-title">{t('ripley_benchmarks_banks_numb')}</h2>
         <span>8</span>
       </CardWrapper>
 
       <!-- Card 2: Time taken -->
       <CardWrapper class="card | flow">
-        <h2 class="card-title">Objetivo 1</h2>
-        <p class="subtitle">
-          Mapear cómo la competencia aborda este flujo a nivel general en arquitectura,
-          priorización, forma de mostrar información y que componentes y recursos visuales utilizan.
-        </p>
+        <h2 class="card-title">{t('planogram_context_obj_1')}</h2>
+        <p class="subtitle">{t('ripley_benchmarks_obj_1_desc')}</p>
       </CardWrapper>
 
       <!-- Card 3: Devices used -->
       <CardWrapper class="card | flow">
-        <h2 class="card-title">Objetivo 2</h2>
-        <p class="subtitle">
-          Estudiar cómo la competencia le facilita al usuario la información comparativa al momento
-          de simular entre distintos plazos al invertir y si estos plazos vienen predefinidos o no.
-        </p>
+        <h2 class="card-title">{t('planogram_context_obj_2')}</h2>
+        <p class="subtitle">{t('ripley_benchmarks_obj_2_desc')}</p>
       </CardWrapper>
     </div>
   </div>

src/pages/banco-ripley/_sections/Context.astro

@@ -1,14 +1,13 @@
+---
+import { t } from 'i18n:astro';
+---
+
 <section class="context">
   <div class="container flow">
-    <h2 class="title">Importancia</h2>
+    <h2 class="title">{t('ripley_context_title')}</h2>
 
     <!-- Section Description: Explanation of the problem and solution -->
-    <p class="description">
-      Indagando algunos KPI, se supo que en promedio en el año 2022 el 86% eran usuarios online. En
-      DAP mensualmente se generaban más de 1900 transacciones en promedio, lo cual se traducía en
-      una gran cantidad de dinero para el banco , en ese año había una alza de la inversiones de los
-      clientes, lo cual muestra el aporte que hace este producto al banco
-    </p>
+    <p class="description">{t('ripley_context_desc')}</p>
 
     <!-- Section Image: Illustrating the context -->
     <img

src/pages/banco-ripley/_sections/Criterios.astro

@@ -1,22 +1,22 @@
 ---
 import { CardWrapper } from '@components';
+import { t } from 'i18n:astro';
 ---
 
 <div class="container">
   <div class="evaluation-cards">
     <div class="grid-auto-fit">
       <!-- Card: Evaluation Criteria -->
       <CardWrapper class="evaluation-card | flow">
-        <h2 class="evaluation-card-title">Criterios de evaluación</h2>
+        <h2 class="evaluation-card-title">{t('ripley_criterios_title')}</h2>
 
         <ol class="evaluation-criteria flow">
-          <li>1. Cantidad de pasos</li>
-          <li>2. Priorización y saturación de información</li>
-          <li>3. Definición de flujo simulación y contratación</li>
-          <li>4. Origen y destino del producto</li>
-          <li>5. Comparación de plazos</li>
-          <li>6. Nivel de contenidos</li>
-          <li>7. Priorización y saturación de información</li>
+          <li>{t('ripley_criterios_1')}</li>
+          <li>{t('ripley_criterios_2')}</li>
+          <li>{t('ripley_criterios_3')}</li>
+          <li>{t('ripley_criterios_4')}</li>
+          <li>{t('ripley_criterios_5')}</li>
+          <li>{t('ripley_criterios_6')}</li>
         </ol>
       </CardWrapper>
 
@@ -34,14 +34,7 @@ import { CardWrapper } from '@components';
       <!-- Card: Identified Issues -->
       <div class="flow">
         <h2 class="title">NPS</h2>
-        <p class="description">
-          Se revisó el estado del NPS para revelar qué aspectos valoran o descontentan a los
-          clientes, guiando así las mejoras directamente hacia lo que más impacta en su
-          satisfacción. Según los comentarios que indican los detractores y algunos pasivos buscamos
-          incorporar la opción de DAP renovable para mejorar aún más el flujo, ya que para aquellos
-          usuarios que querían tener inversiones prolongadas en el tiempo no tenían esta opción
-          disponible
-        </p>
+        <p class="description">{t('ripley_criterios_NPS_desc')}</p>
       </div>
 
       <!-- Image: Explaining wireframes -->

src/pages/banco-ripley/_sections/Designs.astro

@@ -1,17 +1,12 @@
 ---
-
+import { t } from 'i18n:astro';
 ---
 
 <section>
   <div class="container">
     <div class="flow">
-      <h2 class="title">Diseños</h2>
-      <p class="description">
-        Después de un proceso de empatizar y definir cuáles eras las oportunidades de mejora, se
-        hizo un refrescamiento de todo el flujo, y adicional se agregaron nuevas funcionalidades
-        para optimizar aún mas este flujo, posteriormente fue llevado a testeo para asegurar su
-        usabilidad e implementarlo a desarrollo
-      </p>
+      <h2 class="title">{t('ripley_designs_title')}</h2>
+      <p class="description">{t('ripley_designs_desc')}</p>
 
       <img
         class="hide-mobile"

src/pages/banco-ripley/_sections/Hero.astro

@@ -1,37 +1,33 @@
 ---
 import { CardWrapper } from '@components';
+import { t } from 'i18n:astro';
 ---
 
 <section class="hero">
   <div class="container">
     <!-- Main logo of the case study -->
     <img src="/svg/banco-ripley-logo.svg" alt="Cencosud logo" class="main-logo" />
-    <h1 class="title">Depósito a plazo</h1>
-    <p class="description">
-      Se levantó la necesidad de realizar un estudio relacionado a DAP, debido a que el flujo en ese
-      momento era funcional pero tenia algunas incidencias tanto de usabilidad en desktop como en
-      mobile y algunos puntos de mejora del front por parte del sistema como la superposición de
-      componentes.
-    </p>
+    <h1 class="title">{t('ripley_hero_title')}</h1>
+    <p class="description">{t('ripley_hero_desc')}</p>
 
     <!-- Container for the cards -->
     <div class="cards-container | grid-auto-fit">
       <!-- Card 1: Methodology used -->
       <CardWrapper class="card" hasBorder>
-        <h2 class="card-title">Metodología</h2>
-        <p class="subtitle">Doble diamante</p>
+        <h2 class="card-title">{t('projects_hero_methodology_title')}</h2>
+        <p class="subtitle">{t('ripley_hero_methodology_desc')}</p>
       </CardWrapper>
 
       <!-- Card 2: Time taken -->
       <CardWrapper class="card" hasBorder>
-        <h2 class="card-title">Tiempo</h2>
-        <p class="subtitle">1 mes</p>
+        <h2 class="card-title">{t('projects_hero_time_title')}</h2>
+        <p class="subtitle">{t('ripley_hero_time_desc')}</p>
       </CardWrapper>
 
       <!-- Card 3: Devices used -->
       <CardWrapper class="card" hasBorder>
-        <h2 class="card-title">Dispositivos</h2>
-        <p class="subtitle">Desktop y mobile</p>
+        <h2 class="card-title">{t('projects_hero_device_title')}</h2>
+        <p class="subtitle">{t('ripley_hero_device_desc')}</p>
       </CardWrapper>
     </div>
   </div>

src/pages/banco-ripley/index.astro → src/routes/banco-ripley.astro

@@ -3,10 +3,17 @@ import { GradientBackground } from '@components';
 import { GradientColor } from 'components/GradientBackground/GradientBackground.astro';
 import Layout from '@layouts/Layout.astro';
 import Contact from '@pages/_Sections/Contact/Contact.astro';
-import { Analysis, Benchmarks, Context, Criterios, Designs, Hero } from './_sections';
+import {
+  Analysis,
+  Benchmarks,
+  Context,
+  Criterios,
+  Designs,
+  Hero,
+} from '../pages/banco-ripley/_sections';
 ---
 
-<Layout title="Ana Rangel | Latam Airlines">
+<Layout title="Ana Rangel | Banco Ripley">
   <main>
     <GradientBackground color={GradientColor.blue} />