Framer
خالي جاءِ ۾ نيون گيلري
فريمر تقريبن مڪمل اونداهي جي طور تي ڪم ڪري ٿو - هڪ ڪارو ڪينواس جتي مواد گيلري جي افتتاح تي نيون نشاني وانگر لڙڪندو آهي. هيڊ لائنون، GT والشيم ميڊيم ۾ 0.8-1.1 جي تنگ لائن اسپيسنگ ۽ جارحاڻي منفي اکر اسپيسنگ (-0.04em 54px تي) سان سيٽ ڪيون ويون آهن، هڪ گاڑھا، آرائشي ٽائيپ فيس ٺاهيو جيڪو صفحي تي صاف طور تي ويهڻ جي بدران اڳتي ڌڪيندو آهي. هڪ واحد برقي نيرو (#0099ff) سڀني فنڪشنل تلفظن کي مهيا ڪري ٿو - سرحدون، چمڪ، آئڪن، فعال رياستون - جڏهن ته باقي انٽرفيس هڪروميٽڪ رهي ٿو، خالص ڪاري مان کوٽائي پيدا ڪرڻ لاءِ ذيلي گرين ٽرانزيڪشن (#111، #171717، #242424) تي ڀروسو ڪندي. اجزاء کي آرائشي جي بدران سمجهيو ويندو آهي: 8-25px جو گول ريڊي، پتلي 1px بارڊر، گهٽ ۾ گهٽ ڊراپ سائے، ۽ شفاف سطحون جيڪي خالي کي چمڪائڻ جي اجازت ڏين ٿيون.
مڪمل ويڪر وارا حصا ڪاري ڪينواس کان ٻاهر وڌن ٿا، مواد جي وڌ ۾ وڌ ويڪر ~1200px تائين محدود آهي ۽ اندر مرڪز ۾ آهي. مکيه حصي ۾ هڪ کاٻي طرف ترتيب ڏنل هيڊر ۽ هڪ سنگل ڪال-ٽو-ايڪشن (CTA) بٽڻ شامل آهي، ساڄي پاسي کي ارادي طور تي خالي ڇڏيو ويو آهي - غير متناسب طور تي، مرڪز ۾ نه. سيڪشن صرف ٽيڪسٽ لي آئوٽ (وڏو هيڊر + سب ٽيڪسٽ) ۽ پراڊڪٽ اسڪرين شاٽس جي وچ ۾ متبادل آهن. "فريمر سان گڏ اچي ٿو" سيڪشن 4-ڪالمن گرڊ ۾ هڪ لوگو وال استعمال ڪري ٿو. ڪميونٽي سيڪشن ۾، هڪ پراڊڪٽ اسڪرين شاٽ هڪ مرڪزي، مڪمل ويڪر ڪنٽينر اندر گول ڪنڊن سان رکيل آهي. نيويگيشن گهٽ ۾ گهٽ آهي - هڪ پتلي مٿي بار جنهن ۾ کاٻي پاسي لوگو ۽ لنڪ ساڄي طرف ترتيب ڏنل آهن، بغير ڪنهن نظر ايندڙ ڪنٽرول جي. سيڪشن تال: حصن جي وچ ۾ اهم 80px عمودي خال، خالي ۾ ترندڙ مواد جا الڳ ٻيٽ ٺاهيندي.
پراڊڪٽ جي يوزر انٽرفيس جا اسڪرين شاٽ غالب آهن - ٽرئفڪ لائيٽ ڊٽس سان ڪروم جهڙي ونڊو سان فريم ٿيل، ايپ جا ايمبيڊڊ اسڪرين شاٽ مکيه تصوير بڻجي ويندا آهن. لوگو، معيار جي ثبوت طور ڪم ڪري رهيا آهن، وڏي فاصلي سان ڪاري پس منظر تي اڇي خط ۾ پيش ڪيا ويا آهن. ڪابه تصويرون، تصويرون، يا تجريدي گرافڪس استعمال نه ڪيا ويا آهن - بصري ٻولي پاڻ پراڊڪٽ آهي، هڪ زنده انٽرفيس جي طور تي ڏيکاريل آهي. آئڪن جو انداز: گهٽ ۾ گهٽ، بيان ڪيل، مونوڪروم ۽ ننڍي سائيز ۾ اڇو. ٽيڪسٽ کثافت: گهڻو ڪري ٽيڪسٽ، پراڊڪٽ اسڪرين شاٽس جي صورت ۾ ڪڏهن ڪڏهن وڏا ٽڪرا. خلا جو بصري توازن واضح طور تي تصويرن تي ٽائپوگرافي جي حق ۾ آهي.
پيليٽ
برانڊ
- Vivid Violet
#0066ff— انٽرفيس ۾ پرائمري ايڪشن بٽڻ واحد جڳهه آهي جتي هڪ مضبوط رنگ واري بٽڻ جو پس منظر ڏيکاريو ويندو آهي.
غير جانبدار
- Bone
#ffffff— مکيه عنوان، اونداهي پس منظر تي مکيه متن، بٽڻ جو پس منظر روشني جو واحد ذريعو آهي. - Void
#000000— صفحي جو ڪينواس، نيويگيشن پس منظر، ڪارڊ جي مٿاڇري، آئڪن فل - سڀ هڪ لامحدود ڪارو رنگ آهن جيڪو سڀني غير ضروري مواد کي جذب ڪري ٿو. - Graphite
#111111— مٿي ڪيل ڪارڊ جون مٿاڇريون خالي جاءِ کان هڪ قدم مٿي آهن - وڏا، ڪم ڪندڙ ڪارڊ ۽ ماڊل ڪنٽينر. - Obsidian
#171717— بٽڻن، اضافي ڪارڊن، UI فلز لاءِ وچولي مٿاڇري - ڪينواس کان انٽرايڪٽو عنصرن کي الڳ ڪري ٿي. - Slate
#242424— هور تي، ٽيڪسٽ فارميٽ تي سوئچ ڪرڻ کان اڳ ان پٽ فيلڊ ۽ انڊينٽ ٿيل پينل سڀ کان وڌيڪ روشن غير جانبدار رنگ آهن. - Ash
#333333— غير فعال پس منظر جي تصويرن ۽ ساختي عنصرن لاءِ ڊيپ فل.
ٽائپوگرافي
12 کان 68px تائين · 8 مرحلا
- sans-serif — متبادل: Inter · خاڪا 400 · sans-serif - ڪڍيل ڊيٽا ۾ مليو پر AI پاران بيان نه ڪيو ويو آهي.
- GT Walsheim — متبادل: Inter Tight · خاڪا 500 · عنوانن ۽ عنوانن لاءِ فونٽ برانڊ فونٽ آهي. اهو جارحاڻي طور تي ڳنڍجي ويو آهي، 0.8–1.1 جي لائن اسپيسنگ ۽ 44–68px رينج ۾ -0.04em کان -0.05em تائين اکرن جي اسپيسنگ سان. اهو هڪ آرائشي عنصر ناهي؛ GT والشيم جي جاميٽري گرمجوشي، سخت ميٽرڪس سان گڏ، سسٽم جي آواز پيدا ڪري ٿي - اعتماد، ڪمپيڪٽ، ۽ ٿورو مستقبل پسند. ساڳئي جاميٽري اظهار لاءِ، انٽر ٽائيٽ يا اسپيس گروٽسڪ بولڊ تي غور ڪريو.
- Inter Variable — متبادل: Inter · خاڪا 400 · مکيه متن، نيويگيشن، ۽ ثانوي عنوان ڪم جو هارس آهن. انٽر متغير محور وزنن جي هموار مداخلت جي اجازت ڏئي ٿو. ٽريڪنگ سائيز وڌڻ سان تنگ ٿيندي آهي: -0.001em کان 18px ۽ -0.027em کان 22px تائين. متغير نسخو سائيٽ جي هموار مائڪرو اينيميشن جي اجازت ڏئي ٿو. متبادل: انٽر ( Google) - هڪ عملي طور تي هڪجهڙائي وارو فال بيڪ.
وقفا ۽ شڪل
| مقصد | مطلب |
|---|---|
| کثافت | سراسري |
| بنيادي قدم | 10px |
| بٽڻ جو ريڊيس | 9999px |
| ڪارڊ جو ريڊيس | 20px |
| پاڇا | پاڇن جي بدران ڪو به بارڊر نه |
| حصن جي وچ ۾ | 80px |
| صفحي جي ويڪر | 1200px |
AI توهان جي ويب سائيٽ Framer انداز ۾ ٺاهيندو ۽ ان کي ڀريندو.
- لنڪ ذريعي پراڊڪٽس ۽ پوسٽن سان ڀريو - Instagram ، TikTok ، Facebook.
- پنهنجي پراڻي سائيٽ تان مواد منتقل ڪريو - صرف پتو بيان ڪريو.
- بهترين انجن تي جديد ڊيزائن: سرور رينڊرنگ ۽ ايس اي او آپٽمائيزيشن سان React ( Next.js).
- ڳولا جي نتيجن ۽ نيورل نيٽ ورڪ سفارشن لاءِ مڪمل طور تي خودڪار SEO اصلاح.
هڪجهڙا انداز
- Auros — بايولومينسينسنٽ ڊيٽا بالز سان گڏ ابيسل ٽرمينل
- Origin Financial — اڌ رات جي خاموش خوشحالي جي گيلري. هڪ خاموش، تقريبن اونداهو ڪمرو جتي وڏا سيريف فونٽ ۽ ڪجهه روشن رنگين پينل اهو احساس پيدا ڪن ٿا ته فنانس هڪ احتياط سان ترتيب ڏنل فن آهي.
- Raycast — مڊ نائيٽ ڪمانڊ سينٽر، ڪورل نيون
- Dimension — ٿڌڙي شيشي جي پينلن سان گڏ هڪ شام جي روشني وارو ورڪ اسٽيشن
- Reflect Notes — تارن واري واڱڻائي جاءِ هڪ اونداهي رصدگاهه آهي جتي نوٽس تقريباً ڪاري نيري خالي پن جي پس منظر ۾ تارن وانگر ترندا آهن.
- Ameba — اڌ رات جو ڪنٽرول روم - ٿڌڙي شيشي جي پينلن اندر هڪ برقي نيرو نبض
- Branding — ڪاري گيلري جي ڀت، رت جا ڳاڙها لہجا - وڏا اڇا فونٽ هڪ ڳاڙهي ڪينواس تي ترندا آهن جيڪو هڪ خالي جاءِ وانگر هوندو آهي، جنهن ۾ هڪ روشن ڳاڙهي لہجا ۽ شاندار آرائشي عنصر شامل هوندا آهن جيڪي ويب انٽرفيس کان وڌيڪ گيلري جي نشانين وانگر نظر اچن ٿا.
- Harness — فاسفورسنٽ سائي رنگ سان اڌ رات جو مشن ڪنٽرول
- Koto — آڌي رات جو اوبسيڊين گيلري. هڪ تقريباً ڪارا اسٽيج، جتي گرم روشني جو واحد ذريعو هڪ پيلو مارڪر آهي، ۽ گاڑھا قسم نمائشي پوسٽرن وانگر وسيع منفي جاءِ ۾ تري رهيا آهن.
- Ohzi — هڪ چمڪندڙ ڪيوب هڪ اونداهي گيلري ۾ لٽڪيل آهي
- Depot — هڪ اونداهو سرور ٽرمينل. هڪ لڳ ڀڳ ڪارو ڊولپر ڪنسول، هڪ سائي LED سان جيڪو ڪم جي شروعات جو اشارو ڏئي ٿو، ۽ باقي يوزر انٽرفيس گريفائٽ ۾ ڏيکاريل آهي.
- Maciej Zadykowicz — مڊنائيٽ گيلري پنهنجي ڪيليڊو اسڪوپڪ ميورل سان گڏ هڪ تقريبن ڪاري اسٽوڊيو ڀت آهي جتي هڪ متحرڪ، رنگين ٽائپوگرافڪ آرٽ جو ٽڪرو ڌيان ڇڪائي ٿو جڏهن ته باقي سڀ ڪجهه خاموش ۽ سوچيل سمجهيل رهي ٿو.