ElevenLabs
Дулаан цөцгий өнгөтэй, нарийн гарчигтай фото эссэ. Баухаус маягийн дэвтэр - өндөгний хальсан өнгөтэй цаас, хар бэх, бүтээгдэхүүний үзэсгэлэнд зориулсан нил ягаан, улбар шар өнгийн ганц чимэглэл.
ElevenLabs нь дулаан, цагаан минималист хэв маягаар ажилладаг: өндөгний хальсан өнгөтэй даавуу (#fdfcfc) нь хар фонттой, дулаан бор шаргал өнгийн нэг давхаргатай (#f5f3f1). Брэндийн өвөрмөц байдал нь чимээгүй, өөртөө итгэлтэй - бараг ялгагдахгүй Waldenburg 300 фонт нь гарчгийг маш тод тодруулдаг (-0.02em) бол Inter 400/500 нь бусад бүх зүйлд тайван төвийг сахисан байдлыг өгдөг. Хоёр өргөлт өнгө - тод ягаан #0447ff болон тод улбар шар #ff4704 - нь зөвхөн бүтээгдэхүүний харааны элементүүд (аудиосфер, бүтээгдэхүүний дүрс) дотор л тод харагддаг бөгөөд хэрэглэгчийн интерфэйс дээр хром шиг хэзээ ч байдаггүй. Бүрэлдэхүүн хэсгүүд нь хавтгай эсвэл бага зэрэг өргөгдсөн хэвээр байгаа бөгөөд нимгэн 1 пикселийн хүрээтэй, картон дээрх өргөн 20 пикселийн радиустай, бүрэн дүүргэсэн 9999 пикселийн товчлууртай. Систем нь цөцгий цаасан дээрх Bauhaus студийг санагдуулдаг: хязгаарлагдмал, редакторын болон техникийн хувьд нарийн.
Бүрэн өргөнтэй хэсгүүдийг 1280 пикселийн гадна талын ус зайлуулах хоолойтой ганц, хамгийн өргөнтэй төв баганад босоо байдлаар байрлуулсан. Үндсэн хэсэг нь тэгш бус: гарчгийг 48 пикселийн Валденбург түвшинд зүүн тийш зэрэгцүүлсэн, тайлбарын текстийг баруун тийш зэрэгцүүлсэн бөгөөд хоёр эм хэлбэртэй товчлуурыг гарчгийн доор байрлуулсан. Үндсэн хэсгийн доор агуулгын бүхэл өргөний дагуу том табтай навигацийн самбар байрладаг. Хэсгүүд нь өндөгний хальсан өнгөтэй болон бор шаргал дэвсгэрийн хооронд ээлжлэн байрладаг бөгөөд 96–125 пикселийн босоо ус зайлуулах хоолойтой. Доод хэсэг нь авсаархан, ганц зурвас юм. Навигаци нь минималист дээд самбар юм - тогтмол зан төлөвгүй, мега цэсгүй. Агуулгын хэмнэл нь редакцийн хэв маягтай тохирч байна: цагаан зай ихтэй, хэсэг бүрт нэг үндсэн харааны элемент, "Итгэлцэл" хэсгийн доор картын тор байхгүй.
Харааны дизайнд өнгөний схем давамгайлдаг: зөөлөн аудио бөмбөрцөг хэлбэртэй том градиентууд (нил ягаанаас улбар шар, ягаан руу шилжсэн 200 пикселээс дээш тойрог) нь гол график элемент болж үйлчилдэг. "Итгэлцэл" хэсэгт байгаа логонуудыг царцсан даавуун дэвсгэр дээр бага тодосгогчтой саарал өнгөөр харуулсан болно. Гэрэл зураг хамгийн бага - амьдралын хэв маяг эсвэл бүтээгдэхүүний зураг байхгүй. Дүрс бичлэг нь сийрэг, монохром (хар хүрээ эсвэл дүүргэсэн дүрс, хроматик дүрс байхгүй). Харааны систем нь бүтээгдэхүүний каталогоос илүү дизайны хэвлэлийг санагдуулдаг - маркетингийн нөлөөллөөс илүү редакцийн хязгаарлалт давамгайлдаг.
Палетт
Брэнд
- Violet Spark
#0447ff— Бүтээгдэхүүний харааны онцлох шинж чанар - Зөвхөн аудио бөмбөрцгийн чимэглэл болон гоёл чимэглэлийн бүтээгдэхүүний дүрс дотор харагдана; интерфэйсийн элементүүдэд хэзээ ч ашиглагддаггүй.
Төвийг сахисан
- Eggshell
#fdfcfc— Хуудасны даавуу, товчлуурын гадаргуу болон картын гадаргуу нь тод цагаан биш харин дулаан, бага зэрэг цөцгийтэй тул дижитал гялбаанаас зайлсхийж, талбайд цаас шиг тайван байдлыг өгөх болно. - Warm Taupe
#f5f3f1— Хуваагч тууз, гоёл чимэглэлийн картууд болон нэмэлт гадаргуугийн түвшин нь царцсан гадаргуугаас нэг алхам гүн бөгөөд чимээгүй, хил хязгааргүй тусгаарлалтыг бий болгодог. - Stone
#ebe8e4— Нимгэн хүрээ, хуваагч болон дүрс тэмдгийн дэвсгэр нь бор шар болон дунд зэргийн саарал өнгийн хооронд байрлах дулаан саарал өнгөтэй бөгөөд даарсан мэдрэмж төрүүлэхгүй. - Ink
#000000— Үндсэн текст, дүүргэсэн товчлуурууд, навигаци эсвэл холбоосууд байсан ч цэвэр хар өнгө нь дулаан өнгөний палитрын үндэс суурь болж, систем дэх цорын ганц тод ялгаатай байдлыг бий болгодог. - Graphite
#44403b— Үндсэн текст, хэсгийн гарчиг - хар өнгийн хатуу ширүүн мэдрэмжгүйгээр хурц тод харагдах шаардлагатай текстийн хувьд нарийхан, дулаан хар саарал өнгөтэй. - Smoke
#777169— Үндсэн текст, тодорхой бус тайлбар, тайлбар нь дунд зэргийн дулаан саарал өнгөтэй; карт болон сэдэвчилсэн текстүүдийн давамгайлсан, уншигдахуйц боловч тайван хэв маяг.
Типографи
10-аас 48 пиксел хүртэл · 8 алхам
- Waldenburg — солих: Inter (300) or Söhne Light · тоймууд 300 · Зөвхөн гарчиг болон дизайны элементүүдэд зориулагдсан. 48/36/32px форматаар 300 фонтын зузаантайгаар ашиглагддаг - хэт хөнгөн фонт нь уламжлалт бус; ихэнх вэбсайтууд 600-700 ашигладаг; энэхүү нарийн фонт нь хязгаарлалтаар дамжуулан эрх мэдлийг илэрхийлдэг. -0.02em гэсэн нягт үсгийн зай нь том хэмжээтэй үсгүүдийн хооронд илүү нягт тохирох байдлыг бий болгодог. Хувилбарууд: 300 жинтэй "Inter" эсвэл хөнгөн жинтэй "Söhne" нь дээд зэрэглэлийн хувилбар юм.
- Inter — солих: Inter or system-ui · тоймууд 400, 500 · Дэлгэцээс гадуурх бүх зүйл: үндсэн текст, навигаци, товчлуурууд, холбоосууд, шошго, оролтын талбарууд, картууд. 400 нь анхдагч жин; 500 нь товчлуурууд болон тодруулсан холбоосуудад зориулагдсан. Хэмжээ нь 10-10 хооронд хэлбэлздэг бөгөөд мөр хоорондын зай багассан (1.47–1.6) тул догол мөрүүдэд амьсгалах зай бий болгодог. 14-3 хүртэлх хэмжээтэй +1 (2) үсгийн зай бага байх нь жижиг хэмжээтэй уншихад хялбар байдлыг сайжруулдаг.
- Geist Mono — солих: JetBrains Mono or IBM Plex Mono · тоймууд 400 · Код эсвэл техникийн текстийн хажууд байрлах микротекст нь 13 пикселийн өндөртэй бөгөөд техникийн шошго эсвэл мета өгөгдөлд ховор хэрэглэгддэг (давтамж = 28). Нэг давхаргатай, мөрийн өндөр нь 1.69.
Интервал ба хэлбэр
| Зорилго | Утга |
|---|---|
| Нягтрал | нягт |
| Үндсэн алхам | 8-16px |
| Товчлуурын радиус | 9999px |
| Картын радиус | 20px |
| Сүүдэр | сүүдрийн оронд хил хязгаар байхгүй |
| Хэсгүүдийн хооронд | 96-125px |
| Хуудасны өргөн | 1280px |
Хиймэл оюун ухаан таны вэбсайтыг ElevenLabs хэв маягаар бүтээж, дүүргэх болно
- Instagram, TikTok, Facebook холбоосоор дамжуулан бүтээгдэхүүн болон нийтлэлүүдээр дүүргээрэй.
- Хуучин сайтаасаа контентыг шилжүүлэх - зүгээр л хаягийг нь зааж өгнө үү.
- Шилдэг хөдөлгүүр дээрх орчин үеийн дизайн: Серверийн рендеринг болон SEO оновчлолыг хайрцагнаас нь гарган React ( Next.js).
- Хайлтын үр дүн болон мэдрэлийн сүлжээний зөвлөмжид зориулсан бүрэн автомат SEO оновчлол.
Төстэй хэв маяг
- Mollie — Ноолуурын лангуу, бараан өнгийн дэвтэр. Хар текстийн эргэн тойронд редакцийн дизайн хийхэд хангалттай цагаан зай үлдээгээд, бүтээгдэхүүнтэй холбоотой санаануудыг бүлээн тос, эспрессо бор шар айраг, бодит төлбөрийн аргуудын хүрэлцэхүйц зургуудаар бататга.
- Kagi — Тусдаа уншлагын өрөө. Тод графит текстийн эргэн тойронд задгай цагаан зай гаргаж, нарийн нил ягаан өнгийн өргөлт болон дулаан пастел гадаргууг ашиглан амар амгаланг эвдээрэй.
- Milanote — Миланоте бол зориулалтын бүтээлч студи юм. Хөвөгч харааны самбаруудыг ашиглан редакцийн галерей маягийн хуудас үүсгээрэй: бараан хүрээтэй хана, цагаан дэлгэцийн зай, зөөлөн гүнтэй бодит объект шиг харагдах дэлгэцийн агшин.
- Co2 — Өвлийн гэрэлд уур амьсгалын атлас. Сериф гарчиг, ангиллын кодчилсон өгөгдөл, мөстэй зургууд нь өргөн цагаан захыг тодруулсан агаарын баримт бичгийн ландшафт шиг хуудас үүсгээрэй.
- GitButler — Текстийн төгсгөлд оюу өнгөтэй. Өндөр тодосгогчтой сериф гарчиг, нарийн техникийн тор, дулаан бал чулуун гадаргуу, даруухан оюу өнгийн аялгатай хослуулсан.
- Awesomic — Конфеттиг санагдуулам улбар шар цэг таслал бүхий редакцийн цайрын тор
- Monad — дулаан илгэн дээрх редакцийн техникийн сэтгүүл
- Dub — Линкийн царцсан будааны цаасан удирдлагын самбар
- Seline Analytics — Дулаан цаасан дээрх чимээгүй аналитик ширээ
- Notion — Үдийн наран дор дулаахан цаасан дэвтэр
- Anthropic — Дулаан илгэн цаасны тухай шинжлэх ухааны салбарын сэтгүүл - тайван зааны ясан гадаргуу, сериф хээтэй редакцийн гарчиг, зөвхөн үйлдэл шаардлагатай үед гарч ирдэг ганц шавар аялга.
- Calendly — Хүйтэн гантиг дээр хар хөх бэх