457 lines
17 KiB
Plaintext
457 lines
17 KiB
Plaintext
---
|
|
import SectionIntro from "../components/SectionIntro.astro";
|
|
import SiteFooter from "../components/SiteFooter.astro";
|
|
import BaseLayout from "../layouts/BaseLayout.astro";
|
|
|
|
const valuePoints = [
|
|
{
|
|
title: "Menos fragmentación técnica",
|
|
description:
|
|
"Desarrollo, infraestructura y operación se abordan como un solo frente técnico."
|
|
},
|
|
{
|
|
title: "Control técnico directo",
|
|
description:
|
|
"Existe criterio técnico continuo desde el diseño hasta la operación."
|
|
},
|
|
{
|
|
title: "Continuidad operativa real",
|
|
description:
|
|
"La solución considera despliegue, soporte, seguridad base y operación posterior."
|
|
},
|
|
{
|
|
title: "Proporción y criterio",
|
|
description:
|
|
"Cada arquitectura se define según el problema real, sin complejidad innecesaria."
|
|
}
|
|
];
|
|
|
|
const services = [
|
|
{
|
|
title: "Desarrollo de software a medida",
|
|
description:
|
|
"Sistemas internos, plataformas de gestión, portales operativos y aplicaciones web construidas para resolver procesos concretos."
|
|
},
|
|
{
|
|
title: "Infraestructura administrada",
|
|
description:
|
|
"Servidores, contenedores, despliegues, hosting, monitoreo base y componentes de soporte administrados con continuidad técnica."
|
|
},
|
|
{
|
|
title: "Correo corporativo y operación digital",
|
|
description:
|
|
"Configuración y soporte de correo, dominios, flujos operativos y herramientas necesarias para una operación ordenada."
|
|
},
|
|
{
|
|
title: "Automatización e integración",
|
|
description:
|
|
"Integración entre software, dispositivos, sensores y procesos físicos cuando la operación requiere más que una interfaz web."
|
|
}
|
|
];
|
|
|
|
const projectTypes = [
|
|
"Sistemas internos para operación, inventario, atención o gestión.",
|
|
"Migración desde procesos manuales o herramientas dispersas.",
|
|
"Infraestructura para alojar y operar servicios con mayor control.",
|
|
"Correo corporativo y ordenamiento técnico base para empresas.",
|
|
"Automatización de tareas, suscripciones, pagos o flujos operativos.",
|
|
"Integración de hardware, controladores o automatización física."
|
|
];
|
|
|
|
const principles = [
|
|
{
|
|
step: "01",
|
|
title: "Levantamiento y criterio inicial",
|
|
description:
|
|
"Se define el problema real, el impacto operativo y el alcance necesario antes de elegir herramientas o arquitectura."
|
|
},
|
|
{
|
|
step: "02",
|
|
title: "Diseño proporcional",
|
|
description:
|
|
"La solución se plantea según tamaño, riesgo y continuidad requerida, evitando sobrediseño y decisiones difíciles de mantener."
|
|
},
|
|
{
|
|
step: "03",
|
|
title: "Implementación con orden",
|
|
description:
|
|
"Desarrollo, despliegue, configuración e integración se ejecutan con trazabilidad y foco en estabilidad técnica."
|
|
},
|
|
{
|
|
step: "04",
|
|
title: "Operación y continuidad",
|
|
description:
|
|
"Se considera soporte, mantenimiento, ajustes y seguimiento para que lo entregado siga siendo útil durante la operación."
|
|
}
|
|
];
|
|
|
|
const coverage = [
|
|
"Desarrollo web y sistemas internos",
|
|
"Infraestructura administrada y despliegue",
|
|
"Correo corporativo y dominios",
|
|
"Automatización de procesos",
|
|
"Integración con servicios externos",
|
|
"Operación técnica y mantenimiento",
|
|
"Monitoreo base y continuidad",
|
|
"Coordinación directa en modalidad remota"
|
|
];
|
|
|
|
const stackTools = [
|
|
{
|
|
name: "Cloudflare",
|
|
icon: "https://cdn.jsdelivr.net/gh/selfhst/icons@main/png/cloudflare.png"
|
|
},
|
|
{
|
|
name: "Docker",
|
|
icon: "https://cdn.jsdelivr.net/gh/selfhst/icons@main/png/docker.png"
|
|
},
|
|
{
|
|
name: "Coolify",
|
|
icon: "https://cdn.jsdelivr.net/gh/selfhst/icons@main/png/coolify.png"
|
|
},
|
|
{
|
|
name: "Mailcow",
|
|
icon: "https://cdn.jsdelivr.net/gh/selfhst/icons@main/png/mailcow.png"
|
|
},
|
|
{
|
|
name: "Forgejo",
|
|
icon: "https://cdn.jsdelivr.net/gh/selfhst/icons@main/png/forgejo.png"
|
|
}
|
|
];
|
|
|
|
const whenFits = [
|
|
"Cuando el proyecto requiere desarrollo y también operación posterior.",
|
|
"Cuando hoy existen varios proveedores sin una responsabilidad técnica clara.",
|
|
"Cuando se necesita infraestructura, correo o automatización además del software.",
|
|
"Cuando conviene resolver bien el problema sin sobredimensionar la solución."
|
|
];
|
|
|
|
const avoids = [
|
|
"Fragmentación entre desarrollo, infraestructura y soporte.",
|
|
"Improvisación técnica durante implementación y despliegue.",
|
|
"Dependencias dispersas entre múltiples actores sin contexto.",
|
|
"Falta de continuidad después de la entrega inicial."
|
|
];
|
|
---
|
|
|
|
<BaseLayout
|
|
title="Slaksis Chile SpA | Desarrollo, infraestructura y continuidad operativa"
|
|
description="Slaksis Chile SpA desarrolla, implementa y opera soluciones digitales e infraestructura para empresas y organizaciones."
|
|
>
|
|
<main class="landing">
|
|
<section class="hero" id="inicio">
|
|
<div class="container hero__inner">
|
|
<header class="site-header" data-reveal>
|
|
<a class="brand" href="#inicio" aria-label="Ir al inicio de Slaksis Chile SpA">
|
|
<span class="brand__mark">SL</span>
|
|
<span class="brand__text">
|
|
<strong>Slaksis Chile SpA</strong>
|
|
<small>Soluciones digitales e infraestructura</small>
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="site-nav" aria-label="Navegación principal">
|
|
<a href="#servicios">Servicios</a>
|
|
<a href="#enfoque">Enfoque</a>
|
|
<a href="#cobertura">Cobertura</a>
|
|
<a href="#contacto">Contacto</a>
|
|
</nav>
|
|
|
|
<a class="header-mail" href="mailto:contacto@slaksis.com">contacto@slaksis.com</a>
|
|
</header>
|
|
|
|
<div class="hero__grid">
|
|
<div class="hero__content" data-reveal>
|
|
<p class="eyebrow">Desarrollo, infraestructura y operación técnica para empresas y organizaciones</p>
|
|
<h1>Una solución bien implementada también debe estar bien operada.</h1>
|
|
<p class="hero__lead">
|
|
Slaksis Chile SpA diseña, implementa y sostiene soluciones digitales con criterio técnico directo. El
|
|
alcance incluye desarrollo, infraestructura, correo, automatización y continuidad operativa.
|
|
</p>
|
|
|
|
<div class="hero__actions">
|
|
<a class="button button--primary" href="mailto:contacto@slaksis.com?subject=Solicitud%20de%20propuesta">
|
|
Solicitar propuesta
|
|
</a>
|
|
<a class="button button--secondary" href="mailto:contacto@slaksis.com?subject=Agendar%20reuni%C3%B3n">
|
|
Agendar reunión
|
|
</a>
|
|
</div>
|
|
|
|
<p class="hero__microcopy">
|
|
Modalidad remota con coordinación directa, alcance claro y ejecución ordenada.
|
|
</p>
|
|
</div>
|
|
|
|
<aside class="hero__aside" aria-label="Resumen institucional" data-reveal>
|
|
<p class="aside__label">Contacto institucional</p>
|
|
<a class="aside__mail" href="mailto:contacto@slaksis.com">contacto@slaksis.com</a>
|
|
<p class="aside__body">
|
|
Canal para evaluación de requerimientos, propuesta y coordinación inicial.
|
|
</p>
|
|
|
|
<dl class="aside__details">
|
|
<div>
|
|
<dt>Modalidad</dt>
|
|
<dd>Trabajo remoto con coordinación directa</dd>
|
|
</div>
|
|
<div>
|
|
<dt>Alcance</dt>
|
|
<dd>Desarrollo, infraestructura y operación</dd>
|
|
</div>
|
|
<div>
|
|
<dt>Enfoque</dt>
|
|
<dd>Soluciones proporcionales y continuidad real</dd>
|
|
</div>
|
|
</dl>
|
|
</aside>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section--light" aria-labelledby="propuesta-title">
|
|
<div class="container">
|
|
<SectionIntro
|
|
eyebrow="Propuesta de valor"
|
|
titleId="propuesta-title"
|
|
title="Cuando el desarrollo y la operación técnica quedan separados, la solución pierde continuidad."
|
|
body="Slaksis aborda el proyecto como un sistema completo: diseño, implementación, despliegue y soporte técnico alineados en un mismo frente de trabajo."
|
|
/>
|
|
|
|
<div class="value-grid">
|
|
{valuePoints.map((item) => (
|
|
<article class="info-card" data-reveal>
|
|
<h3>{item.title}</h3>
|
|
<p>{item.description}</p>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section" id="servicios" aria-labelledby="servicios-title">
|
|
<div class="container">
|
|
<SectionIntro
|
|
eyebrow="Servicios principales"
|
|
titleId="servicios-title"
|
|
title="Capacidades para resolver desarrollo, infraestructura y operación sin fragmentar la responsabilidad técnica."
|
|
body="El objetivo es que la solución funcione durante la operación diaria, no solo durante la entrega."
|
|
/>
|
|
|
|
<div class="service-grid">
|
|
{services.map((service) => (
|
|
<article class="service-card" data-reveal>
|
|
<h3>{service.title}</h3>
|
|
<p>{service.description}</p>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section--tint" aria-labelledby="proyectos-title">
|
|
<div class="container">
|
|
<SectionIntro
|
|
eyebrow="Qué tipo de proyectos atendemos"
|
|
titleId="proyectos-title"
|
|
title="Proyectos donde se necesita criterio técnico, orden de implementación y responsabilidad operativa."
|
|
body="La cobertura incluye iniciativas puntuales y entornos donde hace falta ordenar componentes técnicos que hoy funcionan de forma dispersa."
|
|
/>
|
|
|
|
<div class="project-grid">
|
|
{projectTypes.map((project) => (
|
|
<article class="project-item" data-reveal>
|
|
<p>{project}</p>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section" id="enfoque" aria-labelledby="enfoque-title">
|
|
<div class="container">
|
|
<SectionIntro
|
|
eyebrow="Forma de trabajo"
|
|
titleId="enfoque-title"
|
|
title="Implementación ordenada, decisiones claras y continuidad después de la entrega."
|
|
body="Cada proyecto se aborda con una secuencia simple y defendible, para mantener control técnico durante todo el proceso."
|
|
/>
|
|
|
|
<ol class="process-grid">
|
|
{principles.map((principle) => (
|
|
<li class="process-card" data-reveal>
|
|
<span class="process-card__step">{principle.step}</span>
|
|
<h3>{principle.title}</h3>
|
|
<p>{principle.description}</p>
|
|
</li>
|
|
))}
|
|
</ol>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section--light" aria-labelledby="cuando-title">
|
|
<div class="container">
|
|
<SectionIntro
|
|
eyebrow="Cuándo Tiene Sentido Trabajar Con Slaksis"
|
|
titleId="cuando-title"
|
|
title="Encaja especialmente cuando el proyecto necesita ejecución técnica y continuidad en un mismo frente."
|
|
body="No es un servicio pensado solo para publicar una página. Aplica mejor cuando hay operación, infraestructura o soporte que resolver con criterio."
|
|
/>
|
|
|
|
<div class="simple-grid">
|
|
{whenFits.map((item) => (
|
|
<article class="simple-card" data-reveal>
|
|
<p>{item}</p>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section--tint" aria-labelledby="evitamos-title">
|
|
<div class="container">
|
|
<SectionIntro
|
|
eyebrow="Lo que evitamos"
|
|
titleId="evitamos-title"
|
|
title="Una solución sólida también se define por los problemas técnicos que evita."
|
|
body="La implementación busca reducir desorden operativo, pérdida de contexto y dependencia innecesaria de múltiples actores."
|
|
/>
|
|
|
|
<div class="simple-grid">
|
|
{avoids.map((item) => (
|
|
<article class="simple-card simple-card--strong" data-reveal>
|
|
<p>{item}</p>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section--light" id="cobertura" aria-labelledby="cobertura-title">
|
|
<div class="container coverage">
|
|
<div class="coverage__content" data-reveal>
|
|
<p class="eyebrow">Cobertura técnica</p>
|
|
<h2 id="cobertura-title">No solo se desarrolla software. También se implementa, se configura y se sostiene.</h2>
|
|
<p>
|
|
Slaksis puede participar en los componentes que normalmente quedan dispersos entre varios actores. Eso reduce
|
|
pérdida de contexto y mejora la continuidad técnica.
|
|
</p>
|
|
|
|
<article class="backup-note">
|
|
<img
|
|
class="backup-note__icon"
|
|
src="https://cdn.jsdelivr.net/gh/selfhst/icons@main/png/cloudflare.png"
|
|
alt="Cloudflare"
|
|
loading="lazy"
|
|
width="40"
|
|
height="40"
|
|
/>
|
|
<div>
|
|
<strong>Respaldos con Cloudflare R2</strong>
|
|
<p>Se pueden implementar backups sobre Cloudflare R2 para reforzar continuidad, resguardo y recuperación.</p>
|
|
</div>
|
|
</article>
|
|
|
|
<div class="stack-tools" data-reveal>
|
|
<p class="stack-tools__label">Stack operativo habitual</p>
|
|
<div class="stack-tools__grid">
|
|
{stackTools.map((tool) => (
|
|
<div class="stack-tool">
|
|
<img src={tool.icon} alt={tool.name} loading="lazy" width="32" height="32" />
|
|
<span>{tool.name}</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="coverage__list">
|
|
{coverage.map((item) => (
|
|
<li class="coverage__item" data-reveal>{item}</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section" aria-labelledby="institucional-title">
|
|
<div class="container institutional">
|
|
<article class="institutional__block" data-reveal>
|
|
<p class="eyebrow">Perfil institucional</p>
|
|
<h2 id="institucional-title">Un solo frente técnico para proyectos que necesitan continuidad, seguridad y criterio.</h2>
|
|
<p>
|
|
La propuesta de Slaksis es trabajar con responsabilidad sobre lo implementado: revisar alcance, diseñar con
|
|
proporción, ejecutar con orden y mantener capacidad de respuesta durante la operación.
|
|
</p>
|
|
<p class="institutional__note">El proyecto no queda bloqueado. El código es del cliente.</p>
|
|
</article>
|
|
|
|
<article class="institutional__block institutional__block--accent" data-reveal>
|
|
<p class="eyebrow">Dirección</p>
|
|
<h2>Gabriel Rojas</h2>
|
|
<p>
|
|
Gerente General de Slaksis Chile SpA. Formación en Ingeniería Civil en Computación y experiencia aplicada en
|
|
desarrollo de software, infraestructura administrada y ciberseguridad.
|
|
</p>
|
|
<p class="institutional__note">
|
|
Modalidad de trabajo principalmente remota, con coordinación directa y foco en requerimientos bien definidos.
|
|
</p>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section--cta" id="contacto" aria-labelledby="contacto-title">
|
|
<div class="container cta">
|
|
<div class="cta__intro" data-reveal>
|
|
<p class="eyebrow">Contacto</p>
|
|
<h2 id="contacto-title">Si el proyecto requiere evaluación técnica seria, el siguiente paso es revisar alcance y contexto operativo.</h2>
|
|
<p>
|
|
La primera conversación sirve para entender requerimientos, riesgos y nivel de soporte necesario.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="cta__panel" data-reveal>
|
|
<a class="cta__mail" href="mailto:contacto@slaksis.com">contacto@slaksis.com</a>
|
|
<p>
|
|
Correo institucional para evaluación de proyecto, propuesta inicial y coordinación de reunión.
|
|
</p>
|
|
|
|
<div class="cta__actions">
|
|
<a class="button button--light" href="mailto:contacto@slaksis.com?subject=Solicitud%20de%20propuesta">
|
|
Solicitar evaluación de proyecto
|
|
</a>
|
|
<a class="button button--light-outline" href="mailto:contacto@slaksis.com?subject=Agendar%20reuni%C3%B3n">
|
|
Agendar reunión
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<SiteFooter />
|
|
|
|
<script is:inline>
|
|
document.documentElement.classList.add("js");
|
|
|
|
const elements = document.querySelectorAll("[data-reveal]");
|
|
const observer = new IntersectionObserver(
|
|
(entries) => {
|
|
for (const entry of entries) {
|
|
if (entry.isIntersecting) {
|
|
entry.target.classList.add("is-visible");
|
|
observer.unobserve(entry.target);
|
|
}
|
|
}
|
|
},
|
|
{
|
|
threshold: 0.14,
|
|
rootMargin: "0px 0px -10% 0px"
|
|
}
|
|
);
|
|
|
|
for (const element of elements) {
|
|
observer.observe(element);
|
|
}
|
|
</script>
|
|
</BaseLayout>
|