purinto-website/projekte.html
Denise Krölling 1a63f66463 Website der Purinto GmbH aufsetzen
Statische Website ohne Build-Schritt: reines HTML, CSS und Vanilla-JS,
lauffaehig auf beliebigem Webspace.

Neun Seiten: Startseite, Dienstleistungen, Projekte, Ueber uns, Kontakt
sowie Impressum, Datenschutz, Danke-Seite und 404.

Kernstueck der Startseite ist die Stueckzahl-Achse: ein logarithmischer
Regler von 1 bis 100.000 Stueck, der zur gewaehlten Menge Verfahren,
Werkzeugkosten, Lieferzeit und Anwendungsfall ausgibt. Die dritte Zone
ist optisch zurueckgenommen, weil Serienspritzguss ueber Partnerbetriebe
laeuft und nicht zum eigenen Leistungsumfang gehoert. Der Leistungsumfang
ist durchgehend auf FDM, SLA und SLA-gedruckte Formeinsaetze beschraenkt.

Gestaltung nach Vorgabe: Anthrazit, Salbeigruen und Flieder als Akzent.
Archivo, Public Sans und IBM Plex Mono werden lokal ausgeliefert statt
ueber die Google-CDN eingebunden.

Kontaktformular ueber Web3Forms mit Client-Validierung; der Access-Key
ist noch ein Platzhalter. Alle Firmen- und Projektinhalte sind sichtbar
als Platzhalter markiert, die Uebergabe-Checkliste steht in der README.

Geprueft: WCAG-AA-Kontraste auf allen Seiten, kein horizontaler Ueberlauf
von 320 bis 1920 px, Tastaturbedienung der Achse, feste Zeilenzahl der
Hero-Headline.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-13 13:07:08 +02:00

452 lines
19 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="de-AT">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Projekte — Purinto GmbH</title>
<meta
name="description"
content="Ausgewählte Projekte aus Maschinenbau, Medizintechnik, Automotive und Konsumgütern — realisiert mit Konstruktionsbegleitung, FDM, SLA und Bridge Tooling."
/>
<link rel="canonical" href="https://www.purinto.at/projekte.html" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Projekte — Purinto GmbH" />
<meta
property="og:description"
content="Ausgewählte Arbeiten aus vier Branchen — von der Konstruktionsbegleitung bis zur Kleinserie."
/>
<meta property="og:locale" content="de_AT" />
<link rel="icon" href="favicon.svg" type="image/svg+xml" />
<link rel="stylesheet" href="assets/css/tokens.css" />
<link rel="stylesheet" href="assets/css/main.css" />
</head>
<body>
<a class="sprungmarke" href="#inhalt">Zum Inhalt springen</a>
<header class="kopf" data-kopf>
<div class="huelle kopf__innen">
<a class="marke" href="index.html" aria-label="Purinto GmbH, zur Startseite">
<svg class="marke__zeichen" viewBox="0 0 24 24" aria-hidden="true">
<rect x="6" y="4" width="12" height="4.4" rx="1" fill="#9b85c4" />
<rect x="4" y="9.8" width="16" height="4.4" rx="1" fill="#8fa894" />
<rect x="2" y="15.6" width="20" height="4.4" rx="1" fill="#3c4347" />
</svg>
<span class="marke__wort">Purinto</span>
</a>
<button
class="nav__schalter"
type="button"
data-nav-schalter
aria-expanded="false"
aria-controls="hauptnav"
>
<span data-nav-schalter-text>Menü</span>
<span class="nav__balken" aria-hidden="true"></span>
</button>
<nav class="nav" id="hauptnav" data-nav aria-label="Hauptnavigation">
<ul class="nav__liste">
<li><a class="nav__link" href="dienstleistungen.html">Dienstleistungen</a></li>
<li>
<a class="nav__link" href="projekte.html" aria-current="page">Projekte</a>
</li>
<li><a class="nav__link" href="ueber-uns.html">Über uns</a></li>
<li><a class="nav__link" href="kontakt.html">Kontakt</a></li>
</ul>
<a class="knopf knopf--primaer" href="kontakt.html">Anfrage stellen</a>
</nav>
</div>
</header>
<main id="inhalt">
<section class="seitenkopf">
<div class="huelle">
<p class="eyebrow">Projekte</p>
<h1 class="display t-2xl seitenkopf__titel">
Bauteile, die es in die Anwendung geschafft haben.
</h1>
<p class="lead">
Eine Auswahl aus vier Branchen. Zu jedem Projekt steht, worin die
eigentliche Schwierigkeit lag — nicht nur, welches Verfahren zum
Einsatz kam.
</p>
</div>
</section>
<div class="huelle">
<div class="filter" data-filter hidden>
<div class="filter__gruppe">
<span class="filter__titel" id="f-branche">Branche</span>
<button
class="filter__knopf"
type="button"
data-gruppe="branche"
data-wert="alle"
aria-pressed="true"
>
Alle
</button>
<button class="filter__knopf" type="button" data-gruppe="branche" data-wert="maschinenbau" aria-pressed="false">
Maschinenbau
</button>
<button class="filter__knopf" type="button" data-gruppe="branche" data-wert="medizin" aria-pressed="false">
Medizintechnik
</button>
<button class="filter__knopf" type="button" data-gruppe="branche" data-wert="automotive" aria-pressed="false">
Automotive
</button>
<button class="filter__knopf" type="button" data-gruppe="branche" data-wert="konsum" aria-pressed="false">
Konsumgüter
</button>
</div>
<div class="filter__gruppe">
<span class="filter__titel" id="f-verfahren">Verfahren</span>
<button
class="filter__knopf"
type="button"
data-gruppe="verfahren"
data-wert="alle"
aria-pressed="true"
>
Alle
</button>
<button class="filter__knopf" type="button" data-gruppe="verfahren" data-wert="fdm" aria-pressed="false">
FDM
</button>
<button class="filter__knopf" type="button" data-gruppe="verfahren" data-wert="sla" aria-pressed="false">
SLA
</button>
<button class="filter__knopf" type="button" data-gruppe="verfahren" data-wert="bridge" aria-pressed="false">
Bridge Tooling
</button>
<button class="filter__knopf" type="button" data-gruppe="verfahren" data-wert="konstruktion" aria-pressed="false">
Konstruktion
</button>
<button class="filter__knopf" type="button" data-gruppe="verfahren" data-wert="material" aria-pressed="false">
Materialauswahl
</button>
</div>
</div>
</div>
<section class="sektion" aria-label="Projektliste">
<div class="huelle">
<p class="mono leise" data-zaehler aria-live="polite">6 Projekte</p>
<div class="raster raster--3 mt-6" data-projektliste>
<!-- 01 -->
<article class="projekt" data-branche="medizin" data-verfahren="bridge material">
<div class="projekt__bild">
<img src="assets/img/projekte/platzhalter-01.svg" alt="" width="800" height="600" loading="lazy" />
</div>
<div class="projekt__innen">
<div class="projekt__meta">
<span class="tag tag--branche">Medizintechnik</span>
<span class="tag">Bridge Tooling</span>
<span class="tag">Materialauswahl</span>
</div>
<h2 class="projekt__titel">
<span class="platzhalter">Gehäuse für ein Analysegerät</span>
</h2>
<p class="projekt__block">
<b>Aufgabe</b>
<span class="platzhalter"
>600 Gehäuse im Serienwerkstoff für die Validierung — vier
Monate vor der geplanten Werkzeugfreigabe.</span
>
</p>
<p class="projekt__block">
<b>Lösung</b>
<span class="platzhalter"
>Werkstoffwechsel auf ein Material mit
Biokompatibilitätsnachweis, danach Fertigung über einen
SLA-Formeinsatz.</span
>
</p>
<div class="projekt__ergebnis">
<span class="projekt__kennzahl platzhalter">4 Monate</span>
<p class="leise mono">
<span class="platzhalter">früher in der Validierung · 2025</span>
</p>
</div>
</div>
</article>
<!-- 02 -->
<article class="projekt" data-branche="maschinenbau" data-verfahren="konstruktion fdm">
<div class="projekt__bild">
<img src="assets/img/projekte/platzhalter-02.svg" alt="" width="800" height="600" loading="lazy" />
</div>
<div class="projekt__innen">
<div class="projekt__meta">
<span class="tag tag--branche">Maschinenbau</span>
<span class="tag">Konstruktion</span>
<span class="tag">FDM</span>
</div>
<h2 class="projekt__titel">
<span class="platzhalter">Führungselement mit Schnappverbindung</span>
</h2>
<p class="projekt__block">
<b>Aufgabe</b>
<span class="platzhalter"
>Ein verschraubtes Bauteil aus drei Einzelteilen verursachte
zu hohe Montagekosten.</span
>
</p>
<p class="projekt__block">
<b>Lösung</b>
<span class="platzhalter"
>Funktionsintegration zu einem Spritzgussteil mit
Schnappverbindung, abgesichert über gedruckte Muster.</span
>
</p>
<div class="projekt__ergebnis">
<span class="projekt__kennzahl platzhalter">2 Teile</span>
<p class="leise mono">
<span class="platzhalter">und ein Montageschritt entfallen · 2025</span>
</p>
</div>
</div>
</article>
<!-- 03 -->
<article class="projekt" data-branche="konsum" data-verfahren="sla">
<div class="projekt__bild">
<img src="assets/img/projekte/platzhalter-03.svg" alt="" width="800" height="600" loading="lazy" />
</div>
<div class="projekt__innen">
<div class="projekt__meta">
<span class="tag tag--branche">Konsumgüter</span>
<span class="tag">SLA</span>
</div>
<h2 class="projekt__titel">
<span class="platzhalter">Sichtteil für einen Produktlaunch</span>
</h2>
<p class="projekt__block">
<b>Aufgabe</b>
<span class="platzhalter"
>Lackierfähige Muster für Fotoproduktion und Messeauftritt,
bevor das Serienwerkzeug stand.</span
>
</p>
<p class="projekt__block">
<b>Lösung</b>
<span class="platzhalter"
>SLA-Druck mit anschließendem Schleifen und Lackieren in der
späteren Serienfarbe.</span
>
</p>
<div class="projekt__ergebnis">
<span class="projekt__kennzahl platzhalter">8 Tage</span>
<p class="leise mono">
<span class="platzhalter">von der Freigabe zum Muster · 2025</span>
</p>
</div>
</div>
</article>
<!-- 04 -->
<article class="projekt" data-branche="automotive" data-verfahren="fdm konstruktion">
<div class="projekt__bild">
<img src="assets/img/projekte/platzhalter-04.svg" alt="" width="800" height="600" loading="lazy" />
</div>
<div class="projekt__innen">
<div class="projekt__meta">
<span class="tag tag--branche">Automotive</span>
<span class="tag">FDM</span>
<span class="tag">Konstruktion</span>
</div>
<h2 class="projekt__titel">
<span class="platzhalter">Trägerplatte für Sensorik im Innenraum</span>
</h2>
<p class="projekt__block">
<b>Aufgabe</b>
<span class="platzhalter"
>Einbausituation absichern und Gewicht reduzieren, bei
Dauergebrauchstemperaturen bis 90 °C.</span
>
</p>
<p class="projekt__block">
<b>Lösung</b>
<span class="platzhalter"
>Rippenoptimierung und Werkstoffwechsel, Funktionsmuster aus
faserverstärktem FDM-Material.</span
>
</p>
<div class="projekt__ergebnis">
<span class="projekt__kennzahl platzhalter">− 22 %</span>
<p class="leise mono">
<span class="platzhalter">Bauteilgewicht · 2026</span>
</p>
</div>
</div>
</article>
<!-- 05 -->
<article class="projekt" data-branche="maschinenbau" data-verfahren="bridge">
<div class="projekt__bild">
<img src="assets/img/projekte/platzhalter-06.svg" alt="" width="800" height="600" loading="lazy" />
</div>
<div class="projekt__innen">
<div class="projekt__meta">
<span class="tag tag--branche">Maschinenbau</span>
<span class="tag">Bridge Tooling</span>
</div>
<h2 class="projekt__titel">
<span class="platzhalter">Abdeckkappe in Serienqualität</span>
</h2>
<p class="projekt__block">
<b>Aufgabe</b>
<span class="platzhalter"
>Ersatzteilbedarf von rund 400 Stück pro Jahr — für ein
Stahlwerkzeug zu wenig, für den Druck zu viel.</span
>
</p>
<p class="projekt__block">
<b>Lösung</b>
<span class="platzhalter"
>SLA-Formeinsatz mit jährlichem Abruf statt Werkzeuginvest
und Lagerhaltung.</span
>
</p>
<div class="projekt__ergebnis">
<span class="projekt__kennzahl platzhalter">400 / Jahr</span>
<p class="leise mono">
<span class="platzhalter">ohne Lagerbestand · 2026</span>
</p>
</div>
</div>
</article>
<!-- 06 -->
<article class="projekt" data-branche="konsum" data-verfahren="material bridge">
<div class="projekt__bild">
<img src="assets/img/projekte/platzhalter-05.svg" alt="" width="800" height="600" loading="lazy" />
</div>
<div class="projekt__innen">
<div class="projekt__meta">
<span class="tag tag--branche">Konsumgüter</span>
<span class="tag">Materialauswahl</span>
<span class="tag">Bridge Tooling</span>
</div>
<h2 class="projekt__titel">
<span class="platzhalter">Verschluss mit Schnappfunktion</span>
</h2>
<p class="projekt__block">
<b>Aufgabe</b>
<span class="platzhalter"
>Ein Start-up brauchte 800 Stück für den Markttest, mit
Lebensmittelkontakt-Zulassung.</span
>
</p>
<p class="projekt__block">
<b>Lösung</b>
<span class="platzhalter"
>Werkstoffauswahl mit Zulassungsnachweis, danach Kleinserie
über einen gedruckten Formeinsatz.</span
>
</p>
<div class="projekt__ergebnis">
<span class="projekt__kennzahl platzhalter">800 Stück</span>
<p class="leise mono">
<span class="platzhalter">ohne Werkzeuginvestition · 2026</span>
</p>
</div>
</div>
</article>
</div>
<p class="leer-hinweis" data-leer hidden>
Zu dieser Kombination gibt es kein Projekt. Setzen Sie einen der
beiden Filter auf „Alle“.
</p>
<div class="hinweis mt-7">
<span class="hinweis__titel">Zur Darstellung</span>
<p>
Ein großer Teil unserer Arbeit entsteht in laufenden
Entwicklungsprojekten und unterliegt Geheimhaltungsvereinbarungen.
Wir zeigen solche Projekte anonymisiert: ohne Kundennamen und mit
Bildern, die das Bauteil nicht identifizierbar machen. Was wir
zeigen dürfen, zeigen wir gern im Gespräch.
</p>
</div>
</div>
</section>
<section class="cta-band sektion">
<div class="huelle cta-band__innen">
<div>
<h2 class="display t-2xl">Haben Sie einen ähnlichen Fall?</h2>
<p class="cta-band__text">
Schicken Sie uns Ihr CAD-Modell und die geplante Stückzahl. Sie
bekommen eine Einschätzung zu Machbarkeit, Verfahren und Kosten.
</p>
</div>
<div class="knopf-reihe">
<a class="knopf knopf--primaer" href="kontakt.html">Anfrage stellen</a>
<a class="knopf knopf--hell" href="dienstleistungen.html">Leistungen</a>
</div>
</div>
</section>
</main>
<footer class="fuss">
<div class="huelle">
<div class="fuss__raster">
<div>
<a class="marke fuss__marke" href="index.html">
<svg class="marke__zeichen" viewBox="0 0 24 24" aria-hidden="true">
<rect x="6" y="4" width="12" height="4.4" rx="1" fill="#9b85c4" />
<rect x="4" y="9.8" width="16" height="4.4" rx="1" fill="#8fa894" />
<rect x="2" y="15.6" width="20" height="4.4" rx="1" fill="#e3e7e6" />
</svg>
<span class="marke__wort">Purinto</span>
</a>
<p class="fuss__text">
Entwicklungsbegleitende Kunststofftechnik. Konstruktion,
Werkstoffauswahl, Prototypen und Kleinserien aus einer Hand.
</p>
</div>
<div>
<p class="fuss__titel">Navigation</p>
<ul class="fuss__liste">
<li><a href="dienstleistungen.html">Dienstleistungen</a></li>
<li><a href="projekte.html">Projekte</a></li>
<li><a href="ueber-uns.html">Über uns</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
</div>
<div>
<p class="fuss__titel">Kontakt</p>
<ul class="fuss__liste">
<li>
<a href="mailto:office@purinto.at" class="platzhalter"
>office@purinto.at</a
>
</li>
<li><span class="platzhalter">+43 (0) 000 000 00 00</span></li>
<li><span class="platzhalter">Musterstraße 1, 0000 Musterort</span></li>
</ul>
</div>
</div>
<div class="fuss__unten">
<p>© <span data-jahr>2026</span> Purinto GmbH</p>
<div class="fuss__rechtlich">
<a href="impressum.html">Impressum</a>
<a href="datenschutz.html">Datenschutz</a>
</div>
</div>
</div>
</footer>
<script src="assets/js/site.js" defer></script>
<script src="assets/js/projekte.js" defer></script>
</body>
</html>