Framer
neon galeria hutsunean
Framerrak ia iluntasun oso gisa funtzionatzen du — mihise beltz bat, non edukia galeria baten inaugurazioko neon-errotulu baten antzera hegan egiten duen. GT Walsheim Medium koloreko izenburuek, 0,8-1,1eko lerroarte estuarekin eta letra-tarte negatibo oldarkorrarekin (-0,04em 54px-tan), letra-tipo trinkotu eta apaingarri bat sortzen dute, orrialdean txukun kokatu beharrean aurrera egiten duena. Urdin elektriko bakar batek (#0099ff) funtzio-xehetasun guztiak ematen ditu —ertzak, distira, ikonoak, egoera aktiboak—, interfazearen gainerakoa akromatikoa den bitartean, trantsizio gris sotiletan oinarrituta (#111, #171717, #242424) beltz hutsetik sakontasuna sortzeko. Osagaiak apaingarriak baino kontsideratuak dirudite: 8-25px-ko erradio biribilduak, 1px-ko ertz meheak, itzal paralelo minimoak eta hutsunea distira egiten uzten duten gainazal zeharrargiak.
Zabalera osoko atalak mihise beltzaren haratago hedatzen dira, edukia gehienez ~1200px-ko zabalerara mugatuta eta barruan zentratuta. Atal nagusiak goiburua ezkerrean lerrokatuta eta ekintzarako dei (CTA) botoia ditu, eskuineko aldea nahita hutsik utzita —asimetrikoki, ez zentratuta—. Atalek testu-diseinu soilak (goiburu handia + azpitestua) eta produktuen pantaila-argazkiak txandakatzen dituzte. "Markoarekin dator" atalak logotipo-horma bat erabiltzen du 4 zutabeko sareta batean. Komunitatearen atalean, produktuaren pantaila-argazkia erdian dagoen zabalera osoko edukiontzi batean kokatzen da, izkin biribilduekin. Nabigazioa minimoa da —goiko barra mehe bat, logotipoa ezkerrean eta estekak eskuinean lerrokatuta, kontrolik gabe. Atalen erritmoa: 80px-ko tarte bertikal nabarmenak atalen artean, hutsunean flotatzen duten eduki-uharte bereiziak sortuz.
Produktuaren erabiltzaile-interfazearen pantaila-argazkiak dira nagusi: semaforo-puntuak dituen kromo itxurako leiho batek inguratuta, aplikazioaren pantaila-argazki txertatuak bihurtzen dira irudi nagusi. Kalitatearen froga diren logotipoak letra zuriz aurkezten dira atzealde beltz batean, tarte zabalekin. Ez da argazkirik, ilustraziorik edo grafiko abstrakturik erabiltzen; hizkuntza bisuala produktua bera da, interfaze bizidun gisa erakutsita. Ikonoen estiloa: minimalista, zirriborratua, monokromoa eta zuria tamaina txikietan. Testuaren dentsitatea: nagusiki testua, noizean behin produktuaren pantaila-argazkien moduan zati handi batzuekin. Espazioaren oreka bisualak tipografia nabarmentzen du irudien gainetik.
Paleta
Marka
- Vivid Violet
#0066ff— Ekintza-botoi nagusia da interfazean kolore bakarreko botoi-atzeko planoa bistaratzen den leku bakarra.
Neutroa
- Bone
#ffffff— Izenburu nagusiak, testu nagusia atzealde ilun batean, botoien atzealdea argi iturri bakarra da. - Void
#000000— Orriaren mihisea, nabigazio-atzeko planoa, txartelen gainazalak, ikonoen betegarria... dena kolore beltz amaigabe batez osatuta dago, funtsezkoak ez diren eduki guztiak xurgatzen dituena. - Graphite
#111111— Karta-gainazal altxatuak hutsunearen gainetik daude: txartel handiak eta funtzionalak eta modal-ontziak. - Obsidian
#171717— Botoietarako, txartel gehigarrietarako, UI betegarrietarako tarteko gainazala - elementu interaktiboak mihisetik bereizten ditu. - Slate
#242424— Gainazalaren gainetik pasatzen zarenean, sarrera-eremuak eta panel indentatuek kolore neutro distiratsuena dute testu formatura aldatu aurretik. - Ash
#333333— Bete sakona atzeko planoko irudi inaktiboetarako eta egitura-elementuetarako.
Tipografia
12tik 68px-ra · 8 urrats
- sans-serif — ordezkapena: Inter · eskemak 400 · sans-serif - ateratako datuetan aurkitu da, baina ez du IA-k deskribatu.
- GT Walsheim — ordezkapena: Inter Tight · eskemak 500 · Izenburu eta izenburuen letra-tipoa markaren letra-tipoa da. Erasokorki trinkotua da, 0,8–1,1eko lerroartearekin eta -0,04em eta -0,05em arteko letren arteko tartearekin, 44–68px tartean. Ez da elementu apaingarri bat; GT Walsheim-en berotasun geometrikoak, metrika zorrotzekin konbinatuta, sistemaren ahotsa sortzen du: ziurra, trinkoa eta apur bat futurista. Antzeko adierazpen geometrikorako, kontuan hartu Inter Tight edo Space Grotesk Bold.
- Inter Variable — ordezkapena: Inter · eskemak 400 · Testu nagusia, nabigazioa eta bigarren mailako goiburuak dira lan-zaldia. Aldagai arteko ardatzak pisuen interpolazio leuna ahalbidetzen du. Jarraipena estutzen da tamaina handitzen den heinean: -0.001em-tik 18px-ra eta -0.027em-tik 22px-ra. Bertsio aldakorrak gunearen mikroanimazio leunak ahalbidetzen ditu. Ordezkoa: Inter ( Google) – ia berdin-berdina den ordezko bat.
Tarteak eta forma
| Helburua | Esanahia |
|---|---|
| Dentsitatea | batez bestekoa |
| Oinarrizko urratsa | 10px |
| Botoiaren erradioa | 9999px |
| Txartelaren erradioa | 20px |
| Itzalak | ez - itzalen ordez ertzak |
| Atalen artean | 80px |
| Orriaren zabalera | 1200px |
Adimen artifizialak zure webgunea Framer estiloan eraikiko du eta beteko du
- Bete produktu eta argitalpenekin estekaren bidez - Instagram, TikTok, Facebook.
- Transferitu edukia zure gune zaharretik: zehaztu helbidea.
- Diseinu modernoa motor onenean: React ( Next.js) zerbitzariaren errendatzearekin eta SEO optimizazioarekin hasieratik.
- Bilaketa-emaitzetarako eta sare neuronalen gomendioetarako SEO optimizazio guztiz automatizatua.
Estilo antzekoak
- Auros — Abisal terminala datu-bola biolumineszenteekin
- Origin Financial — Gauerdiko galeria oparoa eta isila. Gela isila eta ia iluna, non serif letra-tipo handiek eta koloretako panel argiztatu batzuek finantzak arretaz zaindutako artelan bat direlako sentsazioa sortzen duten.
- Raycast — Gauerdiko Komando Zentroa, Coral Neon
- Dimension — beirazko panel izoztuak dituen ilunabarrean argiztatutako lan-estazioa
- Reflect Notes — Izarrez estalitako bioleta espazioa behatoki ilun bat da, non notak konstelazioak bezala flotatzen diren ia beltz koloreko hutsune baten atzealdean.
- Ameba — Gauerdiko kontrol-gela – beirazko panel izoztuen barruan pultsu urdin elektriko bat
- Branding — Galeria-horma beltza, odol-gorri koloreko azentuak - Letra-tipo zuri handiak hutsune baten antza duen mihise ilun batean flotatzen dute, azentu gorri distiratsu bakar batek eta web interfazea baino galeria-seinaleen antza handiagoa duten elementu apaingarri deigarriek etendatuta.
- Harness — Misio Kontrola gauerdian, azentu berde fosforeszenteekin
- Koto — Obsidian Galeria gauerdian. Ia ilun-iluneko eszenatokia, non argi-iturri epel bakarra errotuladore hori bakarra den, eta letra trinkotuak erakusketako kartelak bezala flotatzen diren espazio negatibo zabalean.
- Ohzi — Kubo distiratsu bat galeria ilun batean esekita
- Depot — Zerbitzari terminal ilun bat. Garatzaile kontsola ia beltza, lanaren hasiera adierazten duen LED berde bakarrarekin, eta erabiltzaile interfazearen gainerakoa grafitoz bistaratzen da.
- Maciej Zadykowicz — Midnight Gallery, bere kaleidoskopiko muralarekin, estudioko horma ia beltz bat da, non artelan tipografiko bizi eta koloretsu batek arreta erakartzen duen, beste guztia isilik eta nahitaez mantentzen den bitartean.