>_ DevTrendspl

Język

Strona główna

Języki

Sekcje

Frontend Backend Mobilne DevOps AI / ML GameDev Blockchain Systemy wbudowane Bezpieczeństwo
CSS

Jak przestać tworzyć strony wyglądające jak generyczne szablony AI

Znana sytuacja: prosisz AI o szybkie stworzenie strony docelowej, a ono wypluwa kolejną kopię z wyśrodkowanym nagłówkiem, ogromnym obrazem hero i trzema ikonami korzyści? Wszystko wygląda schludnie, ale ma ten sam "plastikowy" feeling. Ten efekt ma już nawet swoją nazwę — AI slop.

Ostatnio natknąłem się na Hallmark. To nie tylko generator kodu, ale skill (dodatek) dla popularnych edytorów AI takich jak Cursor, Claude Code i Codex. Główną zaletą projektu jest agresywny opór wobec standardowych wzorców, na których trenowane są modele językowe. Zamiast wypluwać przeciętność internetową, narzędzie celowo szuka unikalnych struktur i stylów.

Co siedzi pod maską w Hallmark

Deweloperzy z Together AI postanowili pójść w przeciwnym kierunku. Zamiast tradycyjnego promptowania, wdrożyli system 57 kontroli ("bramki testów slop"). To filtry eliminujące nadużywane rozwiązania. Jeśli model próbuje zaproponować standardowy blok "hero", system zmusza go do przebudowy układu, aż będzie wyglądać jak praca żywego projektanta.

Co ciekawe, Hallmark nie korzysta z gotowych szablonów. Wybiera makrostrukturę dla konkretnego briefu i "ubiera" ją w jeden z dwudziestu motywów. Dwa różne zadania stworzą dwie różne strony, nie tylko zamianę palety kolorów.

Hallmark, skill projektowy, który odmawia wyglądania jak wygenerowany przez AI

Cztery tryby pracy

Narzędzie obsługuje się za pomocą prostych poleceń. Oprócz zwykłego generowania zidentyfikowałem dwa najbardziej przydatne scenariusze.

Pierwszy to hallmark study. Wrzucasz zrzut ekranu lub link do strony, która ci się podoba. Hallmark nie robi piksel-perfect kopii (co zwykle wygląda żałośnie), ale wyciąga "DNA" projektu: typografię, kolory kotwic i logikę budowy bloków. Wynikiem jest plik design.md, który możesz przekazać dowolnemu AI jako przewodnik.

Drugi to hallmark audit. Jeśli masz już kod, narzędzie przepuszcza go przez swoje testy "AI slop" i daje listę poprawek. Nie edytuje samego kodu, żeby nic nie zepsuć, ale na pewno wskaże, gdzie projekt wygląda zbyt przewidywalnie.

Jest też redesign, który całkowicie przebudowuje strukturę strony, zachowując twój tekst i branding. To przydatne, gdy stara strona docelowa się zestarzała i chcesz świeżego spojrzenia bez zmiany treści.

Przykłady tego, co generuje

Repozytorium zawiera wiele przykładów i naprawdę się różnią. Są surowe minimalistyczne interfejsy dla SaaS, a są niemal "rzemieślnicze" strony dla małych gospodarstw czy wytwórni muzycznych.

Jeśli żaden ze standardowych motywów nie pasuje do szalonego pomysłu klienta, Hallmark przełącza się w tryb Custom. W tym przypadku projektuje paletę i grid od zera, nie polegając na gotowych zestawach reguł.

Jak uruchomić to lokalnie

Integracja jest dość prosta. Najszybszy sposób to przez npx:

npx skills add nutlope/hallmark

Potem pliki pojawią się w potrzebnych folderach. Jeśli używasz Cursor, reguły zostaną wciągnięte do .cursor/rules/hallmark.mdc. Dla Claude Code lub Codex ścieżki różnią się nieznacznie, ale ogólna zasada jest ta sama: dodajesz zestaw instrukcji (SKILL.md) i folder z referencjami do swojego katalogu roboczego.

Cały kod projektu jest otwarty na licencji MIT. Możesz bezpiecznie go forknąć, modyfikować reguły pod swoje potrzeby lub używać w projektach komercyjnych.

Kto to znajdzie przydatne

Nie powiedziałbym, że Hallmark zastąpi profesjonalnego projektanta w złożonym projekcie. Ale jeśli jesteś backend developerem, który potrzebuje szybko sklecić przyzwoity panel administracyjny lub stronę docelową dla projektu hobbystycznego, to jest to ratunek. Strona nie będzie krzyczeć, że została zrobiona przez ChatGPT w 5 sekund.

Narzędzie sprawdza się też świetnie w szybkim prototypowaniu. Zamiast grzebać w Figmie, możesz naszkicować kilka wariantów strukturalnych od razu w kodzie i zobaczyć, który "vibe" lepiej pasuje do produktu.

Oczywiście czasami Hallmark może przesadzić i wyprodukować rozwiązanie zbyt odważne, które trzeba będzie ręcznie dopracować. Ale i tak lepiej niż widzieć ten sam templatowany układ po raz setny. Jeśli masz dość monotonii projektowania AI, Hallmark zdecydowanie warto dodać do swojego arsenału.

Powiązane projekty