Skillry Pick
Verspieltes UI/UX-Portfoliov1.0.2
Nutze diesen Skill für: Webseite erstellen.
Im Kommen
5.032 Downloads1 Likes0-mal gemerkt
$4.99
Was bekomme ich, wenn ich diesen Skill kaufe?Baue ein verspieltes UI/UX-Portfolio mit hüpfenden schwarzen Display-Buchstaben rund um ein illustriertes Porträt, einem Ausweis-Badge am Lanyard, einem dreispaltigen Block für Erfahrung und Kontakt und einem riesigen Content-Index in Konturschrift über fünf farbigen, nummerierten Spalten mit Produkt-Screens in Geräterahmen. Enthalten sind Startseite, Über mich, Arbeiten mit fünf Case-Study-Seiten, Lebenslauf und Kontakt, mit Filtern, Ergebniskennzahlen und einem validierten Kontaktformular. Standardmäßig ist es eine eigenständige Datei, die offline öffnet – gemacht für Produkt- und Interaction-Designer.
Am häufigsten gewählt von
Aktualisiert am 3. Okt. 2026
Vorschaugalerie
Ähnliche Skills
Alle Skills ansehen
Das bekommst du
- Ein Beispiel mit 11 Routen für die fiktive Ines Okafor: Startseite, Über mich, Arbeiten mit fünf Case-Study-Seiten, Lebenslauf, Kontakt und eine gestaltete 404-Seite.
- Produkt-Screens als Live-Oberfläche in Smartphone-, Tablet- und Laptop-Rahmen, dazu Filter für Arbeiten, Suche, Sortierung, ein Zitat-Karussell, FAQ und ein Kontaktformular mit Erfolgsmeldung.
- Eine eigenständige Datei mit eingebetteten Schriften Unbounded, Figtree und Geist Mono, einem flach illustrierten Porträt mit echter Transparenz und eingebauten Checks.
Passt gut für
- Produkt- und Interaction-Designer, die ein warmes, sympathisches Portfolio wollen, das trotzdem nach ernsthafter Arbeit aussieht.
- Designer, deren Case Studies Apps, Checkouts oder Dashboards sind, die sich als Live-Screens zeigen lassen.
- UX-Researcher oder kleine Studios, die Studien oder Projekte auf denselben Aufbau der Case-Seiten übertragen können.
Nicht geeignet für
- Fotografen oder Künstler, die vor allem große Galerien ihrer eigenen Bilder brauchen.
- Minimalistische, monochrome Personal Brands; die Website nutzt fünf knallige Spaltenfarben und hüpfende Buchstaben.
- Nachrichten direkt empfangen: Das Kontaktformular bestätigt nur auf der Seite, bis du ein Backend anbindest.
Corporate Design & MarkenidentitätWebdesign & digitale ErlebnisseWebseite erstellenPortfolio-Website erstellenStil fixiertBearbeitbares ErgebnisHüpfende Display-BuchstabenGeräte-MockupsFlaches IllustrationsporträtLanyard-BadgeNummerierte Farbspalten
Über diesen Skill
Gib dem Skill deine Geschichte und drei bis sechs Case Studies, und er baut ein Portfolio, das wirkt wie ein gut gemachtes Eigenwerbungsplakat von jemandem, der auch Software ausliefert: hüpfende Display-Buchstaben rund um ein illustriertes Porträt, ein Lanyard-Badge und knallige, nummerierte Spalten mit Produkt-Screens. Das ausgearbeitete Beispiel ist die fiktive Produktdesignerin Ines Okafor mit 11 verknüpften Routen. Das Standardergebnis ist eine eigenständige Datei, die offline in jedem Browser öffnet.
Das bekommst du
- Eine Startseite mit Buchstaben-Hero, Badge und Begrüßung, Spalten für Erfahrung, Community und Kontakt, dem Content-Index, Prozessschritten, Kundenzitaten und einem Call-to-Action-Band
- Case-Study-Seiten mit Briefing, Erkenntnissen, Prozess, einer Galerie aus drei Screens, Ergebniskennzahlen, einem Kundenzitat und Links zu vorheriger und nächster Arbeit
- Über mich, einen Lebenslauf mit Skill-Chips und eine Kontaktseite mit FAQ und validiertem Formular
- Unbounded, Figtree und Geist Mono in die Datei eingebettet, sodass nichts aus dem Netz geladen wird
So nutzt du es
- Teile Name, Disziplin, Stadt, eine kurze Begrüßung, deine Erfahrung und drei bis sechs Case Studies mit Briefing, Prozess und Ergebnissen.
- Dein Agent baut jeden Produkt-Screen, erstellt die Illustrationen aus deinen Fotos und führt die eingebauten Checks aus.
- Klicke dich auf Desktop und Smartphone durch jede Seite und jedes Formular und wünsch dir dann Änderungen.
Illustrationen, die mit dem Bildtool deines Agenten erstellt werden, können dessen Nutzungskosten verursachen. Das Kontaktformular bestätigt auf der Seite und sendet nichts, bis ein Backend angebunden ist.
Was du vorab brauchst
- Du bringst mit
- Name, Disziplin, Stadt, Verfügbarkeit und eine kurze Begrüßung in der Ich-Form · Drei bis sechs Case Studies mit Briefing, Erkenntnissen, Prozessschritten, Ergebnissen und einem Kundenzitat · Erfahrung, Skills, Kontaktdaten und Fotos von dir für die Illustrationen
- 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 Bildgenerierungstool in deinem Agenten für das illustrierte Porträt und die Studio-Szenen
- Externe Kosten
- Für das illustrierte Porträt und die Szenen können Nutzungskosten des Bildtools deines Agenten anfallen. Produkt-Screens werden direkt in der Seite gebaut und brauchen keine Bildgenerierung.
- Zuletzt getestet
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Nutzerbewertungen
Bewertungen werden geladen …