Auros
Terminal abissal amb boles de dades bioluminescents
Auros funciona com una terminal fintech situada a l'abisme: un llenç turquesa gairebé negre amb orbes de dades bioluminescents i gradients de llum del turquesa al rosa, creant una sensació de profunditat, fluïdesa i flux. La interfície és minimalista i cinematogràfica, basant-se en una sola pantalla d'usuari (Matter) de gruix mitjà amb un seguiment negatiu agressiu per crear escala sense ser massa cridanera. Els colors es distribueixen uniformement: els blancs i platejats acromàtics s'utilitzen per a gairebé tot el contingut, mentre que la paleta cromàtica es reserva per a gradients atmosfèrics, que distingeixen les superfícies de les cartes, i un únic botó característic en forma de píndola que canvia de color del blau turquesa al rosa lavanda. Les cartes suren sobre subtils crestes superficials turqueses (radi de 16 px, sense ombres) en lloc d'alçada, de manera que la jerarquia es percep com la profunditat de l'aigua en lloc d'una ombra sobre el paper. Els components semblen reflexius i instrumentals: marques de seguiment en majúscules, icones de fletxa geomètriques primes, grans lectures numèriques en rosa pàl·lid.
Un llenç fosc d'amplada completa amb contingut d'una amplada màxima de 1440 px. L'element principal és un bloc de text centrat (brow → headline → subtext → call to action) que abasta tota l'alçada de la finestra gràfica, amb una partícula com a element de fons. Les seccions són franges d'amplada completa separades per grans espais verticals de més de 68 px, que alternen entre llenç i superfícies lleugerament enretirades. La secció "Explore" utilitza un disseny asimètric de dues columnes: la columna esquerra conté targetes de funcions apilades, mentre que la columna dreta presenta una il·lustració molecular geomètrica. El contingut està centrat en columnes estretes (màxim ~600 px) per facilitar la lectura, en lloc d'estendre's de vora a vora. El peu de pàgina és un fossat enretirat (#011d1c) amb un marge vertical de 120 px, creant l'efecte d'una piscina profunda. La navegació és un panell prim i transparent amb elements espaiats entre 16 i 24 px. El ritme general és cinematogràfic i espaiós: cada secció respira, i l'esquema de colors profund, semblant a l'aigua, crea la sensació de caure més profund amb cada passatge.
L'estil visual és minimalista i atmosfèric. La pàgina d'inici presenta una esfera de partícules tridimensional: milers de petits punts blau turquesa i blancs que formen una esfera giratòria que reflecteix el llenç i detalls de color rosa lavanda a les vores, creant un efecte bioluminescent que recorda un objecte d'informació. Els diagrames moleculars geomètrics plans (cercles blancs i línies de connexió primes sobre un llenç fosc) serveixen com a elements decoratius a la columna dreta. Ni fotografies, ni imatges d'estil de vida, ni persones: el llenguatge visual es basa en gràfics de dades nets i formes abstractes. L'esfera de partícules és l'element visual que defineix la identitat de la marca; ha d'aparèixer almenys una vegada a cada pàgina important per reforçar la metàfora de les profunditats marines.
Paleta
Marca
- Liquid Abyss
#012624— El fons principal és la base de la pàgina, la capçalera, l'element principal i el camp turquesa fosc dominant. Crea una atmosfera marina profunda. - Liquid Deep
#011d1c— El nivell superficial encastat és el fons del peu de pàgina i els panells de cartró més profunds. Es percep com un mig to més fosc que el llenç, creant un subtil gradient de profunditat descendent. - Liquid Kelp
#003734— Superfície de la targeta en relleu i farciment del botó: una superfície en relleu situada un esglaó per sobre de l'abisme. S'utilitza per a targetes de funcions, panells de contingut i el punt inicial d'un botó de degradat.
Neutral
- Liquid Mist
#edfffe— Un to blanc fred ressalta el cos del text, els encapçalaments de les seccions i la tipografia càlida i clara. Un subtil to blau lliga el cos del text a l'esquema de colors turquesa. - Platinum
#ffffff— El blanc pur s'utilitza per a encapçalaments, elements de navegació, contorns d'icones i text d'alt contrast. És el color de text principal en tots els nivells d'encapçalament i a la navegació principal. - Silver Mist
#bbc7c6— Text secundari, descripcions apagades i color d'enllaç en el seu estat original. Tenen un lleuger to verdós que complementa el fons turquesa. - Ash
#f2f2f2— Text addicional per a cites i ressenyes. Un to gris neutre i fred per quan el to turquesa de Silver Mist es veu massa brillant. - Slate Deep
#707777— Un tint superficial subtil per a fons inactius o de baixa visibilitat. Es situa entre el llenç i el cartró, proporcionant una diferència d'alçada molt subtil. - Lavender Phosphor
#fde9ff— Color de retroiluminació per a estadístiques grans, números de comptadors i mètriques importants. El to rosat del degradat característic s'utilitza amb moderació com a accent lluminós en superfícies fosques.
Tipografia
de 10 a 96 px · 6 passos
- Matter — reemplaçament: Inter · esquemes 400, 500 · La font principal per als encapçalaments i el text del cos s'utilitza amb un pes de 500 per a tots els encapçalaments (H1–H3) i text cinètic gran (86–295 px). S'utilitza un pes de 400 per al text del cos i el text de la interfície d'usuari. Presenta un espaiat entre lletres negatiu agressiu en mides grans (-0,04 em a 61 px, -0,046 em a 86 px) i un espaiat entre lletres positiu ampli en majúscules de títol (0,08 em a 20 px, 0,12 em a 12 px, 0,15 em a 10 px). L'estratègia d'utilitzar només un pes mitjà per als encapçalaments és una característica distintiva (no utilitzar lletra negreta ni clara) que dóna a la font una confiança uniforme i mecànica.
- Arial — reemplaçament: system-ui · esquemes 400 · Una alternativa secundària per a elements interactius de la interfície d'usuari (navegació, botons, microcòpia de la capçalera, peu de pàgina). Només apareix a 14 px; s'utilitza com a alternativa segura i universal quan no es carrega Matter i cobreix les etiquetes dels formularis, el text dels botons i el text auxiliar petit.
Intervals i forma
| Propòsit | Significat |
|---|---|
| Densitat | mitjana |
| Pas bàsic | 20px |
| Radi del botó | 6px |
| Radi de la targeta | 16px |
| Ombres | sense vores en comptes d'ombres |
| Entre seccions | 68px |
| Amplada de la pàgina | 1440px |
La IA crearà el vostre lloc web a l'estil Auros i l'omplirà.
- Omple amb productes i publicacions a través de l'enllaç: Instagram, TikTok, Facebook.
- Transfereix contingut del teu lloc web antic; només cal que especifiquis l'adreça.
- Disseny modern en el millor motor: React ( Next.js) amb renderització de servidor i optimització SEO des del primer moment.
- Optimització SEO totalment automatitzada per a resultats de cerca i recomanacions de xarxes neuronals.
Estils similars
- Design Full-Time — un cinema d'estudi amb un focus càlid
- Air — escultura "Cel de mitjanit a través del vidre"
- Slash — Volta de mitjanit amb llibres majors daurats
- Raycast — Centre de Comandament de Mitjanit, Coral Neon
- Dimension — una estació de treball il·luminada al capvespre amb panells de vidre esmerilat
- Modal — Un terminal fosforescent en una sala de servidors fosca: l'única font de llum és un color verd brillant.
- Giga — Horitzó de mitjanit sobre obsidiana glaçada
- Reflect Notes — L'espai estrellat violeta és un observatori fosc on les notes suren com constel·lacions sobre un fons de buit gairebé negre indi.
- Ameba — La sala de control a mitjanit: un pols blau elèctric dins dels panells de vidre glaçat
- AgentQL — Aurores boreals sobre la terminal a la nit
- Frame — Un cinema per a projeccions de pel·lícules a altes hores de la nit. Una sala fosca on un únic focus blau fa tota la feina i la interfície d'usuari retrocedeix en segon pla, permetent que el contingut creatiu es projecti cap endavant.
- Harness — Control de Missió a mitjanit amb detalls verds fosforescents