Página de inicio del sitio web de Renetik Music Apps que presenta la familia de productos Android actual.

Sitio web de Renetik Music Apps

Una plataforma de producto, documentación y soporte que diseñé y construí con VuePress, Vue, TypeScript y Vite.

Cliente
Renetik — producto independiente
Rol
Diseñador de producto, diseñador web, diseñador de contenidos e ingeniero frontend
Compromiso
marzo de 2021 – Presente
VuePress 2Vue 3TypeScriptViteNode.js

Diseñé y construí el sitio web de Music Apps como la capa de producto pública para toda la familia de aplicaciones. Creé su lenguaje visual, arquitectura de información, navegación, estructura de página responsiva, presentación de producto, enfoque de documentación y contenido en lugar de implementar un diseño suministrado.

El sitio es una aplicación independiente de VuePress 2 construida con Vue 3, TypeScript, Vite, Node.js, el tema Hope, diseños y componentes personalizados de Vue, y una capa de SCSS adaptada. Markdown y frontmatter estructurado permiten que las páginas de productos, guías de funciones, tutoriales, capturas de pantalla, reseñas y acciones de la tienda sean mantenibles sin codificar cada página de forma rígida.

Medios WebP optimizados, galerías a pantalla completa, soporte de video, búsqueda, rutas de exploración (breadcrumbs), páginas de soporte y privacidad convierten al sitio tanto en un escaparate de productos como en una guía de usuario práctica. La compilación también gestiona análisis, URL canónicas, metadatos sociales, mapas del sitio, redireccionamientos y una experiencia 404 específica del producto.

Integré el sitio generado debajo de /app/ en el lanzamiento combinado de renetik.com. El Portfolio orquesta y verifica el artefacto final, mientras que los repositorios web de Music Apps y Portfolio mantienen historiales independientes, haciendo que el límite sea explícito sin duplicar el código fuente del sitio web.

Puntos clave

Identidad de producto, UX, diseño web responsivo, arquitectura de información y contenido creados por mí.
VuePress 2, Vue 3, TypeScript, Vite, Node.js, componentes personalizados de Vue y SCSS.
Markdown estructurado y frontmatter potencian páginas reutilizables de productos, funciones, tutoriales y soporte.
Galerías WebP optimizadas, video, búsqueda, navegación, documentación y rutas de conversión para Google Play.
SEO canónico, vistas previas sociales, análisis, mapas del sitio, redireccionamientos, páginas de privacidad y comportamiento personalizado para errores 404.
Las verificaciones de lanzamiento automatizadas validan 49 páginas HTML generadas y el contrato de despliegue combinado /app/.