Jumat, 07 April 2017

Cara Menciptakan Desain Icon Favicon Homepage Blog Website Dengan Photoshop

CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP  CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Bilamana teman berkunjung ke salah satu sebuah website atau blog , teman sering melihat desain layout web yang selalu menampilkan sebuah icon favicon homepage blog website yang digambarkan dengan goresan pena home dan desain gambar rumah sebagai logo icon favicon homepage blog website  tersebut. Desain Logo Icon Favicon mempunyai size ukuran kecil biasanya berada di ujung paling kiri

Kali ini admin studiocreativedesain akan menawarkan trik desain cara menciptakan icon favicon homepage blog website dengan photoshop . Admin pada tutorial menciptakan icon favicon homepage ini menggunakan adobe photoshop CS3,  cara menciptakan logo Icon homepage sangat gampang dan sederhana teman dapat dengan cara menggunakan photoshop versi lainnya menyerupai adobe photoshop CS4, CS5, CS6, CS7

Berikut ini yaitu tutorial photoshop  : cara menciptakan icon favicon homepage blog website dengan photoshop

Buka file gres dengan ukuran 217 × 470 px dan 300 dpi.



CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Mulai menciptakan kotak dengan tool rectangle dengan warna kotak hitam dengan parameter dari gambar berikutnya.



CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP



Menggunakan tool rectangle dengan sisi lingkaran tidak tajam , Membuat  kotak  persegi dengan ukuran menyerupai yang ditunjukkan pada gambar berikut



CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Radius-15px
Isi 0% pada lapisan.
Blending Options-Gradient Overlay



CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP
Gradient parameter.




CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Dengan menggunakan tool rectangle yang sama kita akan menciptakan kotak lain dengan warna hitam menyerupai ukuran yang ditunjukkan di bawah.




CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Radius-25px
Isi 0% pada lapisan.
Blending Options-Stroke


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP



Gradient ini parameter.



CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Gunakan tool gradient dan buatlah gambar sebuah lingkaran dengan menggunakn ellipse tool menyerupai itu salah satu dari bawah.


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP


Isi 0% pada lapisan.
Blending Options-Gradient Overlay


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Gradient parameter.


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Dengan menggunakan tool ellipse yang sama kita akan menciptakan lingkaran lain dengan parameter dari gambar berikutnya.


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Isi 0% pada lapisan.
Blending Options-Stroke


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Gradient parameter.
CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP


pilih pen tool / path tool untuk menciptakan setengah lingkarn dengan ukuran dari langkah berikutnya.


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Isi 0% pada lapisan.
Blending Options-Gradient Overlay

CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP



Gradient parameter.


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Pilih line tool pada tool kafe photoshop , dan mulailah menggambar siluet rumah dengan warna kontur putih menyerupai itu memperlihatkan langkah berikutnya.


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP

Merge layer keduanya yang mengandung siluet rumah dengan masing-masing icon berbeda yang telah kita buat tadi yaitu icon kotak dengan latar warna hitam dan icon lingkaran dengan warna dasar hijau.  
Hasil simpulan menyerupai gambar berikut


CARA MEMBUAT ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP CARA MEMBUAT DESAIN ICON FAVICON HOMEPAGE BLOG WEBSITE DENGAN PHOTOSHOP


Demikian
tutorial photoshop  : cara menciptakan icon favicon homepage blog website dengan photoshop
Selamat mencoba!! 



related post





Sumber http://studiocreativedesain.blogspot.com


EmoticonEmoticon

:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:o
:>)
(o)
:p
:-?
(p)
:-s
8-)
:-t
:-b
b-(
(y)
x-)
(h)