Browse commands

/impeccable bolder

Bolder

Popchnij bezpieczne projekty w stronę wyrazistości bez wpadania w chaos.

Kiedy używać

Sięgnij po /impeccable bolder, gdy interfejs wygląda jak każdy inny interfejs. Generyczny sans, średnie grubości, miękkie cienie, skromny kolor akcentu, rozsądne odstępy, niezapamiętywalny. Projekt nie jest zły, po prostu bezpieczny. Użyj bolder, gdy projekt może znieść obecność, a obecny stan jej nie wnosi.

Nie używaj na dashboardach, na które ludzie patrzą przez godziny. Odwaga zarabia swoje miejsce na stronach marketingowych, momentach hero i funkcjach treściowych. Nie w narzędziach operatorskich.

Jak to działa

Umiejętność wzmacnia cztery osie bez łamania użyteczności:

  1. Skala: typ displayowy jest pchany do clamp(3rem, 6vw, 6rem) lub dalej. Nagłówki, które wypełniają viewport, nie unikają go.
  2. Kontrast grubości: lekkie 300 naprzeciw ciężkiego 800 zamiast średniego naprzeciw regularnego. Prawdziwe napięcie, nie wzruszenie ramion.
  3. Zaangażowanie kolorystyczne: kolor akcentu pojawia się w pełnej sile, nie rozcieńczony. Tła mogą zająć stanowisko (ink, accent, cream) zamiast samego papieru.
  4. Pewność kompozycyjna: asymetria, off-grid, pullquote’y, zawieszona interpunkcja, skoki skali. Układ ma głos.

Umiejętność nie dodaje więcej. Wzmacnia to, co już jest. Jeśli projekt ma trzy kolory, bolder nie dodaje czwartego, angażuje się mocniej w trzy.

Wypróbuj

/impeccable bolder the landing page hero

Oczekiwane zmiany:

  • Nagłówek hero z 3rem do clamp(3.5rem, 7vw, 6.5rem), font displayowy, waga 700
  • Podtytuł z regular do italic na 1.5rem, przesunięty 8px w lewo od nagłówka dla wyrównania optycznego
  • Tło zmienia się z papier na gradient cream-to-paper, tworząc cieplejszy kontener
  • Przycisk CTA wypełniony, cień usunięty, border radius zredukowany, stan hover odwraca kolory
  • Obraz wspierający przesunięty lekko off-grid z ujemnym marginesem górnym, tworząc asymetrię

Pułapki

  • Uruchamianie na złej stronie. Dashboardy produktowe, ustawienia i formularze nie powinny być bold. Powinny być czytelne. Użyj /impeccable layout lub /impeccable polish.
  • Mylenie bold z loud. Bold znaczy zaangażowany i pewny. Loud znaczy krzyczący. Bolder to to pierwsze. Jeśli wynik wydaje się agresywny, podążaj za nim /impeccable quieter.
  • Parowanie z /impeccable delight w tym samym przebiegu. Delight działa najlepiej na stabilnej bazie wizualnej. Najpierw bold, stabilizuj, potem delight.