Renetik Music Apps website homepage presenting the current Android product family.

Renetik Music Apps Website

A product, documentation, and support platform I designed and built with VuePress, Vue, TypeScript, and Vite.

Client
Renetik — independent product
Role
Product designer, web designer, content designer, and frontend engineer
Date
March 2021 – Present
VuePress 2Vue 3TypeScriptViteNode.js

I designed and built the Music Apps website as the public product layer for the complete application family. I created its visual language, information architecture, navigation, responsive page structure, product presentation, documentation approach, and content rather than implementing a supplied design.

The site is a separate VuePress 2 application built with Vue 3, TypeScript, Vite, Node.js, the Hope theme, custom Vue layouts and components, and a tailored SCSS layer. Markdown and structured frontmatter keep product pages, feature guides, tutorials, screenshots, reviews, and store actions maintainable without hard-coding each page.

Optimized WebP media, full-screen galleries, video support, search, breadcrumbs, support and privacy pages turn the site into both a product showcase and a practical user guide. The build also handles analytics, canonical URLs, social metadata, sitemaps, redirects, and a product-specific 404 experience.

I integrated the generated site below /app/ in the combined renetik.com release. The Portfolio orchestrates and verifies the final artifact while the Music Apps web and Portfolio repositories keep independent histories, making the boundary explicit without duplicating the website source.

Highlights

Product identity, UX, responsive web design, information architecture, and content created by me.
VuePress 2, Vue 3, TypeScript, Vite, Node.js, custom Vue components, and SCSS.
Structured Markdown and frontmatter power reusable product, feature, tutorial, and support pages.
Optimized WebP galleries, video, search, navigation, documentation, and Google Play conversion paths.
Canonical SEO, social previews, analytics, sitemaps, redirects, privacy pages, and custom 404 behavior.
Automated release checks validate 49 generated HTML pages and the combined /app/ deployment contract.