Telegram, WhatsApp және т.б.+380637610482
Валерий Данюк
Валерий ДанюкәзірлеушіБизнес үшін жасанды интеллект құралдарын әзірлеу. Жоғары сапалы. Қолжетімді.Telegram-ға жазу
Superlist — осы стильдегі сайттың алдын ала көрінісі

Superlist

Маржан шоқтары бар түнгі жұмыс орны — жылы қызғылт сары ұшқын әрбір әрекетті білдіретін тыныш баклажан қолданба беті

Superlist түн ортасындағы күлгін реңктердегі өнімділік тілін қолданады: қою баклажан, жалғыз негізгі түс ретінде жылы маржан және бүкіл атмосфераны қамтитын үлкен санс-сериф тақырыптары. Интерфейс түнгі уақыттағы жұмыс сезімін тудырады — тыныш, көп қабатты және сенімді, түс тек әрекетке шақыруларда, белсенді күйлерде және негізгі мәселелерде функционалды тыныс белгілері ретінде қолданылады. Беттер нәзік қара реңктермен, күлгін астыңғы реңкпен (#181824 → #26253b) қабатталған, тереңдік стерильді емес, жылы сезілуін қамтамасыз ету үшін таза қара түстен аулақ болады. Компоненттерде кең дөңгелек пішіндер (20 пиксельдік карталар, таблетка түймелері), жұмсақ көлеңкелер және тығыз торлардың орнына ыңғайлы 10-16 пиксельдік саңылаулар арқылы «дем алу» мүмкіндігі бар. Тақырыптың дауысы бәрінде: 70-88 пиксельдегі 600 нүктелік салмақ, әріптердің тығыз аралығы -0,02 ем, мәтінді UI емес, типографиялық деп қарастырады — ол SaaS-қа қарағанда редакциялық мәтінге жақын.

Қараңғы бөлімдер беттің бүкіл енін қамтиды, орталықтандырылған, ең үлкен ені бар мазмұн контейнерлері бар. Негізгі бөлім тігінен орталықтандырылған және тақырып, ішкі мәтін және әрекетке шақыру (CTA) қамтиды, содан кейін келесі бөліммен қабаттасатын үлкен өнім скриншоты келеді. Келесі бөлімдер орталықтандырылған мәтін блоктары мен карта торлары арасында кезектесіп орналасады. Пікірлер бөлімінде шолу карталары және 16 науалары бар үш бағандық тор қолданылады. Навигация - сол жағында логотипі, орталықтандырылған сілтемелері және оң жағында кіру әрекеттері бар жалғыз жоғарғы жолақ - бекітілген бүйірлік тақта немесе мега-мәзір жоқ. Бөлімдер арасындағы науалардың кеңдігі (16 науа), тығыз өнім торының орнына кең, редакциялық ырғақ жасайды.

Визуалды кеңістікте өнім скриншоттары басым — қолданбаның нақты интерфейсін көрсететін дөңгелек бұрыштары бар үлкен жақтау негізгі және қосымша бөлімдерді толтырады. Фотосуреттер минималды, тек пайдаланушы аватарлары немесе қолданба ішіндегі медианың алдын ала қараулары ретінде пайдаланылады (мысалы, өнім макетінің оң жақ панеліндегі концерт суреті). Сенім жолағындағы логотиптер жалпақ, дыбыссыз ақ мәтіндік белгілер. Декоративтік иллюстрациялар, абстрактілі графика, 3D рендерлер жоқ. Визуалды стратегия - өнімді масштабта көрсету, типографияға эмоционалды жұмыс істеуге мүмкіндік беру және маржанды жалғыз екпін түсі ретінде пайдалану.

Палитра

Бренд

  • Coral Ember #ff4a36 — Қызғылт сары түс сәндік бөлшектер үшін және сирек кездесетін белгілерді ерекшелеу үшін қосымша екпін ретінде қолданылады. Оны әрекетке шақыру үшін негізгі түс ретінде пайдалануға болмайды.

Бейтарап

  • Aubergine Canvas #181824 — Беттің негізгі фоны, яғни кенеп, таза қара түстің орнын басатын жылы, қою реңк болып табылады, бұл пайдаланушы интерфейсін жалпақ емес, көп қабатты етіп көрсетеді.
  • Elevated Plum #26253b — Карта беттері, енгізу өрістері, навигациялық контейнерлер — көрінетін шекарасыз тереңдік жасау кенепке қарағанда бір қадам оңайырақ.
  • Pure White #ffffff — Негізгі тақырыптар, түйме мәтіні және белгіше контурлары — қараңғы кенептегі ең жоғары контраст.
  • Fog Text #696f81 — Негізгі мәтін, қосымша тақырыптар және дыбыссыз жиектер баклажан түсті фонда ыңғайлы оқу үшін 7:1 контраст қатынасына ие.
  • Ash Text #8e8da0 — Бейтарап түс қосымша интерфейс элементтері, бөлгіштер және дыбыссыз белгілер үшін қолданылады. Оны әрекетке шақыру үшін негізгі түс ретінде пайдалануға болмайды.
  • Mist Highlight #a3a3a7 — Нәзік шекаралар, бөлгіштер және белсенді емес навигация элементтері кенептің фонында әлі де ерекшеленетін нәзік бейтарап реңк жасайды.

Типография

12-ден 88 пиксельге дейін · 9 қадам

  • sans-serif — ауыстыру: Inter · контурлар 400 · sans-serif - алынған деректерде кездеседі, бірақ жасанды интеллектпен сипатталмаған.
  • Haffer XH SemiBold — ауыстыру: Inter Tight · контурлар 400, 600 · Дисплей мен тақырыптарға арналған негізгі қаріп. Ол әріптер арасындағы арақашықтық -0,02em және қалыңдығы 600 болатын кейіпкер тақырыптары үшін 70–88 пиксель өлшемінде қолданылады. Тар әріптер арақашықтығы және үлкен әріп биіктігі тақырыптарға редакциялық салмақ береді, бұл қараңғы интерфейсті басқару тақтасына қарағанда журнал мұқабасына көбірек ұқсатады. Қалың қаріппен Inter Tight немесе General Sans қаріпімен ауыстырыңыз.
  • Jersey 10 — ауыстыру: Anybody · контурлар 400 · Екпін сандары мен ерекшелеулерге арналған үлкен, сәндік қаріп. Типографиялық екпіндерді жасау үшін өте үлкен өлшемдерде сирек қолданылады. Anybody немесе Cabinet Grotesk қаріптерімен ауыстыруға болады.

Аралықтары және формасы

МақсатыМағынасы
Тығыздықорташа
Негізгі қадам10-16px
Түйме радиусы100px
Карта радиусы20px
Көлеңкелержұмсақ көлеңкелер
Бөлімдер арасында80px
Беттің ені1200px

Жасанды интеллект сіздің веб-сайтыңызды Superlist стилінде жасайды және оны толтырады

  • Instagram, TikTok, Facebook сілтемелері арқылы өнімдер мен жазбаларды толтырыңыз.
  • Ескі сайтыңыздан мазмұнды тасымалдаңыз — тек мекенжайын көрсетіңіз.
  • Ең үздік қозғалтқыштағы заманауи дизайн: серверді рендерингтеу және SEO оңтайландыру арқылы React ( Next.js).
  • Іздеу нәтижелері мен нейрондық желі ұсыныстары үшін толық автоматтандырылған SEO оңтайландыруы.

Ұқсас стильдер

  • DNA — Түн ортасындағы обсерватория бөлшектер линзасы арқылы көрінеді
  • Abetterlou — Ер-тоқым былғарысындағы ұшқындар - қою кофе түстес қара фонда жарқыраған жылы кремді қаріп, бетке басылған ыстық металл сияқты сезілетін кәріптас алтын түсті түймелер.
  • Galileo-ft — Көк түсті электрлік сигналдары бар терең ғарыштық командалық палуба
  • Decide AI — Түн ортасындағы обсерватория - жалбыз сигналы
  • Redis Agency — Жұмыс уақытынан кейін ашық болатын редакциялық шеберхана - барлық брендинг жұмыстары сериф қаріптері мен бір қызыл шалғаммен атқарылатын қараңғы орын.
  • Spellbook — Маржан сиямен жарықтандырылған түнгі сот залы – қараңғы редакциялық бет, онда тек жылы қызғылт сары қаламның қимылы ғана естіледі
  • Linear — түн ортасындағы дәлдік аспабы
  • Origin Financial — Тыныш сән-салтанаттың түн ортасындағы галереясы. Үлкен сериф қаріптері мен бірнеше жарықтандырылған түрлі-түсті панельдер қаржыны мұқият таңдалған өнер туындысы сияқты сезім тудыратын тыныш, дерлік қараңғы бөлме.
  • Hyperstudio — Дизайн обсидиан түсімен сызылған. Мәтін мен жіңішке сызықтар таза қара түстің ақ кеңістігін қоршап тұр, ал кейде жолды көрсететін алтын компас белгілері бар.
  • Air — «Түн ортасындағы аспан әйнек арқылы» мүсіні
  • Raycast — Түн ортасындағы басқару орталығы, Корал Неон
  • dope.security — Күлгін маяктары бар түнгі терминал