Bento-Designer-Portfoliov1.0.2
Nutze diesen Skill für: Portfolio-Website erstellen.
Im Kommen
5.030 Downloads0 Likes1-mal gemerkt
$4.99
Was bekomme ich, wenn ich diesen Skill kaufe?Baue ein Designer-Portfolio mit hellgrauer Bühne, zweizeiliger Headline mit verblasster zweiter Zeile, schwebenden Bento-Karten um eine rote Porträtkachel, riesigen verblassten Lettern im Footer und ruhigen Case-Study-Seiten. Filter, Buchung und Formulare funktionieren – als eine eigenständige Datei, die in jedem Browser öffnet und offline läuft.
Am häufigsten gewählt von
Aktualisiert am 3. Okt. 2026
Vorschaugalerie
Ähnliche Skills
Alle Skills ansehen
Das bekommst du
- Eine eigenständige Portfolio-Datei für deine Arbeit, die in jedem Browser öffnet und offline läuft, mit eingebetteten Schriften und Bildern; eine Übertragung in dein eigenes Framework-Projekt, falls du eines hast.
- Case Studies mit Identity-Boards, Leistungsseiten mit Preisübersichten, ein Journal sowie funktionierende Filter, Suche, Sortierung, Raster- und Listenansicht und ein Buchungs-Widget.
- Der charakteristische Look in einem 28-seitigen Beispiel mit 14 eigens erstellten Bildern: schwebende Karten, rote Porträtkachel, verblasste Typo, ruhige Animationen und volle Unterstützung für reduzierte Bewegung.
Passt gut für
- Selbstständige Brand-, Web- und Produktdesigner, die ein Portfolio wollen, das sie direkt veröffentlichen können.
- Kleine Studios, die die rote Kachel in ein Gründer- oder Teamporträt verwandeln und in der Wir-Form schreiben.
- Designer, die Leistungen zum Festpreis verkaufen und klare Leistungsseiten, eine Prozess-Timeline und einen Buchungsablauf wollen.
Nicht geeignet für
- Echte Kalenderbuchung, E-Mail-Versand oder Zahlungen; die Formulare zeigen nur ehrliche Demo-Bestätigungen.
- Fotografen oder Agenturen, die statt ruhiger Case Studies eine dichte, randlose Bildergalerie brauchen.
- Die fiktive Elin Saro, ihre Kunden oder Zitate als echte Arbeit auszugeben.
Corporate Design & MarkenidentitätWebdesign & digitale ErlebnissePortfolio-Website erstellenStil fixiertBearbeitbares ErgebnisBentoGeistPorträtProzess
Über diesen Skill
Bento-Designer-Portfolio baut eine Portfolio-Website für eine selbstständige Designerin, ein Studio oder eine kleine Marke: eine hellgraue Bühne, eine zweizeilige Headline mit verblasster zweiter Zeile, sechs schwebende Bento-Karten um eine rote Porträtkachel und ruhige Case-Study-Seiten. Das Beispiel zeigt die fiktive Rotterdamer Designerin Elin Saro mit 28 verknüpften Seiten, auf denen jeder Filter, jedes Formular und jeder Buchungsschritt funktioniert.
Das bekommst du
- Eine eigenständige Website-Datei, die in jedem Browser öffnet und offline funktioniert, mit eingebauten Schriften und Bildern. Hast du bereits ein Framework-Projekt, wird das Design stattdessen dorthin übertragen.
- Ein vollständiges Portfolio: Arbeitsübersicht, sechs Case Studies mit Identity-Boards, Über-mich, Leistungen mit vier Detailseiten und Preisübersichten, Prozess, Bewertungen, ein Journal mit vier Artikeln, Buchung, FAQ, Newsletter, Datenschutz, Impressum und eine gestaltete 404-Seite.
- Funktionierende Bedienelemente: Kategorie-Chips mit Zählern, Live-Suche, Sortierung, Raster- und Listenansicht, ein Buchungs-Widget mit Tag, Uhrzeit und Thema sowie Formulare mit Validierung und Erfolgsmeldungen.
- Eine Bildsprache für 14 Bilder: weiches Nordlicht, helle warmgraue Flächen und ein rotes Element, wobei die Identity jedes Kunden als echte Objekte statt als Bildschirme gezeigt wird.
- Ruhige Animationen: Karten setzen sich einmal, Abschnitte erscheinen beim Scrollen, und bei reduzierter Bewegung passiert alles sofort.
So nutzt du es
- Teile deinen Namen oder dein Studio, was du gestaltest, deine Projekte mit Kunden und Ergebnissen, Leistungen, Preise und Kontaktdaten. Fehlendes wird als plausibler Platzhalter entworfen und dir zur Bestätigung aufgelistet.
- Schick ein Porträt ab der Hüfte für die rote Kachel und Fotos deiner Arbeiten, oder lass den Agenten Projekt-Stillleben im selben weichen Licht generieren. Generierte Porträts sind nur Platzhalter, bis du sie ersetzt.
- Öffne jede Seite auf Desktop und Smartphone, teste Filter, Buchung und Formulare und wünsch dir Änderungen.
Gesetzt ist alles in Instrument Sans und Geist Mono, eingebettet in die Datei. Neue Bilder stammen aus dem Bildtool deines Agenten und können dort Nutzungskosten verursachen.
Was du vorab brauchst
- Du bringst mit
- Dein Name oder Studio, was du gestaltest, und eine kurze Vorstellung · Projekte mit Kunde, Jahr, Kategorie und Ergebnis sowie Leistungen, Preise und Kontaktdaten · Ein Porträt ab der Hüfte und Projektfotos oder deine Zustimmung, Platzhalterbilder zu generieren
- Abhängigkeiten
- Node.js 18 oder neuer auf dem Rechner deines Agenten, um das mitgelieferte Skript auszuführen, das die einzelne Offline-Datei baut · Internetzugang während des Builds, damit die Schriften einmal heruntergeladen und eingebettet werden können · Ein Bildtool in deinem Agenten oder eigene Fotos für Porträt und Projektbilder · Ein moderner Browser zur Vorschau und Prüfung jeder Seite
- Externe Kosten
- Neue Projekt- und Porträtbilder werden mit dem Bildtool deines Agenten generiert, das Nutzungskosten verursachen kann. Ohne ein solches lieferst du eigene Fotos; sechs neutrale Bilder können als Platzhalter bleiben. Das Ansehen des Beispiels kostet nichts.
- Zuletzt getestet
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Nutzerbewertungen
Bewertungen werden geladen …