ThoughtLab
Obsydianowy monument z karmazynowym sygnałem. Płótno czarnej pustki, gdzie jedynym nasyconym czerwienią obiektem w katedrze, wydrukowanym dużymi białymi literami, jest pojedyncza, chromatyczna figura.
ThoughtLab działa jak język projektowania Czarnej Katedry: puste czarne płótno, pojedynczy czerwony impuls i typografia tak duża, że funkcjonuje jak architektura. System jest niemal całkowicie achromatyczny – #cccccc reprezentuje treść, #ffffff reprezentuje wyświetlacz – a #fc1c46 pojawia się tylko w jednej, głównej akcji, jako kontrolowany przypływ napięcia na tle pustki. Hierarchia budowana jest za pomocą ostrych skoków skali (198 px → 14 px), a nie za pomocą kolorów, cieni czy wypełnień. Komponenty są nieważkie: przezroczyste karty, przyciski w kształcie pigułek, cienkie pola wprowadzania danych, brak podwyższonego układania – strona oddycha dzięki pustej przestrzeni i gęsto upakowanym wielkim literom, a nie poprzez kontenery.
Ciemne płótno rozciąga się na całą szerokość strony, z szerokimi poziomymi marginesami (126 px z każdej strony, co zwiększa szerokość kolumny z treścią do około 1400 px). Nagłówek to pojedyncza linia o szerokości 72 px: logo po lewej stronie, slogan pośrodku, przycisk wezwania do działania w kształcie pigułki i pasek hamburgera po prawej. Bohater to podzielona kompozycja – powiększony nagłówek o szerokości 198 px, pisany wielkimi literami po lewej stronie, z tekstem uzupełniającym 18 px poniżej, podczas gdy trójwymiarowa sfera nachodzi na tekst po prawej stronie od środka, częściowo go „zjadając”. Poniżej bohatera sekcje ułożone są w przestronnym, pionowym rytmie z przerwami o szerokości 86–108 px. Elementy pracy są wyświetlane jako lista, zajmująca niemal całą szerokość strony, a nie jako siatka kart. Nie ma paska bocznego, megamenu ani stopki z siatką kolumn – stopka to pojedyncza, cicha linia z informacjami o prawach autorskich i danymi kontaktowymi #4c4c4c. Nawigacja poza nagłówkiem uruchamia się w postaci menu hamburgerowego na pełnoekranowej nakładce.
Obrazy są oszczędne i celowo dobrane. Dominującym elementem wizualnym jest duża kula obsydianowej cieczy, renderowana w WebGL – ciemny, niemal czarny, trójwymiarowy kształt z subtelnymi niebieskimi i bursztynowymi refleksami wzdłuż krawędzi, unoszący się na czarnym tle i częściowo nachodzący na tytuł. Pełni on raczej funkcję ikonografii marki niż ilustracji. Miniatury projektów są wyświetlane jako zdjęcia lub filmy w formie pionowej listy, od krawędzi do krawędzi, bez obramowania. Żadnych zdjęć lifestylowych, zdjęć stockowych ani dekoracyjnych gradientów. Kula i czcionka to jedyne elementy wizualne na stronie.
Paleta
Marka
- Crimson Signal
#fc1c46— Głównym akcentem jest pojedynczy czerwony element; pojawia się on tylko w zakładce „Kontakty”, w logo marki i nigdzie indziej. Jego rzadkość wynika ze specyfiki projektu.
Neutralny
- Void
#000000— Tło strony, płótno, jest absolutnym fundamentem, na którym unoszą się wszystkie inne elementy. - Ash
#cccccc— Tekst główny i linków, domyślny odcień tekstu na czarnym płótnie - wybrany zamiast czystej bieli, aby złagodzić optyczny odblask. - Frost
#ffffff— Wyświetlanie nagłówków, tekstu przycisków, tekstu pól wprowadzania danych i znaczników jest najbardziej widocznym poziomem, przeznaczonym dla treści, które powinny mieć charakter liniowy. - Graphite
#4c4c4c— Prawa autorskie, meta tagi, tekst pomocniczy - celowo wyciszone, aby nie konkurować z tekstem głównym.
Typografia
od 10 do 198px · 7 kroków
- sui — wymiana: Space Grotesk (closest free geometric match) or Inter for a more neutral alternative. Neue Haas Grotesk Display if licensed. · wytyczne 300, 400, 500, 700 · Pojedyncza czcionka. Sui to zaprojektowana na zamówienie geometryczna czcionka bezszeryfowa używana w różnych szerokościach, od 198 px dla nagłówków do 10 px dla podpisów. Grubość 700 px jest zarezerwowana dla monumentalnych nagłówków i obszernych tytułów; grubość 400 px jest używana w pozostałych częściach systemu. Kontrast między czcionkami pogrubionymi i regularnymi stanowi podstawowy system czcionek; druga rodzina nie jest wymagana.
Interwały i forma
| Zamiar | Oznaczający |
|---|---|
| Gęstość | gęsty |
| Podstawowy krok | 9px |
| Promień przycisku | 9999px |
| Promień karty | 0px |
| Cienie | nie - granice zamiast cieni |
| Między sekcjami | 86-108px |
| Szerokość strony | 1400px |
Sztuczna inteligencja zbuduje Twoją witrynę w stylu ThoughtLab i wypełni ją
- Uzupełnij produktami i postami za pomocą linku - Instagram, TikTok, Facebook.
- Przenieś zawartość ze starej witryny — wystarczy podać adres.
- Nowoczesny design na najlepszym silniku: React ( Next.js) z renderowaniem serwerowym i optymalizacją SEO od razu po wyjęciu z pudełka.
- W pełni zautomatyzowana optymalizacja SEO dla wyników wyszukiwania i rekomendacje sieci neuronowych.
Podobne style
- Vivid+Co — światło pryzmatyczne przechodzące przez obsydian
- Sequel — Prywatny pokaz po zmroku to jedyne ciepłe światło w ciemnym kinie.
- Dovetail — Plan pod czarnym księżycem – ledwo widoczne linie wykresu, biała czcionka, jeden fioletowy błysk
- MekaVerse — Monochromatyczna galeria cyfrowych artefaktów — jednolita, czarna pustka, w której wyrenderowany świat wisi niczym eksponat muzealny, a cały interfejs użytkownika jest wykonany białą farbą na matowym czarnym szkle.
- Krea — galeria noir o północy
- Factory — Terminal „pokoju wojennego” o północy. „Fabryka” to surowy, czarny panel sterowania, na którym pojedyncza biała karta ląduje niczym oświetlona latarką dyspozytornia – jedynym przedmiotem w pomieszczeniu jest samo dzieło.
- basement — Pusta maszyna drukarska o trzeciej nad ranem – ogromne, skompresowane czcionki rozciągające się po czarnej smole, pojedynczy promyk pomarańczowego światła na pasku nawigacyjnym, wszystko inne białe lub upiornie szare.
- Stink Studios — Studio filmowe o północy – projektor brzęczy, w pomieszczeniu jest ciemno, oświetlony jest tylko film
- Apple (España) — czarny teatr z oświetlonymi oprawami
- Charlie — Typografia wyrzeźbiona w kamieniu klasztornym na obsydianie. Portfolio, w którym pojedyncza czerwona ściana tworzy ogłuszającą ciszę.
- Rive — Precyzyjna wizja nocna. Interfejs wyposażony jest w specjalny obiektyw, który przenika ciemność, umożliwiając precyzyjne widzenie szczegółów technicznych.
- Datalands — Czarna katedra z pojedynczym neonowym impulsem. Logo wypełnia nawę; reszta to ledwo słyszalny tekst pod spodem.