Restoran
Menyu, stol band qilish va oshxona ko‘rinishi.
Frontend vitrinasi
Ishning interfeys tomoni.
Men avvalo server qismi dasturchisiman — va odamlar to‘g‘ridan-to‘g‘ri tegadigan qismlarni yaratishni yoqtiraman. Bu sahifadagi hamma narsa jonli va brauzeringizda ishlaydi: video ham, skrinshot ham yo‘q.
01 · Tirik logotip
Bitta obyekt, ko‘p shakl.
Sayt bo‘ylab sizga ergashadigan S — prujinalar boshqaradigan uchta geometrik bo‘lak. Shaklni tanlang va uning qayta yig‘ilishini kuzating — saytning har bir bo‘limi undan boshqacha shakl so‘raydi.
Jonli shakl laboratoriyasi WebGL bor kompyuter brauzerini talab qiladi. Bu qurilmada logotip oddiy 2D belgi bo‘lib qoladi.
Men ishlaydigan narsalar — kichik quyosh tizimi shaklida.
Men foydalanadigan texnologiyalarning 3D xaritasi, men o‘ylagandek guruhlangan. Aylantirish uchun sudrang; sayyora ustiga olib boring yoki ro‘yxatdan guruh tanlang.
Tanlangan guruhServer qismi va infratuzilma
Og‘irlikka ega harakat.
Sayt bo‘ylab qo‘llanadigan harakat tilining kichik namunalari. Bu yerda hech narsa o‘zicha takrorlanmaydi — hammasi sizga javob beradi.
Magnitli tugma
Tugma kursor tomon egiladi, yozuvi esa bir oz kamroq ergashadi, so‘ng prujinadek qaytadi.
Qiyalik
Yorug‘lik bilan qiyalik
Cheklangan burilish va ko‘rsatkichga ergashadigan yorug‘lik — aniq, teatrallashtirilmagan.
Prujinali sudrash
Shaybani sudrang va qo‘yib yuboring: u inersiya bilan qaytadi. Strelka tugmalari uni siljitadi.
0%
Aylantirishga bog‘liq halqa
Halqa va raqam bu bo‘limni qanchalik aylantirganingizga ergashadi.
Kursorga yo‘l beradigan bog‘lanishlar.
Sfercience tarmog‘i g‘oyasi oddiy 2D kanvasda chizilgan: har bir bog‘lanish prujina boshqaradigan egri chiziq bo‘lib, ko‘rsatkichdan chetga egiladi.
Haqiqatan ishlaydigan kichik boshqaruv ekrani.
Oldingi supermarket boshqaruvi konseptidan qayta qurilgan. Qidiring, saralang, tartiblang va zaxirani to‘ldiring — hammasi brauzerda, demo ma’lumotlarda.
Mahsulotlar0
Ombordagi dona0
Kam qolgan0
Ombor qiymati (so‘m)0
| Kategoriya | Holat |
|---|
Mos mahsulot topilmadi.
Kundalik bizneslar uchun interfeys yo‘nalishlari.
Biznes dasturlari uchun sakkizta boshlang‘ich nuqta, oldingi konsept sahifalardan qayta tug‘ilgan. Bu muhokama uchun yo‘nalishlar, tayyor mahsulotlar emas.
Mehmonxona
Xonalar, mavjudlik va joylashtirish jarayoni.
Salon va spa
Xizmatlar, xodimlar jadvali va eslatmalar.
Koworking
Ish joylari, a’zoliklar va eshik kirishi.
Xususiy maktab
Sinflar, qabul va ota-onalarga yangiliklar.
Klinika
Shifokorlar, qabullar va bemor tarixi.
Onlayn do‘kon
Katalog, savat va buyurtmani kuzatish.
Supermarket
Zaxira, yetkazib beruvchilar va kam qolgan zaxira ogohlantirishlari.
Jonli panelni sinab ko‘ringXuddi shu mahoratni haqiqiy loyihalar ichida ko‘ring.
DSQo‘l kubni qisadi — aylantirish orqali hikoya qilinadi.Aylantirish jarayoni boshqaradigan 3D sahna, gizmo va qo‘l skeleti.→ SfercienceBitta vazifa tarmoq orqali yo‘naltiriladi.Paket agentlar orasida tasdiqlash bosqichiga yetguncha yuradi.→ AvtoboxAylantirishga ergashadigan servis vaqt chizig‘i.Avtomobil har bir bosqichdan o‘tganda haqiqiy interfeys skrinshotlari almashadi.→
U qanday qilib tez va qulay bo‘lib qoladi.
Fizika
Prujinalar, oddiy o‘tishlar emas
Har bir animatsiya qiymati so‘nuvchi prujina, shuning uchun harakat og‘irlikka ega va hech qachon keskin sakramaydi.
Tezkorlik
Kechiktirib yuklanadi va to‘xtatiladi
3D birinchi chizishdan keyin yuklanadi, ekrandan chiqsa to‘xtaydi va telefonlarda 2D ga o‘tadi.
Qulaylik
Harakat ixtiyoriy
Harakat kamaytirilganda animatsiya to‘xtaydi, butun mazmun qoladi. Klaviatura fokusi va yorliqlar hamma joyda bor.
Til
Uch til
Odatda o‘zbek tili, kerak bo‘lsa rus va ingliz — skriptlar chizadigan matnlar ham shu jumladan.
Yetkazib berish
Yig‘ish bosqichi yo‘q
Oddiy HTML, CSS va modullar, kutubxonalar o‘z serverida. Kompilyatsiya qilinadigan narsa yo‘q.
Halollik
“Ko‘rgazma” — bu ko‘rgazma
Demo ma’lumotlar va konsept vizuallar doim shunday deb belgilanadi.
three.jsGSAP + ScrollTriggerLenisVanilla JSCSS