Swisscom Directories ist der führende Marketing- und Werbepartner für Schweizer KMU. Wir machen Unternehmen erfolgreich in der digitalen Welt.

Deine Mission: Du machst aus Figma-Designs eine robuste, wiederverwendbare Component Library mit Storybook als Single Source of Truth und sorgst dafür, dass unser breiteres Engineering-Team schnell liefern kann, ohne an UI-Qualität einzubüssen. Wir sind Plattform-Bauer, User-Versteher, Teamplayer und bieten dir einen Arbeitsalltag mit diesen Tätigkeiten:

Aufgaben

• Aufbau und Weiterentwicklung eines token-basierten Design Systems und React/Next.js-Component-Libraries nach Atomic Design.
• Implementierung mobiler und responsiver UI-Komponenten mit hoher Performance und Accessibility (WCAG).
• Enge Zusammenarbeit mit UX/UI in Figma (DevMode, Komponenten, Tokens) und Anwendung effizienter „Figma to Code“-Workflows zur Übersetzung von Designs in sauberen Code.
• Gestaltung und Validierung nutzerzentrierter UX-Konzepte mittels Prototyping, Usability-Tests und kontinuierlichem Feedback.
• Einrichtung, Betrieb und Weiterentwicklung von Storybook als Single Source of Truth inkl. Dokumentation, Beispielen und Tests für React-Komponenten.
• Beitrag zu Frontend- und Plattform-Architekturentscheidungen und Förderung moderner Webentwicklung im Team.
• Definition und Durchsetzung von Frontend-Qualitätsstandards (Linting, Token-Only-Styling, Tests, CI-Checks) sowie Review von Frontend-Pull-Requests mit Fokus auf Wiederverwendbarkeit, Konsistenz und Design-System-Hygiene.
• Erstellung von Guidelines und Contribution-Regeln für neue Komponenten, Varianten und Templates sowie Coaching anderer Engineers im Umgang mit dem Design System.
• Optional: Mitwirkung an Schnittstellen zu Golang-basierten Backends.

Qualifikation

• Mindestens 5 Jahre Erfahrung als (Fullstack-)Frontend Engineer mit Schwerpunkt React/Next.js, idealerweise auf grösseren, hochfrequentierten Plattformen.
• Nachgewiesene UX/UI-Design-Erfahrung mit Figma und „Figma to Code“-Workflows sowie fundiertes Verständnis von Responsive Design, Accessibility (WCAG) und Cross-Browser-Verhalten.
• Sehr gute Kenntnisse in TypeScript, HTML5, CSS3, modernen CSS-Ansätzen (z.B. TailwindCSS, CSS Modules oder vergleichbare Patterns) und Design Tokens.
• Erfahrung im Aufbau bzw. in der massgeblichen Mitarbeit an Design Systemen / Component Libraries und im produktiven Einsatz von Storybook.
• Gutes Verständnis moderner Webarchitektur, UX-Prozesse und Performance-Optimierung.
• Hoher Anspruch an Code-Qualität (Testing mit Jest/React Testing Library, Linting, klare Component APIs, Dokumentation) sowie Fähigkeit, Best Practices im Team zu verankern.
• Erfahrung mit visuellen Regressionstools (z.B. Chromatic, Percy, Lost Pixel).
• Vertrautheit mit Atomic Design aus früheren Projekten.
• Erfahrung in Design-System-Governance (Token-Pipelines, Multi-Brand-Setups).
• Nice to have: Erfahrung mit Golang-Backends.

Benefits

• remote and hybrid work possible
• Swisscom Fringe Benefits (Gym, Handy- und Internetabo und zahlreiche weitere Vergünstigungen)
• eine der besten Pensionskassen der Schweiz
• freie Wahl der Arbeitsmittel

Direktbewerbungen werden bevorzugt. Bitte hänge deiner Online-Bewerbung nach Möglichkeit einen GitHub-Link mit aussagekräftigen Code Samples an.

Philipp Schwager und das ganze Team freut sich auf deine Online Bewerbung!