Sari la conținut

Sistem de design

Fiecare valoare de pe pagina asta e un token. Dacă nu apare aici, site-ul nu o folosește. Aprobă direcția aici, înainte ca restul site-ului să fie construit peste ea.

Document
Sistem de design
Revizie
A
Data
2026-10-18
Stare
În revizuire

01

Culoare

Douăsprezece valori. Negrul poartă pagina, albul poartă textul, auriul marchează ce poți acționa, argintiul e materialul.

T1 Paleta, cu contrastul măsurat față de fundalul paginii
MostrăTokenValoareRolContrast pe bgPe surfaceText normal
--bg#0A0A0BFundalul paginii. Negru cald, niciodată negru pur.1.001.05Fundal
--surface#111113Carduri și panouri.1.051.00Fundal
--surface-2#17171AHover și zone ridicate.1.111.05Fundal
--line#26262BBorduri, linii și grile de 1px.1.311.25Doar decorativ
--text#EDEDEATextul principal. Alb cald, niciodată alb pur.16.8716.08AAA
--text-muted#9A9AA2Text secundar și cheile adnotărilor.7.086.75AAA
--text-dim#5E5E66Doar linii fine și stări dezactivate.3.082.94Doar text mare
--silver#C3C7CEMaterialul: metal, iconițe, valorile adnotărilor.11.6711.12AAA
--silver-bright#E3E6EAReflexii pe metal, hover pe detalii argintii.15.8115.06AAA
--gold#C9A54CLinkuri, butoane de acțiune, trasee de circuit aprinse.8.458.06AAA
--gold-bright#E8C872Auriu la hover, inele de focus, vârful unei străluciri.12.1911.62AAA
--signal#FFD23FUn singur element live pe ecran, de exemplu LED-ul de disponibilitate.13.7013.06AAA

02

Valori maxime absolute

Limite pe care designul nu le depășește niciodată. Depășirea uneia e un bug, nu o alegere de stil.

T2 Limitele designului și cum e verificată fiecare
ParametruMaximVerificat de
Suprafață aurie10 % din ecranContor de pixeli în scena 3D, test e2e din Faza 2
Galben de semnal1 element pe ecranRegulă de componentă, test e2e din Faza 1b
Blocuri de adnotări3 pe ecranTest e2e din Faza 1b
Familii de fonturi2Încărcarea fonturilor în layout-ul rădăcină
Umbre și blur0Eliminate din tema Tailwind, test unitar
Rază de colț6 pxEliminată din tema Tailwind, test unitar
Culori din afara paletei0Test unitar pe fiecare fișier sursă
GradiențiDoar linii fine de la negru la grafitTest unitar pe fiecare componentă

03

Tipografie

Două familii. Geist pentru tot ce se citește, Geist Mono pentru date: numere, coordonate, revizii.

T3 Scara tipografică, cu texte reale de pe site

  1. display

    64–160 px

    0.90

    −4.5 %

    Geist

    Miroslav Maletici

  2. 4xl

    44–96 px

    0.98

    −3.5 %

    Geist

    De la siliciu la inteligență

  3. 3xl

    32–60 px

    1.04

    −3.0 %

    Geist

    Scriu codul care atinge hardware-ul.

  4. 2xl

    24–36 px

    1.15

    −2.0 %

    Geist

    StrawBoss

  5. xl

    20–26 px

    1.35

    −1.5 %

    Geist

    Construiesc de la registru în sus: firmware, AI și aplicațiile de deasupra, pentru clienți și pentru produsele Solemtrix.

  6. lg

    18–20 px

    1.50

    −1.0 %

    Geist

    Trasabilitate la nivel de balot pentru biomasa agricolă, de la câmp la depozit.

  7. base

    16–17 px

    1.60

    −0.5 %

    Geist

    Din februarie 2026 scriu firmware la Axon, în Timișoara. Înainte am făcut două stagii la Nokia și am lucrat șapte luni ca junior security researcher la Bitdefender. Din septembrie 2026 predau laboratoare de Arhitectura Calculatoarelor la Politehnica.

  8. sm

    14 px

    1.50

    0

    Geist

    Textul secundar coboară o treaptă, ca mărime și ca nuanță.

  9. xs

    13 px

    1.50

    0

    Geist Mono

    REV E / 2026-09 / Timișoara 45.76° N 21.23° E

  10. micro

    11 px

    1.45

    2.0 %

    Geist Mono

    CORE 02 / În producție

Verificarea caracterelor

Literele românești cu virgulă dedesubt, plus simbolurile de care are nevoie limbajul de datasheet. Orice glifă desenată cu un font de rezervă apare întâi aici.

Geist

  • Ă
  • Â
  • Î
  • Ș
  • Ț
  • ă
  • â
  • î
  • ș
  • ț
  • µ
  • °
  • ±
  • ×
  • –
  • —
  • /
  • 0
  • 1
  • 2
  • 4
  • 6
  • 7
  • 9

Geist Mono

  • Ă
  • Â
  • Î
  • Ș
  • Ț
  • ă
  • â
  • î
  • ș
  • ț
  • µ
  • °
  • ±
  • ×
  • –
  • —
  • /
  • 0
  • 1
  • 2
  • 4
  • 6
  • 7
  • 9

04

Spațiere și rază

O grilă de 4px. Layout-ul folosește doar treptele astea, desenate aici ca linii de cotă.

T4 Treptele de spațiere
TreaptăpxremDesenat la scară
140.25rem
280.5rem
3120.75rem
4161rem
5201.25rem
6241.5rem
8322rem
10402.5rem
12483rem
16644rem
24966rem
321288rem
4819212rem

Grilă

Coloane
12
Margine
16–48 px
Spațiu între coloane
16–24 px
Container
1440 px
Spațiu între secțiuni
96–176 px
Lungimea rândului
62 ch

Detaliul A: raze de colț, scara 6 la 1

Nimic de pe site nu e mai rotunjit de 6 px. Cardurile folosesc 2 px, la fel ca butoanele.

  • none

    0 px

  • xs

    2 px

  • sm

    4 px

  • md

    6 px

05

Controale

Trei tipuri de acțiune. Auriu pentru singurul lucru pe care ți-l cere un ecran, o linie pentru restul, text auriu simplu pentru linkuri.

T5 Stările butoanelor
VariantăNormalHoverFocusApăsatDezactivat
PrincipalTrimite un mesaj, NormalTrimite un mesaj, HoverTrimite un mesaj, FocusTrimite un mesaj, ApăsatTrimite un mesaj, Dezactivat
SecundarDescarcă CV-ul, NormalDescarcă CV-ul, HoverDescarcă CV-ul, FocusDescarcă CV-ul, ApăsatDescarcă CV-ul, Dezactivat
LinkCitește studiul de caz, NormalCitește studiul de caz, HoverCitește studiul de caz, FocusCitește studiul de caz, ApăsatCitește studiul de caz, Dezactivat

Încearcă-le

Folosește mouse-ul și tasta Tab. Inelul de focus e același peste tot.

Folosit doar ca să-ți răspund.

Scrie o adresă de email, de exemplu [email protected].

06

Componente

Construite din tokenii de mai sus. Fiecare proiect de pe site e un nucleu pe cip, așa că fiecare card are o hartă a die-ului.

CORE 02

StrawBoss

O aplicație mobilă și un dashboard web care urmăresc biomasa agricolă de la câmp la depozit, balot cu balot, pentru certificare de sustenabilitate (ISCC / RED III).

Stare În producție

  • Next.js
  • NestJS
  • Expo
  • Supabase
  • PostGIS
  • încă 1

Solemtrix

Studioul din spatele acestor proiecte

Solemtrix e studioul pe care l-am fondat: software la comandă și produse proprii. SolCane, StrawBoss și ADMINISTRATIVO sunt produse Solemtrix.

Fondat
TODO: data înființării
Domeniu
Software, AI, hardware
Oraș
TODO: oraș de confirmat
Disponibil pentru proiecte

Apare doar după ce îți confirmi disponibilitatea.

Etichete

  • Next.js
  • NestJS
  • Expo
  • Supabase
  • PostGIS
  • BullMQ

Conținut lipsă

TODO: numele bastonului

Tot ce nu e confirmat rămâne vizibil așa, ca să nu fie inventat nimic.

Grain

O textură statică de zgomot peste fundal, amestecată astfel încât negrul să rămână negru. Oprește-o ca să compari.

Placă
180 px
Frecvență
0.85
Octave
3
Opacitate
0.55
Amestec
overlay

07

Mișcare

Scurtă, precisă și mereu cu un motiv. Patru durate pentru schimbări, un ritm pentru LED și trei curbe acoperă fiecare animație de pe site.

T7 Caracteristici de timp
TokenTimpFolosit pentruFormă de undă
--dur-fast160 msHover, apăsare, focus
--dur-base320 msSchimbări de stare, apariția paragrafelor
--dur-slow640 msDecodarea titlurilor, schimbarea secțiunii
--dur-journey1200 msMișcările camerei între straturile cipului
--dur-led2400 msRespirația LED-ului de semnal, singura buclă de pe site

Curbe

--ease-outSosire: apariții, hover
--ease-in-outDeplasare: camera, intrarea într-un studiu de caz
linearFlux: pulsul LED-ului, lumina de-a lungul unui traseu

Mostre

Nimic de aici nu se mișcă până nu ceri. Cu mișcarea oprită, fiecare mostră arată starea finală.

Decodarea titlului

De la siliciu la inteligență

Apariția paragrafului

Textul apare o singură dată, când stratul lui de cip intră în cadru, și nu mai apare a doua oară în aceeași vizită.

Lumină de-a lungul unui traseu

08

Gramatica adnotărilor

Note mici în monospace, ca pe marginile unui datasheet. Conțin date reale sau nimic.

Reguli

  • Fiecare valoare e reală sau marcată TODO.
  • Cheile în gri, valorile în argintiu, cel mult o valoare în auriu.
  • Cel mult trei blocuri de adnotări pe ecran.
  • Date ISO (2026-10), linie de pauză pentru intervale (2023–2024), spațiu înainte de unități.
  • Majuscule doar pentru identificatori: numele secțiunilor, REV, numerele nucleelor.

Exemple

  • Antet de secțiune

    Secțiune
    01 / SILICON
    Stack
    Linux, C/C++, embedded
    Din
    2026-02
    Org
    Axon
  • Nucleul unui proiect

    Nucleu
    02
    Poziție
    Slotul 2 din 8
    Stare
    În producție
  • Revizie de carieră

    Rev
    E
    Data
    2026-09
    Schimbare
    Master în AI, predare la UPT
  • Locație

    Nod
    Timișoara
    Lat
    45.76° N
    Lon
    21.23° E
  • Build

    Build
    2e3459a
    Ora
    2026-10-19T16:34Z
    Scripturi terțe
    0
  • Stare live

    Probă
    administrativo.ro
    Ultima verificare
    —
    Rezultat
    În așteptare, conectat în Faza 5

09

Text

La persoana întâi și concret: ce am construit, cu ce, pentru cine. Alege rândul care deschide site-ul.

Variante pentru linia de poziționare

  1. 01

    Inginer firmware la Axon. Predau Arhitectura Calculatoarelor la UPT și construiesc produse hardware-software la Solemtrix.

    EnglezăFirmware engineer at Axon. I teach Computer Architecture at UPT and build hardware-software products at Solemtrix.

  2. 02

    Construiesc de la registru în sus: firmware, AI și aplicațiile de deasupra, pentru clienți și pentru produsele Solemtrix.

    EnglezăI build from the register up: firmware, AI and the apps on top, for clients and for our own products at Solemtrix.

    Implicit
  3. 03

    De la siliciu la inteligență. Firmware de meserie, arhitectura calculatoarelor la UPT, SolCane pentru nevăzători la Solemtrix.

    EnglezăFrom silicon to intelligence. Firmware by trade, computer architecture at UPT, SolCane for blind people at Solemtrix.

  4. 04

    Scriu codul care atinge hardware-ul. Nokia, apoi cercetare în securitate la Bitdefender, acum firmware la Axon și Solemtrix, studioul meu de software.

    EnglezăI write the code that touches hardware. Nokia, then security research at Bitdefender, now firmware at Axon, and Solemtrix, my software studio.

  5. 05

    Inginer firmware în Timișoara. Construiesc lucruri care trebuie să funcționeze în lumea reală: un baston inteligent, o platformă de HR, un sistem de trasabilitate într-o fermă.

    EnglezăFirmware engineer in Timișoara. I build things that have to work in the real world: a smart cane, an HR platform, a traceability system on a farm.

Cuvinte pe care site-ul nu le folosește

Un test unitar oprește build-ul dacă unul dintre ele apare în vreun mesaj.

  • elevate
  • unlock
  • seamless
  • cutting-edge
  • revolutionize
  • solutions tailored to your needs
  • passionate
  • empower
  • leverage
  • game-changing
  • next-level
  • innovative solutions
  • lorem ipsum
  • a revoluționa
  • de ultimă generație
  • soluții personalizate
  • pasionați de