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>
452 lines
19 KiB
HTML
452 lines
19 KiB
HTML
<!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>
|