Framer
неонска галерија во празнината
Фрајмерот функционира како речиси целосна темнина - црно платно каде што содржината лебди како неонски знак на отворање на галерија. Насловите, поставени во GT Walsheim Medium со мал растојание помеѓу линиите од 0,8–1,1 и агресивен негативен растојание помеѓу буквите (-0,04em на 54px), создаваат кондензиран, декоративен фонт кој се движи напред, наместо да стои уредно на страницата. Една електрично сина боја (#0099ff) ги обезбедува сите функционални акценти - граници, сјај, икони, активни состојби - додека остатокот од интерфејсот останува ахроматски, потпирајќи се на суптилни сиви транзиции (#111, #171717, #242424) за да создаде длабочина од чиста црна боја. Компонентите се чувствуваат разгледани, а не декоративни: заоблени радиуси од 8–25px, тенки граници од 1px, минимални сенки и проѕирни површини што дозволуваат празнината да свети.
Секциите со целосна ширина се протегаат надвор од црното платно, со содржина ограничена на максимална ширина од ~1200px и центрирана внатре. Главниот дел има заглавие порамнето лево и едно копче за повик за акција (CTA), при што десната страна е намерно оставена празна - асиметрично, нецентрирана. Секциите се менуваат помеѓу распореди само со текст (голем заглавие + подтекст) и снимки од екранот на производот. Делот „Доаѓа со Framer“ користи ѕид со лого во мрежа од 4 колони. Во делот за заедницата, снимката од екранот на производот е поставена во центриран контејнер со целосна ширина со заоблени агли. Навигацијата е минимална - тенка горна лента со логото лево и врски порамнети десно, без видливи контроли. Ритам на секциите: значителни вертикални празнини од 80px помеѓу секциите, создавајќи различни острови на содржина што лебдат во празнината.
Снимките на екранот од корисничкиот интерфејс на производот доминираат - врамени со прозорец сличен на хром со точки на семафор, вградените снимки на екранот од апликацијата стануваат главна слика. Логоата, кои служат како доказ за квалитет, се претставени со бели букви на црна позадина со голем простор. Не се користат фотографии, илустрации или апстрактна графика - визуелниот јазик е самиот производ, прикажан како жив интерфејс. Стил на икони: минималистички, со контури, монохроматски и бел во мали димензии. Густина на текстот: претежно текст, со повремени големи фрагменти во форма на снимки на екранот од производот. Визуелната рамнотежа на просторот јасно ја фаворизира типографијата пред сликите.
Палета
Бренд
- Vivid Violet
#0066ff— Примарното копче за дејство е единственото место во интерфејсот каде што се прикажува позадина на копчето во еднобојна боја.
Неутрално
- Bone
#ffffff— Главни наслови, главен текст на темна позадина, позадината на копчињата е единствениот извор на светлина. - Void
#000000— Платното на страницата, позадината за навигација, површините на картичките, пополнувањето со икони - сè е во бесконечна црна боја што апсорбира сета неважна содржина. - Graphite
#111111— Подигнатите површини на картичките се чекор над празнината - големи, функционални картички и модални контејнери. - Obsidian
#171717— Средна површина за копчиња, дополнителни картички, пополнувања на корисничкиот интерфејс - ги одделува интерактивните елементи од платното. - Slate
#242424— При поставување на курсорот, полињата за внесување и вдлабнатите панели се најсветлата неутрална нијанса пред да се префрлат на текстуален формат. - Ash
#333333— Длабоко пополнување за неактивни позадински слики и структурни елементи.
Типографија
од 12 до 68px · 8 чекори
- sans-serif — замена: Inter · контури 400 · sans-serif - пронајден во извлечените податоци, но не е опишан од вештачката интелигенција.
- GT Walsheim — замена: Inter Tight · контури 500 · Фонтот за наслови и наслови е фонтот на брендот. Тој е агресивно кондензиран, со растојание помеѓу редовите од 0,8–1,1 и растојание помеѓу буквите од -0,04em до -0,05em во опсег од 44–68px. Не е декоративен елемент; геометриската топлина на GT Walsheim, во комбинација со строги метрики, го создава гласот на системот - самоуверен, компактен и малку футуристички. За сличен геометриски израз, разгледајте го Inter Tight или Space Grotesk Bold.
- Inter Variable — замена: Inter · контури 400 · Главниот текст, навигацијата и секундарните наслови се главната работна сила. Оската Inter Variable овозможува непречено интерполирање на тежините. Следењето се стеснува со зголемувањето на големината: од -0,001em на 18px и на -0,027em на 22px. Верзијата со променливи овозможува непречени микроанимации на страницата. Замена: Inter ( Google) – практично идентична резервна опција.
Интервали и форма
| Намена | Значење |
|---|---|
| Густина | просек |
| Основен чекор | 10px |
| Радиус на копчето | 9999px |
| Радиус на картичката | 20px |
| Сенки | без граници наместо сенки |
| Помеѓу деловите | 80px |
| Ширина на страницата | 1200px |
Вештачката интелигенција ќе ја изгради вашата веб-страница во стилот Framer и ќе ја пополни
- Пополнете со производи и објави преку линкот - Instagram, TikTok, Facebook.
- Пренесете содржина од вашата стара страница - само наведете ја адресата.
- Модерен дизајн на најдобриот мотор: React ( Next.js) со рендерирање на серверот и SEO оптимизација веднаш.
- Целосно автоматизирана SEO оптимизација за резултати од пребарување и препораки за невронски мрежи.
Слични стилови
- Graphite — Светлечка крајна мрежа. Создавајте темни, ограничени површини на производот околу прецизни бели типографски ознаки и повремени трепкања на спектрална светлина.
- Linearity — Светлечка студиска конзола. Создавајте екрани со минималистички црни работни простори со чист бел интерфејс, хромирани акценти и повремени допири на стопена портокалова боја.
- Featurebase — Конзола осветлена со виолетова боја. Замислете ја секоја страница како темна, тивка сцена, со светлечки работен простор за производот што излегува од долниот раб.
- Nuxt — Терминалите светат во длабоката вселена. Создавајте темни, затворени интерфејсни рамнини каде што зелената боја се појавува како напојуван сигнал наспроти сино-црни површини.
- Auros — Абисален терминал со биолуминисцентни топчиња за податоци
- Origin Financial — Полноќна галерија на тивок раскош. Тивка, речиси темна просторија каде што големите сериф фонтови и неколку осветлени панели во боја создаваат чувство дека финансиите се внимателно курирано уметничко дело.
- Raycast — Полноќен команден центар, Корал Неон
- Dimension — работна станица осветлена во самрак со мат стаклени панели
- Reflect Notes — Ѕвезденовиолетовиот простор е темна опсерваторија каде што нотите лебдат како соѕвездија на позадина од речиси црна индиго празнина.
- Ameba — Контролната соба на полноќ – електрично син пулс во мат стаклени панели
- Branding — Црн галериски ѕид, крваво црвени акценти - Големи бели фонтови лебдат на темно платно кое наликува на празнина, прекината од еден светло црвен акцент и впечатливи декоративни елементи кои повеќе личат на галериски знаци отколку на веб-интерфејс.
- Harness — Контрола на мисијата на полноќ со фосфоресцентни зелени акценти