Хавтгай дизайн: яагаад дизайн хавтгай болсон бэ? Хавтгай дизайн ба материалын дизайн: Тэдний ялгаа нь юу вэ? Хавтгай дизайн ба материалын загвар нь ялгаатай.

"Хавтгай дизайн"-ын хувьсгал 2010 онд Windows Phone платформ дээр гарч ирснээс хойш үргэлжилсээр байна. Яагаад гэдгийг ойлгоход хэцүү биш: энэ загвартай интерфэйс нь илүү ойлгомжтой, дасан зохицох элементүүд, орчин үеийн хүрээнүүдэд тохиромжтой, зөв ​​гүйцэтгэсэн тохиолдолд сэтгэл татам харагддаг.
Хавтгай загвар нь хаа сайгүй байдаг скеуоморф хэв маягийн эсрэг жин болж эхэлсэн боловч тэр цагаас хойш "Б хувилбар"-аас хамаагүй илүү болсон.

Эхэндээ, хавтгай нь зөвхөн хоёр хэмжээст бөгөөд минимализмд анхаарлаа төвлөрүүлдэг. Орчин үеийн хавтгай 2.o нь "бараг хавтгай" харагдуулахын тулд сүүдэр, градиент болон бусад элементүүдийг ашигладаг.

Орчин үеийн хавтгай дизайны 5 онцлог бүрэлдэхүүн хэсэг:

1. Урт сүүдэр
Урт сүүдэр нь интерфэйсийг сэтгэл татам болгодог минималист дүрсний нарийн ширийн зүйлийг алдагдуулахгүйгээр зургийн гүн, хэмжээсийг нэмдэг.

2. Динамик өнгө
Сийрэг дүрслэлийг эрч хүчтэй өнгө, ялангуяа цайвар сүүдэрээр нөхөхөд хялбар байдаг.
Элементүүдийн үндсэн өнгөнөөс ялгаатай дэвсгэрийн өөр өөр өнгө нь хавтанцар цэстэй хуудсыг илүү амьд болгодог.
Flat UI Colors вэбсайт нь хавтгайд зориулсан хамгийн үр дүнтэй өнгөний загварыг агуулдаг.

3. Энгийн хэвлэх арга
Хавтгай үсгийн фонтыг сонгохдоо нэг шалгуур дээр суурилдаг: унших чадвар. Тогтмол зураастай Sans serif фонтыг ихэвчлэн ашигладаг.

4. Ил тод товчлуур
Орчин үеийн вэб дизайны чиг хандлагатай элементүүдийн нэг. Шалтгаан нь нэг их олны анхаарлыг татдаггүй ч товчлуур гэдгээрээ илт танигддаг.

5. Минимализм
Хавтгай ба минимализм нь ижил зарчмуудыг ашигладаг: энгийн байдал, агуулгад анхаарлаа төвлөрүүлдэг.
Хавтгай дизайныг ашиглах нь бүх нийтийн шийдэл мэт санагдаж болох ч минимализмыг хэрэгжүүлэхэд хэцүү байдаг: ажлын элемент бага байх тусам илүү их анхаарал шаарддаг.

Хавтгай дизайн хичнээн гайхалтай мэт санагдаж байсан ч энэ нь таны сайтад тохирох баталгаа байхгүй. Энэ нь дэлхийн дахин төлөвлөлтийг хийх нь зүйтэй эсэхийг мэдэхийн тулд түүний гол давуу талуудыг шалгаарай.

Давуу тал:
хариу үйлдэл үзүүлэх интерфэйс дээр ашигладаг;
хэрэглэгчийн навигацийг хялбаршуулдаг;
тодорхой бүтэц, бүдүүвч дүрслэл нь хуудасны дотоод логикийг онцолж өгдөг;
графикийн энгийн байдлаас шалтгаалан хуудсыг хурдан ачаалах;
Танил хэвлэх нь унших чадварыг сайжруулдаг.

Хавтгай дизайн нь энгийн бөгөөд минимализмыг илэрхийлдэг бөгөөд энэ нь нөгөө талаас харахад төвөгтэй мессежийг дамжуулахад хэцүү болгодог. Тиймээс, интерфэйсийг хялбарчлах гэж яарахаасаа өмнө сайт болон хэрэглэгчийн хоорондын харилцааг сайтар бодож үзэх хэрэгтэй.

Вэб дизайны чиг хандлагын ном дээр үндэслэсэн.

Саяхан вэбсайт, хэрэглэгчийн интерфейсийн дизайны тодорхой хэв маяг нь асар их алдартай болсон бөгөөд үүнийг элементүүдийн загварчлалын ачаар Flat гэж нэрлэдэг.

Хэрэв та Хавтгай дүрмийн дагуу хийгдсэн вэбсайтыг харвал ямар ч градиент шилжилт, сүүдэр, хэмжээ, бүтэцтэй холбоотой өчүүхэн ч гэсэн харагдахгүй. Хавтгай хэв маягийн үндсэн зарчим нь энгийн, товч бөгөөд минимализм юм. Гол онцлог шинж чанарууд нь таны анхаарлаа төвлөрүүлж болох зүйлс юм - тод ер бусын өнгө, стандарт бус хэвлэх, график командууд.

Өнөө үед улам олон дизайнерууд энэ чиг хандлагыг ажилдаа ашиглаж байгаа боловч Flat хэв маяг нь орчин үеийн гар утасны үйлдлийн системүүд Windows Phone болон iOS 7-ийн тархалтаар онцгой алдартай болсон, учир нь тэд энэ чиг хандлагыг дагаж мөрддөггүй ч гэсэн. бүрэн.

Манай компани нь Flat загвараар вэбсайт хийх туршлагатай бөгөөд бид танд хавтгай вэбсайт хийхэд туслахдаа баяртай байх болно!

Энэ нийтлэлд бид хавтгай дизайны үндсэн зарчмуудыг онцлон харуулах болно, хэрэв та өөрийн төслийн үндсэн хэв маяг болгон хавтгай ашиглахыг хүсч байвал дагаж мөрдөх ёстой.

Доор бид хавтгай хэв маягийг ашигладаг зарим сайтуудад дүн шинжилгээ хийж, жишээ өгөх болно.

1. Бүх эффектийг арилга

Хавтгай дизайны үндсэн зарчим бол өөрөө аль хэдийн хавтгай болсон хоёр хэмжээст дүрсийг бүтээх явдал юм. Үүний зэрэгцээ та зурган дээр дор хаяж зарим гүнийг нэмж чадах бүх элементүүдээс салах хэрэгтэй: градиент, гөлгөр шилжилт, сүүдэр, налуу, эзэлхүүн, бүтэц гэх мэт. Зургийн бүх элементүүд нь хатуу ирмэгтэй, мөн зургийн бусад элементүүдтэй харьцуулахад ялгардаггүй эсвэл гүнтэй байдаггүй.

Хавтгай загварт та бодит харагдахыг хичээдэг элементүүдийг олохгүй (skeuomorphism), 3D хөдөлгөөнт дүрс, бодит дүрс гэх мэт. Гэсэн хэдий ч загвар нь өөрөө уламжлалт загвартай төстэй хэвээр үлдэхийг хичээдэг боловч одоо шошго, товчлуурууд, навигацууд тэргүүлэх байр суурь эзэлдэг.

Өнгөц харахад Flat дизайн ашигладаг сайт нь хэтэрхий энгийн мэт санагдаж болох ч үнэн хэрэгтээ энэ хэв маяг нь элементүүдийн тодорхой шатлал, хэрэглэгчийн харилцааны бүх хэрэгслүүдийн тохиромжтой байрлалаар тодорхойлогддог тул ашиглалтын өндөр оноотой байдаг.

2. Энгийн элементүүдийг ашиглах

Хавтгай дизайны зорилгодоо хүрэхийн тулд дизайнерууд товчлуур, дүрсийг ашигладаг. Тэд аль болох ойлгомжтой, товших боломжтой байх ёстой. Бусад бүх интерфейсийн элементүүдийн нэгэн адил тэдгээр нь нэмэлт нөлөө үзүүлэхгүйгээр тэгш, энгийн байх ёстой. Загвар зохион бүтээгчид мөн ихэвчлэн энгийн геометрийн дүрсийг ашигладаг - тэгш өнцөгт, тойрог, дөрвөлжин, хэлбэр бүр нь тусдаа объект байх боломжийг олгодог.

3. Типографид анхаарлаа хандуулцгаая

Өмнөх зарчмын дагуу хавтгай дизайн дахь графикууд нь энгийн байдаг тул маш чухал элемент бол бичээсийн загвар юм. Хавтгай дизайнд товчлуурын хамт хэвлэх зураг гарч ирдэг.

Фонтууд нь уншигдахуйц байх ёстой бөгөөд мэдээжийн хэрэг дизайнтай нийцсэн байх ёстой, учир нь энгийн загвартай бол маш гоёмсог фонтууд харагдахгүй болно. Гэсэн хэдий ч та ердийн фонт ашиглах ёсгүй, туршилт хийж, хэрэглэгчийн анхаарлыг татахуйц фонтыг сонгох нь дээр.

Та энгийн sans-serif фонтыг урлагийн элемент гэж үзэх шинэ фонттой хослуулж болно. Фонтууд нь дизайныг илүү энгийн бөгөөд ойлгомжтой болгоход тусалдаг бол товчлуурууд болон бусад элементүүд нь зөвхөн харилцан үйлчлэлийг сайжруулахад туслах ёстой.

4. Өнгө өнгөөр ​​олны анхаарлыг татцгаая

Өнгө нь хавтгай загварт бараг гол үүрэг гүйцэтгэдэг. Хэрэв та энэхүү үзэл баримтлалын үндсэн дээр бий болсон сайтуудыг сайтар судалж үзвэл таны анхаарлыг татах хамгийн эхний зүйл бол тод өнгөт палитр юм. Энэ нь ихэвчлэн хоёроос гурван ялгаатай цэвэр (сүүдэргүй) өнгөнөөс бүрддэг боловч энэ тоо найм хүртэл хүрч болно. Түүнээс гадна эдгээр бүх өнгийг ихэвчлэн адилхан ашигладаг.

Хамгийн алдартай өнгө нь үндсэн болон хоёрдогч өнгө юм. Энэ нь үндсэн өнгө (цэнхэр, ягаан, шар, хар) ба тэдгээрийн холимог дээр үндэслэн олж авсан өнгө юм. Мөн хулд, нил ягаан гэх мэт хавтгай загвар гаргахдаа чимэг өнгийг өнгөний схемд ихэвчлэн ашигладаг.

5. Минимализм

Хавтгай загвар нь энгийн шинж чанартай бөгөөд минималист хандлагад сайн тохирдог.

Сайтын ерөнхий дизайны хувьд та хэт олон хонх, шүгэлээс зайлсхийх хэрэгтэй. Мэдээжийн хэрэг, энгийн өнгө, текст хангалтгүй байж магадгүй юм. Тиймээс, хэрэв та харааны эффект нэмэхийг хүсвэл энгийн зургуудыг сонгох хэрэгтэй. Зарим жижиглэн худалдааны сайтууд бүтээгдэхүүнээ энгийн, анхаарал сарниулахгүй дэвсгэр дээр байрлуулахын тулд хавтгай загварыг ашигладаг.

Зарим гэрэл зургууд нь байгалийн гүнтэй байдаг боловч ерөнхийдөө энэ нь дизайны ерөнхий хавтгайд нийцдэг гэдгийг тэмдэглэх нь зүйтэй.

Зохиогчоос:Сайн байцгаана уу, найзуудаа! Өнөөдөр бид хавтгай дизайн, хавтгай вэбсайт дизайн гэж юу болох талаар ярилцах болно. Энэ нэр томъёо нь вэб дизайнеруудын зүрх сэтгэлийг удаан хугацаанд байлдан дагуулж ирсэн бөгөөд өнөөг хүртэл итгэлтэйгээр чиг хандлагатай хэвээр байна. Томоохон компаниуд (Google, YouTube, Microsoft, Apple Inc. гэх мэт) вэбсайт, программынхаа дизайн хийхэд ашигладаг. Та хавтгай вэбсайт дизайныг дэмжигчдийн бүлэгт ороогүй хэвээр байна уу? Дараа нь бид чам дээр очно!

Хавтгай дизайныг ийм зэрлэгээр алдаршуулах болсон шалтгааныг та юу гэж бодож байна вэ? Би танд товчхон хариулъя: энэ үнэхээр ажилладаг! Энэ нийтлэлд би энэ хэв маяг гэж юу болохыг тайлбарлаж, түүний давуу болон сул талуудын талаар танд хэлэх болно, мөн танд гайхалтай зүйл хийхэд урам зориг өгөх хавтгай вэбсайт дизайны гайхалтай жишээг үзүүлэх болно. За, явцгаая!

Энэ бүхэн скеуоморфизмээс эхэлсэн

Мэдэхгүй хүмүүсийн хувьд skeuomorphism нь бохир үг биш, харин өөр вэб дизайны хэв маяг юм. Хавтгай загварыг ихэвчлэн скеуоморфизмын эсрэг тал гэж үздэг бөгөөд энэ нь миний бодлоор огт зөв биш юм. Энэ бол сөргөлдөөн гэхээсээ илүү хялбарчлах явдал юм.

2010 он хүртэл интерфэйсийн дизайнд скеуоморфизм давамгайлж байсан. Тэрээр гурван хэмжээст дүрсийн бүтэц, сүүдэр, тусгал болон бусад шинж чанаруудыг идэвхтэй ашиглаж элементүүдийг бодит байдал дээр харуулсан. Apple энэ тал дээр онцгой хүчин чармайлт гаргаж, ихэнх програм хангамжийн объектуудыг бодит амьдрал дээрх объектуудаас анхааралтай хуулж авав.

Удалгүй псевдо гүдгэр дүрсүүд нь ихэнх хэрэглэгчид болон вэб хөгжүүлэгчдийн анхаарлыг татахаа больсон нь хавтгай вэбсайт дизайны эриний эхлэлийг тавьсан юм. Бүх гоёл чимэглэлийн элементүүдийг арилгах шаардлагатай гэсэн дүгнэлтэд дэлхий нийт хүрсэн бөгөөд зөвхөн эцсийн хэрэглэгчтэй харилцахад тохиромжтой зүйл л үлдэх ёстой.

"Хамгийн сайн загвар бол аль болох бага дизайн"

Дитер Рамс ус руу хэрхэн харав - интрузив дизайн, хөдөлгөөнт эффект гэх мэтийг эсэргүүцдэг алдартай үйлдвэрлэлийн дизайнер 2013 оны 6-р сард Apple Inc. хавтгай вэб дизайны бүх шинж чанарыг хүлээн авсан хувьсгалт iOS 7-г танилцуулав. Гэсэн хэдий ч онгоц бодит байдал, эзэлхүүнийг тэр даруй "ялагдаагүй".

Удаан хугацааны турш хэрэглэгчид Стив Жобсын ид шид, "та долоохыг хүсдэг" дүрсийг мартаж чадаагүй. Олон хүмүүс "хөөрхий долоо"-той салах ёс гүйцэтгэж, "гэрэлт Android" руу шилжсэн. Гал дээр тос нэмсэн зүйл бол iOS 7-д гарсан олон тооны алдаанууд, мөн аппликешн нээх үед параллакс бүхий цагаан тунгалаг, тунгалаг дизайнтай байсан.

Зайлшгүй бодит байдалд бууж, Apple-ийн үйлдлийн системтэй үлдсэн хүмүүс эцэст нь хавтгай вэб дизайн нь сонирхолтой харагдахаас гадна бүх хэрэглээнд эмх цэгц, нэгдмэл дүрслэлийн хэв маягийг авчирдаг гэдгийг ойлгосон.

Хавтгай дизайны давуу болон сул талууд

Энэ хэв маягийг ашиглах давуу талууд нь:

харааны хэрэгслийн найрлагын тодорхой байдал, товч тодорхой байдал. "Илүү их зүйл байхгүй" хэв маягийн мэдрэмжтэй интерфейс, үүний ачаар хэрэглэгчид юу хэлэхийг хүсч байгаагаа хурдан ойлгодог;

сайн хэвлэхийг чухалчилдаг. Агуулга нэгдүгээрт ордог бөгөөд энэ нь өнөөгийн мэдээллийн элбэг дэлбэг байдалд туйлын чухал юм;

вэб хуудасны хэмжээ багасч, хамгийн бага тооны харааны эффектийн ачаар сайтын гүйцэтгэл илүү хурдан болно. Энэ нь дасан зохицох хувилбаруудыг бий болгоход ялангуяа ашигтай байдаг, учир нь маягтууд нь энгийн байх тусмаа хөдөлгөөнт төхөөрөмжийн жижиг дэлгэц дээр харуулахад хялбар байдаг.

Хавтгай вэб дизайн нь бас сул талуудтай:

вэб дизайнерын төсөөллийг хялбаршуулсан өнгө, хэв маяг, дүрс дүрслэлээр хязгаарлах. Тиймээс уйтгартай, утгагүй вэбсайт үүсгэх эрсдэл өндөр байдаг;

гурван хэмжээст болон сүүдэр байхгүй нь заримдаа элементийг товших боломжтой эсэхийг ойлгоход хэцүү болгодог;

тодорхой тогтсон дүрэм байхгүй.

Хэрэв та энэ хэв маягийг сайт дээрээ ашиглахаар шийдсэн бол баяр хүргэе - энэ нь таныг хэрэглэгчийн туршлагад анхаарч, цаг үетэйгээ хөл нийлүүлэн алхаж байгааг харуулж байна. Хэрэв та дөнгөж вэб дизайнераар эхэлж байгаа бөгөөд сайтаа хялбарчлахгүйгээр тохиромжтой харагдуулахын тулд хавтгай дизайныг хэрхэн зөв ашиглахаа мэдэхгүй байгаа бол дараах зөвлөмжийг ашиглана уу.

"Тоосгон хана" болон тод дэвсгэрийн талаар март. Хавтгай вэб дизайн нь арын дэвсгэр дээр энгийн, гөлгөр, зөөлөн зургуудыг ашиглах хандлагатай байдаг.

Ямар ч градиент, 3D дүрс, хөдөлгөөнт шилжилт болон бусад тусгай эффект байхгүй. Энэ бүхэн таны сайтыг хүндрүүлж, шуугиан дэгдээх болно - танд хэрэгтэй юу?

Тохиромжтой байдал, функцийг нэмэхийн тулд тодорхой тойм бүхий хавтгай дүрсүүдийг ашигла.

Хурц, баялаг өнгөт палитр ашиглана уу. Одоо чиг хандлага нь нарны спектрийн өнгө юм: цайвар шар, ягаан, ногоон. Хамгийн гол нь үүнийг хэтрүүлж болохгүй - хуудсан дээр 3-аас илүүгүй өнгө байх ёстой.

Типографид анхаарлаа хандуулаарай. Хавтгай дизайны хувьд үйл ажиллагааны уриалгыг бий болгож, сайтын эргэн тойронд хялбар чиглүүлэх боломжийг олгодог тод, анхны бичээсийг илүүд үздэг. Энд ч гэсэн үүнийг хэтрүүлэхгүй байх нь чухал юм. "Гараар бичсэн" болон бусад гоёмсог фонтуудыг март. Гарчгийг тодруулахын тулд том үсгийг ашиглаж болно.

Төрөл бүрийн геометрийн дүрсийг чөлөөтэй ашиглах боломжтой. Квадрат, тойрог, шугам болон бусад хэлбэрүүд нь вэбсайтын бүтцийг сайжруулахаас гадна тодорхой шатлал үүсгэж, агуулгыг хуваах болно. Хэрэглэгчид үүнийг үнэлэх болно, надад итгээрэй.

Навигацийн цэс болон сайтын бусад элементүүдийг аль болох хялбаршуулах. Товчлуурын хувьд ердийн тэгш өнцөгтийг сүүдэр, тодруулалгүйгээр ашигла.

Ийнхүү олон жилийн туршид хавтгай дизайны вэбсайтууд нь хүн бүрт хүлээн зөвшөөрөгдсөн стандарт болсон. Ихэнх орчин үеийн вэбсайтуудыг хараарай - тэдгээр нь үндсэндээ хавтгай юм.

Эцэст нь би амжилттай хавтгай дизайны амласан жишээнүүдийг өгөх болно, энэ нь танд өөрийн бүтээлийг бүтээх урам зориг өгөх болно.

1. http://dunked.com вэбсайт.

Төрөл бүрийн бүтээлч мэргэжлийн төлөөлөгчдөд чиглэсэн портфолио нийтлэх алдартай платформ. Минималист хавтгай вэб дизайн нь шаардлагагүй тусгай эффектүүдээр анхаарал сарниулдаггүй найдвартай, ойлгомжтой үйлчилгээний мэдрэмжийг төрүүлдэг.

2. Microsoft интерфейс.

Майкрософт бол хавтгай хэв маягийг маш их алдартай болгосон компаниудын нэг юм. Майкрософт 2000-аад оны дундуур гаргасан iPod-ийн өрсөлдөгч Zune тоглуулагчийг та санаж байгаа байх? Тиймээс, энэ бүтээгдэхүүний загвар нь тухайн үеийн ихэнх хэрэглээнээс эрс ялгаатай байсан бөгөөд энэ нь том хэвлэмэл, хавтгай дүрс, том, тод хэлбэрээс шалтгаалж байв.

Метро гэж нэрлэгддэг энэхүү интерфейс нь дараа нь хувийн компьютер (Windows 8 OS), Xbox 360 интерфейс болон бусад Mircosoft програм хангамжийн бүтээгдэхүүнүүд рүү шилжсэн.

3. Вэбсайт http://www.vox.com.

За онгод орсон уу? Псевдо-реалист 3D гоо зүйг тааж байна!

Тэгээд л болоо. Манай нийтлэлийг бүртгүүлж, нийгмийн сүлжээн дэх найзуудтайгаа хуваалцаарай. Танд өндөр хөрвөлт!

Хавтгай дизайн нь ойрын жилүүдийн дизайны гол чиглэл учраас бид таныг үүнийг илүү сайн мэдэж, түүний үндэс болсон 5 үндсэн зарчмыг сурахыг урьж байна.

Хавтгай дизайны танилцуулга

Орос хэл дээр хавтгай дизайн нь "хавтгай дизайн" гэж орчуулагддаг бөгөөд Apple iOS үйлдлийн системээ танилцуулсны дараа үнэмлэхүй дуртай болсон. Хэрэглээний дизайны минималист хандлагад анхаарлаа хандуулсан. Хэрэглэгчийн тав тухтай байдалд анхаарлаа хандуулдаг. Энэ бол "squeformism" (объектуудыг бодит байдал дээр дүрслэн харуулах) -ын эсрэг илт эсэргүүцэл юм. Сонголт нь илүү хялбаршуулсан, нэгэн зэрэг энгийн гоо зүйн шийдлүүд дээр унав. Бодит дүрслэлээс залхсан хэрэглэгчид энэ чиглэлийг баяртайгаар угтан авч, илүү олон вэб төслүүд энэ формат руу шилжиж байна.

"Хавтгай" гэдэг нь "уйтгартай" гэсэн үг биш гэдгийг тэмдэглэхийг хүсч байна. Хавтгай дизайны шийдлүүд нь үзэсгэлэнтэй, илүү боловсронгуй, цэвэрхэн, илүүдэлгүй, "тайван арал" болж хувирдаг. Тэд эцэст нь агуулгыг ойлгомжтой болгодог. Үлдсэн зүйл бол үндсэн зарчмуудыг практикт хэрэгжүүлэхийн тулд сурах явдал юм.

Зарчим No1: Шаардлагагүй нөлөө үзүүлэхгүй

"Хавтгай" загвар нь эзлэхүүнийг дамжуулахыг хичээдэггүй тул хоёр хэмжээст дүрслэл дээр суурилдаг. Энэ нь бүтэцтэй (урт сүүдрийг эс тооцвол) ямар ч сүүдэр, тусгал, тодруулгыг харахгүй гэсэн үг юм. Зөвхөн контурыг шилжүүлэх, өөр юу ч биш.

2-р зарчим: энгийн байх тусмаа сайн

Дизайндаа моносилаб дүрсийг ашиглахыг зөвлөж байна, мөн контурын тод байдлыг хянахын тулд хөнгөн, жингүйдэлтэй байдлыг онцлон тэмдэглэхийг зөвлөж байна. Нэмж дурдахад ийм лаконик элементүүд нь мэдрэгчийг сайн дуурайж, объекттой харилцах хүслийг бий болгодог (дарах, хүрэх урилга). Гэсэн хэдий ч элементүүдийн энгийн байдал нь бүхэлдээ дизайны энгийн байдалтай тэнцүү биш юм - энэ нь зөвхөн тоймд хамаарна. Үүний үр дүнд хэрэглэгчийн харсан бүх зүйл түүнд ойлгомжтой бөгөөд тэр үүнийг хялбархан ашиглах боломжтой.

3-р зарчим: Бичлэг ба түүний ач холбогдол

Хавтгай загвар нь фонттой ажиллахдаа маш болгоомжтой байхыг шаарддаг. Өөрөөр хэлбэл, тэдний зан чанар нь дизайны схемийг зөрчилдөхгүйгээр нөхөх ёстой. Түүнчлэн, хавтгай загварт фонт нь навигацийн гол элемент юм.

4-р зарчим: Өнгөний өргөлт

Зөвхөн фонт төдийгүй өнгө нь "хавтгай" дизайны чухал хэсэг юм. Палеттуудын дийлэнх нь 2-3 өнгө дээр суурилдаг боловч мэдээжийн хэрэг үл хамаарах зүйлүүд байдаг. Ихэвчлэн баялаг, тод, гэхдээ нэгэн зэрэг цэвэр өнгө сонгогддог. Дээр дурдсанчлан градиент эсвэл шаардлагагүй шилжилт байхгүй.

5-р зарчим: минимализмыг сонгох

Хавтгай загвар нь минимализм гэх мэт дэлхийн чиг хандлагын тод жишээ юм. Загвар зохион бүтээгчид шаардлагагүй хонх, шүгэлээс татгалзаж, дүрслэх нарийн төвөгтэй, далд арга барилаас татгалзаж, хэрэглэгчийн үйл ажиллагааны хэлбэрээр үр жимсээ өгдөг.

Хавтгай эсвэл бараг хавтгай уу? Бид буулт хайж байна!

Эцэст нь хэлэхэд, өнөөдөр хавтгай ба хавтгай бус дизайны хооронд синергетик байгааг тэмдэглэхийг хүсч байна. Бид "бараг хавтгай" загварын тухай ярьж байна. Энэ нь энгийн бөгөөд товч элементүүд болон хоёр хэмжээст орон зайн хамт дизайнерууд гүн болон хэтийн төлөвийн 1-2 аргыг ашигладаг бол тайлбарласан үзэл баримтлалын хамгийн түгээмэл хэрэглээ юм.

Мөн 2017 оны чиг хандлага нь Semi Flat Design - хагас хавтгай загвар байв. Материалын дизайны нөлөөгөөр энэ нь бага зэрэг орон зайн шинж чанартай болсон. Загварыг хагас хавтгай харагдуулдаг цайвар сүүдэр гарч ирдэг. Хавтгай загвар нь өнөөг хүртэл хамааралтай хэвээр байгаа бөгөөд сүүдэрээс болж энэ нь илүү гүнзгий, төвөгтэй болсон боловч үндсэн ойлголтыг зөрчөөгүй байна.

Хавтгай дизайн- дизайны нийгэмлэг бүхэлдээ ярьдаг харьцангуй шинэ чиг хандлага.

Зарим хүмүүс үүнд дуртай, зарим нь огт дасаж чаддаггүй, бүр үзэн яддаг.

Сайн загвар нь юуны түрүүнд үйлчлүүлэгчийн бизнесийн асуудлыг шийдэх ёстой бөгөөд үүнд ямар арга замаар хүрэх вэ гэдэг нь хоёрдогч асуулт юм. Хэрэв дизайнер "хавтгай загвар" -ыг загвар эсвэл хэрэгсэл болгон сонгосон бол тийм байх болно! Гэхдээ энэ хэв маяг нь бүх төслүүдэд тохиромжгүй гэдгийг мартаж болохгүй.

Тиймээс, хэрэв та загварын чиг хандлагад автаж, "хавтгай дизайн" хэв маягаар ажиллахаар шийдсэн бол юу санах хэрэгтэйг дүн шинжилгээ хийцгээе.

Хавтгай дизайны үндсэн зарчим нь:

1. Ямар ч нөлөө үзүүлэхгүй

2. энгийн элементүүд

3. Хэвлэлийн хэв маягт анхаарлаа төвлөрүүл

4. Өнгө дээр анхаарлаа төвлөрүүл

5. Минималист хандлага

6. "Бараг" хавтгай загвар

Одоо хавтгай дизайны зарчим бүрийг илүү нарийвчлан авч үзье.

Ямар ч нөлөө байхгүй

Хавтгай дизайн нь ихэвчлэн сүүдэр, налуу, товойлгох, градиент гэх мэт эффект болон гүн, эзэлхүүнийг нэмдэг бусад аргыг ашигладаггүй. "Скеморфизм" стилист өрсөлдөгчөөс ялгаатай нь 3D эффект эсвэл материаллаг байдлыг шилжүүлэхгүй. Элемент бүр нь дүрс, навигацийн самбар эсвэл хүрээ, товчлуур гэх мэт тодорхой байх ёстой.

Хавтгай хэв маяг нь нэмэлт шинж чанар, элементгүйгээр тод харагддаг. Энэ нь найрлагын шатлал, элементүүдийн байршлын тодорхой мэдрэмж дээр тулгуурладаг. Энэхүү бүтэц нь дизайныг ойлгоход хялбар бөгөөд хэрэглэгч бүрт ойлгомжтой болгодог.

Энгийн элементүүд

Хавтгай дизайн нь ихэвчлэн товчлуур, дүрс гэх мэт энгийн хэрэглэгчийн интерфейсийн элементүүдийг ашигладаг. Эдгээр интерфэйсийн элементүүдийг бүтээхдээ дизайнерууд энгийн дүрсийг (тэгш өнцөгт, тойрог, дөрвөлжин гэх мэт) баримталдаг - энэ нь дүрс бүрийг бие даан байрлуулах боломжийг олгодог.

Гэхдээ энгийн элементүүдийг энгийн загвартай андуурч болохгүй, хавтгай дизайны үзэл баримтлал нь ямар ч загварын хувьд өөр төрлийн дизайны үзэл баримтлалтай адил төвөгтэй байж болно.


Типографид анхаарлаа хандуулаарай

Хавтгай загвар нь эзэлхүүнгүй энгийн хэлбэрийн элементүүд дээр суурилдаг тул хэв маяг нь хавтгай найрлагад маш чухал элемент юм.

Фонтын шинж чанар нь ерөнхий схем, найрлагатай тохирч байх ёстой - хэт хялбаршуулсан загварын загвар дээр хэт нарийн төвөгтэй фонт нь хачирхалтай, дүр эсгэдэг. Энгийн sans-serif фонтыг тод эсвэл тод ашиглах нь дээр. Текст нь энгийн хэлбэрүүдтэй нийцсэн байх ёстой.

Фонт нь хэрэглэгчдэд манай интерфейстэй харилцахад туслах туслах хэрэгсэл байх ёстой. Товчлуур болон бусад элементүүдийн шошго нь нарийн төвөгтэй байх ёсгүй.


Өнгөт анхаарлаа хандуулаарай

Өнгө бол дизайны чухал хэсэг юм. Хавтгай загварын палитр нь ихэвчлэн бусад загварын хэв маягаас хамаагүй илүү тод, өнгөлөг байдаг. 2-3 өнгөт анхаарлаа төвлөрүүлдэг ердийн загвартай харьцуулахад хавтгай загвар нь 6 эсвэл бүр 8 өнгийн сүүдэртэй байж болно.