Ишеним
Токтоо ачык берүү, жогорку контраст жана декоративдик ызы-чуунун жоктугу.
A3 дизайн системасы
A3 продукт сайттарынын визуалдык тили. Барак бүт сайт менен бирдей токендерде чогултулган: төмөндөгү үлгүлөр алардын сүрөтүн эмес, чыныгы маанилерин көрсөтөт.
Визуалдык тилдин беш сапаты
Тактык
Ар бир блок абстрактуу убада эмес, конкреттүү функцияны, сценарийди же жыйынтыкты түшүндүрөт.
Редакциялык туюндуруу
Ири типографика, асимметриялуу торлор жана блоктордун ар кандай масштабы оор анимациясыз ыргак жаратат.
Материалдуулук
Иллюстрациялар үлгүлүү 3D объекттердин ордуна кагаз, керамика жана графиттен жасалган физикалык композиция сыяктуу көрүнөт.
Үй-бүлөлүк окшоштук
Палитра, типографика, радиустар жана адаптивдин жүрүм-туруму бардык A3 продуктусунда бирдей. Сюжет менен композиция өзгөрөт.
Палитра
Сегиз базалык түс. Бардык туунду көлөкө алардан эсептелет, ошондуктан базалык маанинин өзгөрүшү бүт сайтты өзгөртөт.
#F5F6FA--c-bgБарактын фону жана жумшак төшөмөлөр
#FFFFFF--c-surfaceКарточкалар, талаалар, караңгыдагы текст
#212527--c-inkНегизги текст, караңгы панелдер, баскычтар
#6B6B6B--c-mutedКошумча текст жана активдүү эмес абалдар
#51C247--c-successИйгилик жана тастыктоо
#DF720C--c-warningЭскертүү жана кол менен текшерүү
#E83437--c-errorКата жана өтө маанилүү абал
#6C5CE7--c-accentФокус, активдүү шилтеме, чекиттик акцент
Колдонуу эрежелери
- Негизги баскыч ар дайым караңгы, ак баскыч караңгы панелдин ичинде гана болот.
- Жашыл, кызгылт сары жана кызыл маани алып жүрөт. Декор катары колдонулбайт.
- Кызгылт көк чекиттүү колдонулат: активдүү пункттун астын сызуу, фокус, шилтеме.
- Жаңы түс компонентке түз түшпөйт: адегенде семантикалык токен пайда болот.
- Таза кара колдонулбайт: күңүрт түс салкыныраак жана төшөмөгө жакшы жатат.
Типографика
Golos Text, өз серверибизде. Ариптер кириллицага, кеңейтилген латиницага жана продукт берүүсүнө ылайык келет.
Текст эрежелери
- Биринчи экрандын аталышы desktop то эки саптан ашпайт.
- Негизги текст сапта болжол менен 44-65 белги менен чектелет.
- Uppercase туруктуу декоративдик ыкма катары колдонулбайт.
- Узун жана кыска сызыкча колдонулбайт: чекит, эки чекит же үтүр.
- Копирайтинг так: функция, шарт, жыйынтык, чектөө.
Башкы аталышПлатформа документ жүгүртүүнү, каржыны жана кадрларды бир контурга чогултат
Бөлүмдүн аталышыПлатформа документ жүгүртүүнү, каржыны жана кадрларды бир контурга чогултат
Карточканын аталышыПлатформа документ жүгүртүүнү, каржыны жана кадрларды бир контурга чогултат
Негизги текстПлатформа документ жүгүртүүнү, каржыны жана кадрларды бир контурга чогултат
Кошумча текстПлатформа документ жүгүртүүнү, каржыны жана кадрларды бир контурга чогултат
Кол тамга жана метамаалыматПлатформа документ жүгүртүүнү, каржыны жана кадрларды бир контурга чогултат
Форма жана беттер
Үч радиус бүт интерфейсти жабат. Көлөкөлөр салкын жана абдан жумшак, алар ар бир ак бетке демейде коюлбайт.
Бет түрлөрү
- Иерархияны тор жараткан учурда контейнерсиз барак фону.
- Ичке салкын чек арасы бар ак карточка.
- Төшөмөдө түстүү чек арасыз жумшак карточка.
- Бир маанилүү тезиске же жыйынтык чакырыкка арналган караңгы панел.
28pxКарточкалар, ири сүрөттөр, караңгы панелдер
12pxТалаалар, ыкчам плашкалар, ички беттер
999pxБаскычтар, которгучтар, чыпкалар
Компоненттер
Базалык элементтер чыныгы аткарууда.
Баскычтар
Абал плашкалары
ИйгиликКөңүл буруңузКатаМаалымат
Форманын талаасы
Label ар дайым талаанын үстүндө, placeholder аны алмаштырбайт.
Кыймыл
Кыймыл технологияны көрсөтпөй, иерархияга жардам берет.
- Бөлүмдүн пайда болушу: тунуктук жана 22 пикселге жылуу, узактыгы 0.65 секунд.
- Барактар ортосундагы өтүү: тунуктук жана 10 пикселге жылуу, болжол менен 0.28 секунд.
- Баскыч курсор алып барганда 2 пикселге көтөрүлөт жана басканда бир аз кысылат.
- Басууга боло турган карточка 5 пикселге көтөрүлүп, жумшак көлөкө алат.
- Кыймылды азайтуу күйгүзүлгөндө анимациялар иш жүзүндө заматта өтөт.
Биз эмне кылбайбыз
- Семантикалык себепсиз ири кызгылт көк же көк контейнерлер.
- Бардык бөлүмдө катары менен үч мамычадагы бирдей ак карточкалар.
- Бир текст жана градиент тактан турган биринчи экран.
- Интерфейс белгисинин же желектин ордуна эмодзи.
- Бир аракетке ар кандай түстөгү жана ар кандай аталыштагы баскычтар.
- Артында булагы жок декоративдик сандар.
- Азайтылган кыймылга кошумча жүрүм-туруму жок оор анимация.
A3 бренддик материалдары керекпи?
Логотипти, түс палитрасын жана презентация үлгүлөрүн сурам боюнча жиберебиз, материалдарыңызды платформанын стилине ылайык келтирүүгө жардам беребиз.