Хавтгай дизайны дүрийг хэрхэн зурах вэ

Хавтгай дизайны дүрийг хэрхэн зурах вэ
Rick Davis

Яг одоо та өөрөөсөө асууж байгаа байх: Хавтгай дүрийн дизайн гэж юу вэ?

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

Дизайн онолын хувьд хавтгай дизайн нь дүрсийг скеуоморфизм эсвэл гурван хэмжээстгүй болгоход чиглэдэг.

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

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

За, дизайны хөдөлгөөний талаар хангалттай (одоохондоо). За ингээд хичээлээ эхлүүлцгээе! Та доорх видео хувилбарыг үзэх эсвэл үргэлжлүүлэн унших боломжтой.

Манай шинэ алхам алхмаар зааварчилгаагаар зураач Соодабе Дамаванди бидэнд Хавтгай дизайны дүрийг хэрхэн бүтээхийг харуулах болно.

Та боломжтой. Энэ дизайны процессыг ирээдүйд бүтээхийг хүссэн бүх хавтгай дүрд хэрэглээрэй.

Танд хэрэгтэй зүйл:

• iPad

• Apple Pencil

Мөн_үзнэ үү: Дүрс бүхий барилга

• Vectornator-ийн хамгийн сүүлийн хувилбар

Та юу сурах вэ:

Лавлагааг хэрхэн импортлохsketch

• Үзэгний хэрэгслийг хэрхэн ашиглах вэ

• Харандаа хэрэглүүрийг хэрхэн ашиглах вэ

• Shape хэрэгслийг хэрхэн ашиглах вэ

• Хэрхэн зохион байгуулах вэ давхаргууд

• Булийн үйлдлүүдийг хэрхэн гүйцэтгэх

1-р алхам

Баримт бичиг болон өнгөт палитрыг бэлтгэх

Эхлээд та дүрээ зурах хэрэгтэй.

Интернэтээр аялж, хавтгай дүрийг хэрхэн бүтээх талаар бусад уран бүтээлчдээс санаа аваарай. Та мөн манай зааварт зориулж Soodabeh-ийн бүтээсэн ноорог хуулбарыг зурж болно. Та өөрийн хүссэн зургийн программыг өөрийн ноорог зурахдаа ашиглаж болно, гэхдээ энэ гарын авлагад Soodabeh Procreate програмыг ашигласан болно.

Анхны ноорог зурсаны дараа Vectornator руу шилжих цаг боллоо.

+ товчийг дарж Vectornator-д шинэ баримт бичгийг нээнэ үү. Та загвар сонгох эсвэл өөрийн баримт бичгийн хэмжээг гараар тохируулах боломжтой.

Хэрэв та зотон зургийнхаа дэвсгэр тал нь даамын самбарыг харвал Тохиргоо > Канвас > Цагаан дэвсгэр.

Давхарга таб дээр шинэ давхарга үүсгээд "Норог" гэж нэрлэнэ үү. Хэрэв та + товчийг дахин дарвал поповер цэснээс импортын сонголтыг сонгоод хавтгай тэмдэгтийн тоймыг сонгож болно.

Sketch давхаргын тунгалаг байдлыг бага зэрэг бууруулаад дараа нь түгжих тэмдэг дээр дарж түгжинэ үү.

Хоёр дахь давхаргыг үүсгээд "Вектор дүрсүүд" гэж нэрлэнэ үү.

Бид шинэ давхарга дээрээ зурж эхлэхээсээ өмнө эхлээд бэлтгэлээ хийнэөнгөт палитр. Соодабе эелдэгээр бидэнд уран бүтээлийнхээ зургаан өнцөгтийн өнгөний кодуудын бүрэн жагсаалтыг өгсөн:

Hex код:

- Улбар шар (үс): #fd553c

- Хамгийн бараан улбар шар (боодол ба уруул): #e44f25

- Бараан улбар шар ( дэвсгэр хэлбэр): #fd553c

- Шар (арын зууван): #ffb700

- Шүрэн (фоны зууван & ичих ба хөлний сүүдэр): #ffa890

- Арьс: #ffc3B3

- Бараан арьс: #ffa890

- Дотор хүзүүвч & дээд даашинз: #9194a2

- Ханцуй & яст мэлхий хүзүү: #bbbdca

- Судал: #2f3753

- Ханцуйвч: #e1e3ef

- Юбка & цүнх: #цагаан

- Дотор банзал: #434558

- Дотор гутал & ; гутлын дөрвөлжин дэлгэрэнгүй: #333b56

- Гутал: #5f6782

Мөн_үзнэ үү: Корпорацийн зурагтай холбоотой асуудал юу вэ?

- Бараан гутал : #424b5f

Энэ жагсаалтаас зургаан өнцөгт өнгөний кодуудыг ашиглан Vectornator дээр өөрийн өнгөт палитрыг үүсгээрэй.

💡 Зөвлөгөө: Хэрэв та Vectornator дээр өнгөний дээжийг хэрхэн хийхээ мэдэхгүй байгаа бол захиалгат өнгөт палитрыг хэрхэн бүтээх талаар суралцаарай. Vectornator дээр Hex өнгөний кодыг хэрхэн тохируулах талаар мэдэх нь ялангуяа чухал юм. Алхам 2

Дэвсгэрийн элементүүдийг нэмэх

Одоо бид өнгөний палитрыг тохируулсны дараа арын элементүүдийг Shape ашиглан зурж эхэлнэ.Хэрэгсэл.

Энгийн дүрсийн хувьд Shape Tool, илүү жигд бус дүрсийн хувьд Pen Tool ашиглаж болно.

Эхлээд бид Хэлбэрийн хэрэглүүрийг ашиглан хэдэн жижиг дэвсгэр бөмбөлөг нэмж, том бөмбөлөг үүсгэхийн тулд Pen Tool ашиглана.

Зургийн дагуу цэгүүдийг зур. Bezier Curve Handles-ийг чирж шугам болон дүрсийг тохируулна уу. Та "Star Bézier Node" дээр дарж үзэгний хэрэгслээр үүсгэсэн замаа хааж болно.

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

Алхам 3

Нүүр, үс, хүзүү, гараа зур

Дараагийн алхамдаа бид дүрийг зурах болно.

Загварын табын дүүргэх хэсгийн доторх Hex өнгөт товчлуурыг гараар #ffc3B3 болгож тохируулна уу. Үзэгний хэрэглүүрийг сонгоод нүүрний хэлбэрийг дагаж, чихээ оруулахаа бүү мартаарай!

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

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

💡 Pro Tip: Хэрэв та Pen Tool ашиглан зурахад харьцангуй шинэ бол та дасгал хийж болно.эхлээд хэд хэдэн энгийн геометрийн дүрс зурах замаар бага зэрэг. Бид таныг бэлэн болтол хүлээж байх болно гэж амлаж байна! Хэрэв зарим дүрсийг зурахад хэтэрхий хэцүү байвал та харандаа хэрэгсэл рүү буцах боломжтой. Та дараа нь Node Tool ашиглан дүрсийнхээ замыг тохируулах боломжтой.

Одоо үсийг үүсгэхийн тулд Hex өнгөний кодыг #fd553c болгож тохируулна уу. Үсний зурсан зураасыг сайтар дагаж мөрдөөрэй, гэхдээ үсний боодлыг оруулаагүй болно (бид дараа нь тусдаа хэлбэртэйгээр үүсгэх болно).

Шаардлагатай бол Node Tool-ийг идэвхжүүлж өөрийн хэлбэрийн зангилаа болон Безье муруйг тохируулна уу. Хэрэв та анхлан суралцагч бол энэ нь танд хэд хэдэн оролдлого хийх шаардлагатай байж болох ч энэ нь маш сайн!

Одоо "Эрхлэх" таб эсвэл "Шуурхай үйлдэл" самбар дээрх Захиалгын дохиог ашиглан нүүрний хэлбэрийг урд тал руу шилжүүлээрэй.

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

Алхам 4

Хувцаслалт үүсгэх

Зууван хэлбэртэй хүзүүвчний нүхийг үүсгэ.

Зууван хэлбэрийг сонгоно уу. Хэлбэрийн хэрэглүүрийг хийж, лавлагаа зурган дээрх хүзүүвчний нүхний дээр байрлуулна уу.

Сонгох хэрэгслийг ашиглан дүрсийг шаардлагатай хэмжээгээр томруулж, эргүүлж, хөдөлгө.

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

💡 Pro Tip: Хэрэв та зарим хэсэгт өөр дүрсээр бүрхэгдсэн хэлбэрийг бий болговол давхардсан хэсгүүдэд шаардлагагүй болно гэдгийг санаарай. төгс харагдахын тулд! Энэ бяцхан заль мэх нь танд маш их цаг хэмнэх болно! Алхам 5

Хөл, гутал, түрийвчээ зур

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

Дүрс бүрийн дүүргэлтийн өнгийг Hex өнгөт товчлуурыг ашиглан гараар тохируулах эсвэл бидний өмнө нь үүсгэсэн хувийн өнгөт палитрыг сонгон авч болно.

Түргэн үйлдлүүд эсвэл Зохицуулах таб дээрх Захиалга дохиог ашиглан дүрсүүдийг тохируулна уу.

6-р алхам

Хувцаслалтын зураасыг үүсгэх

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

Хавтгай загварын баатрууд нь ихэвчлэн нарийн ширийн зүйлгүй, гэхдээ бага зэрэг гоёл чимэглэлийн өнгө оруулдаг. хавтгай дизайны шинж чанарын минималист үзэл баримтлалтай зөрчилддөггүй. (Ядаж л бид тэгж бодож байна!)

Эхлээд ноорог давхарга дээрх нүдний дүрс дээр товшиж ноорог давхаргыг нуу. Дараа нь харандаа хэрэгслийг сонгоно уу.

Загварын таб дээрээс Fill Mode-г унтрааж, Stroke Mode-г асааж, шугамын зузааныг 3pt болгож тохируулна уу.

Цус харвах зургаан өнцөгт өнгийг #2f3753 болгож тохируулна уу. Та харандаа хэрэгслийн хажууд байрлах гулсагчаар цохилтын жигд байдлыг тохируулж болно.

💡 Зөвлөгөө: Хэрэв та дижитал зураг зурахад шинээр орсон бол гөлгөр байдлыг дээд зэргээр нэмэгдүүлэхээс бүү ич!

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

Алхам 7

Тодруулга болон сүүдэр үүсгэх

Одоо бид' Үндсэн дүрсүүдийг тогтоосны дараа ард байгаа дүрсүүд урд талынхаас арай бараан өнгөтэй байгааг та анзаарсан байх.

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

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

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

Одоо, Шуурхай үйлдлийн талбар дахь Давхардах дохиогоор объектыг хуулбарлаж, сүүдрийн хэлбэрийн ард байрлуулна уу. Хоёр дүрсийг сонгоод Шуурхай үйлдлийн талбарт Boolean Operation Intersect-ийг ашиглана уу.

💡 Хэрэв та энэ нь юу гэсэн үг болохыг мэдэхгүй байгаа бол Vectornator дээр Булийн үйлдлүүд хэрхэн ажилладаг талаар илүү ихийг мэдэж аваарай.

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

Бидний тайлбарласан алхмуудыг давтах замаар сүүдэр болон гэрэлтүүлгийг зурж, Soodabeh-ийн лавлагаа зургийг анхааралтай ажиглаарай.

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

"Зохицуулах" таб дээр дохио зангааг захиал.

Алхам 8

Нүүрний нарийн ширийн зүйлийг зурах

Дараагийн алхамдаа бид хавтгай загварынхаа нүүр царайг бүтээх болно.

Хэлбэрийн хэрэглүүрээр нүд, хөмсөг, ичих өнгийг бүтээж, нүүрэн дээрх дүрсүүдийг байрлуул. Үзэгний хэрэглүүрийг ашиглан хамар, амаа хэлбэржүүлнэ.

Та дүрийнхээ нүүр царайнд сэтгэл хангалуун байх хүртлээ Сонгох хэрэглүүрийг ашиглан дүрсүүдийг хөдөлгөж, томруулж, эргүүлээрэй. Та Soodabeh-ээс яг нүүрний онцлогийг хуулбарлах шаардлагагүй, хэрэв хүсвэл өөрийн хувилбарыг зурж болно!

Хөөе, ингээд л боллоо, залуусаа, бид дууслаа! Бидэнтэй хамт бүтээлч байх нь танд таалагдсан гэдэгт найдаж байна - бид мэдээж таалагдсан!

Олон нийтийн сүлжээ болон Vectornator олон нийтийн урлагийн галлерейд хавтгай дизайны дүрүүдээ бидэнтэй хуваалцахаа бүү мартаарай.




Rick Davis
Rick Davis
Рик Дэвис бол энэ салбарт 10 гаруй жил ажилласан туршлагатай график дизайнер, визуал зураач юм. Тэрээр жижиг гарааны бизнесээс эхлээд томоохон корпорациуд хүртэл янз бүрийн үйлчлүүлэгчидтэй хамтран ажиллаж, тэдний дизайны зорилгод хүрэхэд нь тусалж, үр дүнтэй, үр дүнтэй дүрслэлээр дамжуулан брэндээ өргөжүүлжээ.Нью-Йорк хотын Дүрслэх урлагийн сургуулийг төгссөн Рик дизайны шинэ чиг хандлага, технологийг судлах хүсэл эрмэлзэлтэй бөгөөд энэ салбарт боломжтой зүйлсийн хил хязгаарыг байнга шахдаг. Тэрээр график дизайны програм хангамжийн чиглэлээр гүнзгий мэдлэгтэй бөгөөд мэдлэг, ойлголтоо бусадтай хуваалцахыг үргэлж хүсдэг.Дизайнерын ажлаас гадна Рик бол үнэнч блог хөтлөгч бөгөөд график дизайны программ хангамжийн ертөнц дэх хамгийн сүүлийн үеийн чиг хандлага, хөгжил дэвшлийн талаар мэдээлэл өгөх зорилготой. Тэрээр мэдээлэл, санаа бодлоо хуваалцах нь хүчирхэг, эрч хүчтэй дизайны нийгэмлэгийг хөгжүүлэх гол түлхүүр гэж үздэг бөгөөд бусад дизайнерууд болон бүтээлч хүмүүстэй онлайнаар холбогдохыг үргэлж хүсдэг.Үйлчлүүлэгчдээ зориулж шинэ лого зохион бүтээх, студидээ хамгийн сүүлийн үеийн хэрэгсэл, арга техникийг туршиж үзэх, эсвэл мэдээллийн чанартай, сэтгэл татам блог нийтлэл бичиж байгаа эсэхээс үл хамааран Рик хамгийн сайн ажлыг хүргэж, бусдад дизайны зорилгодоо хүрэхэд нь туслахыг үргэлж хичээдэг.