StudySmarter · CareerKit

Ein Design-System für die ganze App

86 Screens über 10 Bereiche, alle aus einem eingefrorenen Baukasten: mobile-first, klare Hierarchie, eine Primäraktion pro View, echte Karten, Duotone-Icons. Die App-Bereiche mit allen Zuständen; Desktop und Mein Geld als markierte Konzepte.

Smarter Blue #1300FF Neon Lime #C6FA02 Type Geist Icons Phosphor duotone Maps Leaflet · Esri

Hierarchie · eine dominante H1, eine Primäraktion Lime nur für das eine Fokus-Signal Mobile-native · Aktion im Daumenbereich, keine toten Flächen Tags in eigener Zeile, gekapselt

Foundations

Brand tokens, type ramp and the duotone icon set that every screen is built from.

1 · Onboarding

Cold open to first job results. Left-aligned, one action per step, real map for location.

2 · Start / Dashboard

The home tab across returning, first-run, loading and signed-out states.

3 · Jobsuche

Finding and reading jobs: list, filter, map and the full data-complete posting.

4 · Bewerbungs-Tracker

Track applications as a board or list, with a status timeline and analytics.

5 · CV-Check

Upload or build a CV, then the AI check with a scored, categorized verdict.

6 · Interview-Training

Set up a mock interview, run the full-height live chat, get scored feedback.

7 · System & Sekundär

Everything-hub, learning, the account gate, settings, legal and offline.

Desktop

2KONZEPT

Für die breiten Flächen, wo Fläche den Workflow ändert: Master-Detail und die ganze Pipeline auf einen Blick. Nicht 'größer', sondern anders komponiert.

Mein Geld

15KONZEPT

Die geplante Finanz-Plattform: Karriere-Geld-Achse, Lernsystem, Vertrauens-Schicht (ehrliche Ergebnisse, markierte Annahmen, Szenarien statt Prognosen).