Showcase · Angular 21 · Motion · Booking UX
Höhenwerk
Rope Course Showcase
as a Complete System
A bilingual, pre-rendered rope course website with a distinct brand, scroll-driven film, course navigation, virtual assistant and fully simulated booking and voucher flows.
Höhenwerk is a fictional concept project by BTECH SOLUTIONS, not a client project or a real rope course park. The business name, location, prices and offers are fictional. Forms, bookings and voucher orders transmit no data and create no contract.
Technical quality (desktop test)
Lighthouse · Desktop · measured on 3 August 2026 · local production server · mobile


The page as a whole
The same page at three screen widths. Scroll — it moves along in all three.



From an industry pattern to a distinct brand
The project starts not with a template but with the decisions a visitor actually needs to make before arriving: height, courses, weather, price and admission time. This produced seventeen content pages in two languages and a brand that describes the Bergisches Land through workshop culture rather than adventure clichés.
A persistent notice identifies every route as a demo. The legal pages name BTECH SOLUTIONS as the operator and separate real responsibility from the fictional business details.



Content system, motion and technical SEO
All public content is pre-rendered. Canonicals, language alternatives, robots directives and structured data are generated centrally from the data model. The scroll film has a static reduced-motion version; the SVG forest uses compound paths to reduce DOM nodes.
- 42 pre-rendered DE/EN routes with unique titles, descriptions and H1 headings
- Nine film chapters with responsive posters and an equivalent text version
- Virtual assistant with a local, consent-dependent statistics output
- CSP, HSTS, COOP, referrer, permissions, MIME and frame headers
- No external font, map, analytics or media host



A complete flow without a false order
The calendar and voucher configurator can be used through the final step. Dedicated demo adapters then answer clearly: nothing was booked, stored or transmitted. The reference can demonstrate the complete UX flow without misleading visitors about a non-existent business or contract.
The latest local production measurement reached 93 performance points on mobile and 99 on desktop; accessibility and best practices both scored 100. The SEO score of 69 is the expected result of the reference demo’s deliberate noindex setting.



Technology Stack
- Framework
- Angular 21 · zoneless
- Rendering
- SSR/SSG · 42 pre-rendered routes
- Motion
- Scroll film · reduced motion · motion tokens
- Interaction
- Demo booking · voucher configurator · assistant
- SEO
- Canonical · hreflang · JSON-LD · deliberately noindex
- Privacy
- Local consent · no third parties
Develop a showcase for your industry?
We translate not only colours and copy but the decisions your customers make into a robust page and interaction architecture.