
Creative Giants
Цөцгий цаасан дээрх том хэмжээтэй редакцийн постер
Creative Giants нь кодоор дүрслэгдсэн хэт том хэмжээтэй урлагийн номын дэлгэлт шиг харагдаж байна: дулаан, өтгөн даавуу, нимгэн захтай, гарчиг гэхээсээ илүү зурагт хуудас шиг санагдахуйц том хэмжээтэй фонт. Систем бүхэлдээ сөрөг зай болон ганц, хөнгөн хэмжээтэй (300) дээр ажилладаг - гарчиг нь тодоор тодрохын оронд 64-84 пиксел дээр бараг сонсогдохгүй, үсгийн зай нь фонтын хэмжээ нэмэгдэхийн хэрээр огцом багасдаг (-0.04em) тул үгс нь хуулсан биш харин сийлсэн мэт харагддаг. Өнгөний схемийг жижиг, ханасан бийрний зураасаар тараасан: тод ягаан, гүн оюу, цайвар цэнхэр, тод ягаан, гаа, хөх хөх өнгө нь дэвсгэр дүүргэлтийн оронд картын гадаргуу эсвэл өргөлт хэлбэрээр харагддаг. Интерактив элементүүд нь бүрэн бөөрөнхий (1440 пиксел) радиустай цөцгий дэвсгэр дээр хар дүрсүүд байдаг бол хром элементүүд бараг харагдахгүй - нэг дугуй лого болон "Цэс" товчлуур нь цагаан зайд хөвдөг. Харааны концепц нь продакшны студийн холбоо барих хуудас юм: нэг асар том гарчиг, нэг бүтэн өргөн зураг, нэг чимээгүй метатекст мөр. Бусад хуудас бүр ижил товч хэв маягийг дагах ёстой.
Хуудасны бүрэн дүүргэлт: Хамгийн их өргөнтэй контейнер байхгүй; контент нь хуудасны бүх өргөний зүүн ба баруун талд тэнцүү зайтай (гар утсан дээр 16–32 пиксел, компьютер дээр 32 пикселээс дээш) эзэлдэг. Үндсэн гарчиг нь нэг том гарчиг ("БҮТЭЭЛЧ АВАРГА" 84 пиксел) бөгөөд харах цонхны ойролцоогоор 40%-ийг эзэлдэг бөгөөд үүний дараа зүүн доод буланд мета шошго, гарчгийн давхарга бүхий бүрэн дүүргэлттэй зураг гарч ирнэ. Хэсгийн хэмнэл нь цул: шинэ хэсэг бүр бага хэмжээний том үсгээр бичсэн хуулбар болон тайлбараар эхэлж, 48–64 пикселийн цагаан зайгаар тусгаарлагдсан - нэг урвуу Navy Ink өргөлтийн картаас бусад бараан/цайвар зурвасууд ээлжлэн байхгүй. Агуулга нь зүүн тийш зэрэгцсэн; үндсэн гарчгаас бусад төвлөрсөн блок байхгүй. Мэдээ/кейс судалгааны хэсэгт баруун талд хөвөгч сумтай блок бүхий гурван багана бүхий картын сүлжээг ашигладаг. Навигацийг нэг дээд толгой хэсгээр дамжуулан гүйцэтгэдэг - хажуугийн самбар эсвэл толгой хэсгээс гадна ямар нэгэн бэхлэгдсэн элементгүйгээр. Ерөнхий зохион байгуулалт нь өргөн цар хүрээтэй бөгөөд редакцийн хэв маягтай нийцдэг: хэсэг бүр амьсгалж, цагаан зай нь үндсэн бүтцийн элемент юм.
Редакцийн гэрэл зураг нь дизайныг давамгайлдаг: зургууд нь хуудасны бүх өргөнийг эзэлдэг, хурц өнцөгтэй, давхцал эсвэл бөөрөнхий баггүй. Энэ хэв маяг нь баримтат болон агаар мандлын - үрчлээтэй гар, олон нийтийн инсталляци, хүмүүсийн энгийн зургуудыг - хэзээ ч тайзны бүтээгдэхүүний гэрэл зургийг ашиглахгүйгээр харуулдаг. Зургийг үргэлж том хэмжээгээр (бүрэн өргөнтэй харах цонх эсвэл картыг бүхэлд нь дүүргэх) харуулдаг тул дизайны нэгж нь хэрэглэгчийн интерфэйс биш харин гэрэл зураг юм. Зураг чимэглэл, 3D загвар эсвэл бүтээгдэхүүний загвар байхгүй. Иконографи нь хамгийн бага: ганц жижиг дугуй лого, тойргийн удирдлага дээрх тойм хэлбэртэй шевронууд, 1 пикселийн тоймтой хөнгөн UI дүрсүүд. Зургийн нягтралыг зураг өөрөө тодорхойлдог бөгөөд текст нь гэрэл зургийн доор эсвэл дээр нь нууц тэмдэглэгээний давхарга болж үйлчилдэг.
Палетт
Брэнд
- Magenta Bloom
#8a0467— Ягаан өнгийг гоёл чимэглэлийн нарийн ширийн зүйлсийн хоёрдогч өргөлт болон ховор хэрэглэгддэг хайлтын асуулгыг тодруулахад ашигладаг. Үүнийг үйлдэлд уриалахын тулд үндсэн өнгө болгон ашиглаж болохгүй. - Forest Teal
#03624c— Ил захидлын хүрээ болон гоёл чимэглэлийн өнгөнд зориулсан баялаг брэндийн өнгө; хоёр өнгийн өнгөлгөөг Magenta Bloom-той хослуулна.
Төвийг сахисан
- Bone White
#fffef7— Хуудасны даавуу, картон гадаргуу болон бараан өнгийн хээтэй текст нь цэвэр #ffffff өнгийг орлосон дулаан, өтгөн өнгө бөгөөд бүхэл бүтэн системд цаасан, хэвлэмэл мэт мэдрэмж төрүүлдэг. - Ink Black
#000000— Бараан өнгө нь төвийг сахисан текст болон дүрсүүдийг нөхөж, хүчтэй тодосгогч байдлыг бий болгодог. Үйлдэлд уриалахын тулд үүнийг үндсэн өнгө болгон ашиглахаас зайлсхий. - Graphite
#666666— Үндсэн текст давамгайлахын тулд хоёрдогч үндсэн текст, тайлбар, мета өгөгдөл болон туслах текстийг арын дэвсгэр рүү түлхдэг. - Ash
#aaaaaa— Оролтын талбарын хил хязгаар, идэвхгүй холбоосын өнгө, гуравдагч тусгаарлагч - шаардлагагүй үед алга болдог зөөлөн бүтцийн саарал өнгө. - Charcoal Scale
#4d4c4a— Жагсаалтын хүрээний хувьд дунд зэргийн төвийг сахисан, бараан градиент зам дээр тодосгогчийг бага зэрэг нэмэгдүүлсэн - хөх саарал биш дулаан саарал. - Powder Blue
#a5c8eb— Ил захидлын дэвсгэр, бүдэг дэвсгэр, бүдэг чимэглэлийн дүүргэлт зэрэг зөөлөн өнгөний өргөлт нь өрсөлдөөн үүсгэхгүйгээр дулаан дэвсгэрийг хөргөнө.
Типографи
12-оос 84 пиксел хүртэл · 7 алхам
- Switzer — солих: Inter (300 · тоймууд 300, 400 · Дан фонтын систем: бүх дэлгэцийн элементүүд болон гарчгийн хувьд 300 жин (12–84 пиксел), үндсэн текст, мета өгөгдөл болон UI удирдлагын хувьд 400 жин. Илүү тохиромжтой сонголт бол 64–84 пикселийн хэмжээтэй 300 жин ашиглах явдал юм - ихэнх системүүд энд 700–800 тод фонт ашигладаг; цайвар өнгийн Switzer фонт нь нимгэн шугамыг хадгалж, цөцгий өнгийн зотон дээр аэрографаар бичсэн мэт сэтгэгдэл төрүүлдэг. Хэмжээ нэмэгдэх тусам үсгийн зайг нарийсгах (84 пиксел дээр -0.04em, 14 пиксел дээр -0.018em) нь сийрэг мэдрэмж төрүүлэхгүйгээр дотоод зайг нээлттэй байлгадаг.
Интервал ба хэлбэр
| Зорилго | Утга |
|---|---|
| Нягтрал | дундаж |
| Үндсэн алхам | 8px |
| Товчлуурын радиус | 1440px |
| Картын радиус | 0px |
| Сүүдэр | сүүдрийн оронд хил хязгаар байхгүй |
| Хэсгүүдийн хооронд | 64px |
Хиймэл оюун ухаан таны вэбсайтыг Creative Giants хэв маягаар бүтээж, дүүргэх болно
- Instagram, TikTok, Facebook холбоосоор дамжуулан бүтээгдэхүүн болон нийтлэлүүдээр дүүргээрэй.
- Хуучин сайтаасаа контентыг шилжүүлэх - зүгээр л хаягийг нь зааж өгнө үү.
- Шилдэг хөдөлгүүр дээрх орчин үеийн дизайн: Серверийн рендеринг болон SEO оновчлолыг хайрцагнаас нь гарган React ( Next.js).
- Хайлтын үр дүн болон мэдрэлийн сүлжээний зөвлөмжид зориулсан бүрэн автомат SEO оновчлол.
Төстэй хэв маяг
- Studio — Хөдөлгөөнтэй галерейн хана. Дэлгэц бүр нь хэвлэлийн материал болон давхцаж буй бүтээлч бүтээлүүд анхаарал татахын тулд өрсөлдөж буй чимээгүй, саарал үзэсгэлэнгийн гадаргууг илэрхийлдэг.
- Mollie — Ноолуурын лангуу, бараан өнгийн дэвтэр. Хар текстийн эргэн тойронд редакцийн дизайн хийхэд хангалттай цагаан зай үлдээгээд, бүтээгдэхүүнтэй холбоотой санаануудыг бүлээн тос, эспрессо бор шар айраг, бодит төлбөрийн аргуудын хүрэлцэхүйц зургуудаар бататга.
- Bajgart Office — Редакцийн галерейн хана. Хром бүрсэн интерфэйсийн элементүүдээс илүү нарийн сериф фонтууд болон портфолио хэсгүүд нь илүү их харагдах жинтэй байх том цагаан зайг ашиглаарай.
- Bejamas — Хар шилээр дамжин өнгөрдөг хүчиллэг шохойн унтлагын хувцас. Бүдэг ногоон гэрлийн судал гадаргуу дээр огтлолцсон хар өнгийн самбараар тасалдсан тайван, цайвар саарал өнгийн редакцийн хуудсуудыг бүтээгээрэй.
- Kagi — Тусдаа уншлагын өрөө. Тод графит текстийн эргэн тойронд задгай цагаан зай гаргаж, нарийн нил ягаан өнгийн өргөлт болон дулаан пастел гадаргууг ашиглан амар амгаланг эвдээрэй.
- Milanote — Миланоте бол зориулалтын бүтээлч студи юм. Хөвөгч харааны самбаруудыг ашиглан редакцийн галерей маягийн хуудас үүсгээрэй: бараан хүрээтэй хана, цагаан дэлгэцийн зай, зөөлөн гүнтэй бодит объект шиг харагдах дэлгэцийн агшин.
- Co2 — Өвлийн гэрэлд уур амьсгалын атлас. Сериф гарчиг, ангиллын кодчилсон өгөгдөл, мөстэй зургууд нь өргөн цагаан захыг тодруулсан агаарын баримт бичгийн ландшафт шиг хуудас үүсгээрэй.
- GitButler — Текстийн төгсгөлд оюу өнгөтэй. Өндөр тодосгогчтой сериф гарчиг, нарийн техникийн тор, дулаан бал чулуун гадаргуу, даруухан оюу өнгийн аялгатай хослуулсан.
- ElevenLabs — Дулаан цөцгий өнгөтэй, нарийн гарчигтай фото эссэ. Баухаус маягийн дэвтэр - өндөгний хальсан өнгөтэй цаас, хар бэх, бүтээгдэхүүний үзэсгэлэнд зориулсан нил ягаан, улбар шар өнгийн ганц чимэглэл.
- monopo saigon — Редакцийн нам гүм байдлын цаана шингэн, солонгорсон гэрэл тодорч байна - хайлсан гэрэлд хөвж буй монохром редакцийн галерей
- Awesomic — Конфеттиг санагдуулам улбар шар цэг таслал бүхий редакцийн цайрын тор
- Monad — дулаан илгэн дээрх редакцийн техникийн сэтгүүл