SONAR and the TransferCalc landing page: explaining products through focused experiences.
Independent portfolio work and product development. Demonstration content is identified for each project; no client results are claimed.
Landing pages
SONAR
A product landing page for a headphone concept brand. Scroll-led imagery, colour choices and interactive unboxing create a coherent product story.
Screenshots show the English project version.
Watch project film · SONAR
Implemented features
Three colour options, detailed image zoom and interactive product hotspots.
Animated unboxing, service cards and a controllable audio visualisation.
Demonstration cart and checkout carrying the product selection through the journey.
Technology
HTML / CSSJavaScriptWeb Audio API
Project scope
Fictional product brand and standalone frontend project. Prices and checkout are illustrative. No real orders, payments or email delivery; no completed WordPress integration.
A bilingual product landing page that explains TransferCalc through feature tabs, actual software screenshots and an interactive fare example.
Screenshots show the English project version.
Watch project film · TransferCalc · Landingpage
Implemented features
German and English content with selectable use cases and feature tabs.
Real software screenshots, enlarged imagery and a clear workflow explanation.
An illustrative fare example, technical requirements and a direct path to the product.
Technology
WordPressPHPJavaScriptHTML / CSS
Project scope
Independent design and implementation of the product landing page. The fare example demonstrates the workflow with sample data. Software features and requirements are explained on the separate TransferCalc product page.
