Paano Gumawa Ng Isang Website Sa Photoshop

Talaan ng mga Nilalaman:

Paano Gumawa Ng Isang Website Sa Photoshop
Paano Gumawa Ng Isang Website Sa Photoshop

Video: Paano Gumawa Ng Isang Website Sa Photoshop

Video: Paano Gumawa Ng Isang Website Sa Photoshop
Video: Adobe Photoshop : Basic Editing Tutorial for beginners TAGALOG 2024, Nobyembre
Anonim

Sa Photoshop, maaari kang gumawa ng isang layout ng website, alinsunod sa kung saan nalikha na ito sa html. Ang prosesong ito ay medyo simple.

Paano gumawa ng isang website sa Photoshop
Paano gumawa ng isang website sa Photoshop

Kailangan

Programa ng Adobe Photoshop

Panuto

Hakbang 1

Buksan ang Photoshop at lumikha ng isang 1020 x 1200 pic na dokumento dito. Itakda ang kulay ng background sa # a8a995. Kung ang site ay nakatuon sa isang kumpanya, pagkatapos ay maaari mong ilagay ang logo nito sa kaliwang itaas sa kaliwang bar. Mag-iwan ng ilang puwang sa kanan para sa mga link upang mag-navigate sa site.

Hakbang 2

Kunin ang Rectangle Tool at lumikha ng isang 80 by 54 na larawan na rektanggulo sa site bar ng nabigasyon. Ipapahiwatig nito ang aktibong menu item sa pag-navigate sa site.

Hakbang 3

Pumunta sa menu ng Estilo ng Layer-Layer, lagyan ng check ang checkbox ng Color Overlay, kulay # ADAE9E, Opacity - 100%, at ang checkbox ng Stroke, Laki - 1 px, Posisyon - Sa Labas, Opacity - 100%, kulay # CED0BB.

Hakbang 4

Sa tuktok ng rektanggulo na mayroon ka, magdagdag ng isa pang 71x50 na larawan, pinturahan ito ng # cfbe28. Pumunta sa menu ng Estilo ng Layer-Layer, itakda ang mga sumusunod na parameter para sa rektanggulo na ito: Drope Shadow: Blend Mode - Multiply, color # 000000, Opacity - 27%, Angle - 90, Distance - 1, Spread - 0, Size - 5; Inner Shadow: Blend Mode - Maramihang, kulay # 000000, Opacity - 27%, Angle - 90, Distansya - 1, Nasakal - 0, Laki - 18; Stroke: Laki - 1, Posisyon - Sa Labas, Opacity - 100, Uri ng Punan - Kulay, Kulay # D6C72C.

Hakbang 5

Magdagdag ng anino para sa mga link na matatagpuan sa bar ng nabigasyon. Upang magawa ito, piliin ang layer na may teksto ng mga link na ito, pumunta sa menu ng Estilo ng Layer-Layer at itakda ang mga sumusunod na parameter: Drope Shadow: Blend Mode - Maramihang, kulay # 000000, Opacity - 75%, Angle - 90, Distansya - 1, Ikalat - 0, Laki - 1. Ulitin ang mga hakbang na ito para sa bawat layer na naglalaman ng teksto ng mga link.

Hakbang 6

Ngayon kailangan mong gumawa ng isang pambungad na bahagi ng template. Piliin ang Rectangle Tool at gumawa ng isang rektanggulo sa ilalim ng logo, punan ito ng puti, bawasan ang opacity sa 20%.

Hakbang 7

Piliin ang Ellipse Tool at gumawa ng isang hugis-itlog sa ilalim ng rektanggulo na ito. Pumunta sa Filter> Blur> Gaussian Blur at itakda ang Radius sa 7, 8.

Hakbang 8

Kunin ang Rectangular Marque Tool at piliin ang ibabang bahagi ng rektanggulo at ang blurred oval. Tanggalin ito

Hakbang 9

Pagkatapos nito, ipasok ang teksto sa pindutan ng rektanggulo. Lumikha ng isang linya nang direkta sa itaas nito gamit ang mga sumusunod na parameter: 866 by 1 pic.

Inirerekumendang: