Thiết kế Iphone bằng Photoshop [Phần 2]

[solidsnack]

Các bạn có thể xem Phần 1 ở đây:

http://windowsvn.net/forum/showthread.php?t=16536Chúng ta tiếp tục sang Phần 2:

- Đầu tiên bạn kiếm một bức hình, sau đó chỉnh lại kích thước hình còn 213x324 px bằng chọn cách hình muốn chỉnh rồi dùng công cụ Crop Tool (C) cắt ảnh theo kích thước trên:


http://upload.windowsvn.net/files/23/iphone24.png


Dùng công cụ Move Tool (V) kéo thả nó qua hình đang vẽ, vào phía trong chiếc iPhone và canh hình như hình dưới đây.


http://upload.windowsvn.net/files/23/iphone25.png


- Dùng Rectangle Tool (U) vẽ bao quanh hình vừa kéo thả vào và tô màu #323232(layer này nằm dưới layer hình vừa kéo vào) như hình dưới đây:


http://upload.windowsvn.net/files/23/iphone26.png


Bước 7: Tạo thêm 1 layer mới, chọn công cụ Rectangular Marquee Tool (R) vẽ 1 vùng chọn 213 x 64 px và tô màu cho layer này. Giảm fill :0% như hình dưới:


http://upload.windowsvn.net/files/23/iphone27.png

- Click chuột phải vào layer mới này chọn Blending Options:


http://upload.windowsvn.net/files/23/iphone28.png
http://upload.windowsvn.net/files/23/iphone28a.png
http://upload.windowsvn.net/files/23/iphone29a.png
http://upload.windowsvn.net/files/23/iphone29b.png


- Và chúng ta được kết quả như sau:


http://upload.windowsvn.net/files/23/iphone30.png

Bước 8: Nhân đôi layer mà chúng ta mới tạo ở bước trên lên (Ctrl + J), dùng công cụ Move Tool (V) di chuyển nó xuống phía dưới:


http://upload.windowsvn.net/files/23/iphone31.png


Vào Blending Option của layer này 1 lần nữa để thêm


http://upload.windowsvn.net/files/23/iphone50.png


Bước 9: Tạo 1 layer mới, chọn lại công cụ Rounded Rectangle Tool (U) vẽ một hình có kích thước 180 x 35 px, radius :6px đổ màu tùy ý bạn, đề nằm giữa. Click chuột phải vào layer chứa hình mới vẽ đó chọn Blending Options:


http://upload.windowsvn.net/files/23/iphone32.png
http://upload.windowsvn.net/files/23/iphone33.png
http://upload.windowsvn.net/files/23/iphone34a.png
http://upload.windowsvn.net/files/23/iphone34b.png


- Giảm Opacity của layer này xuống còn 80%.

Bước 10: Tạo 1 layer mới. Tiếp tục chọn Rounded Rectangle Rool (U). Vẽ một hình có kích thước 50 x 31px, radius:8px, tô màu tuỳ ý, sau đó điều chỉnh trong hộp thoại Blending Option (như những bước trên chúng ta đã làm).


http://upload.windowsvn.net/files/23/iphone35.png
http://upload.windowsvn.net/files/23/iphone36b.png
http://upload.windowsvn.net/files/23/iphone36.png


Bước 11: Tạo 1 layer mới và chọn công cụ Custom Shape Tool (U)


http://upload.windowsvn.net/files/23/iphone37.png


Chọn hình mũi tên kích thước 25x17px , tô màu #8a8a8a như hình dưới:


http://upload.windowsvn.net/files/23/iphone38.png


Nhấp phải vào layer này & vào Blending Option:


http://upload.windowsvn.net/files/23/iphone39.png


Chọn công cụ Type tool (T), arial, màu trắng, nhập "slide to unlock" . Giảm opacity:25% của layer này.


http://upload.windowsvn.net/files/23/iphone40.png

Bước 12:


Vẽ cột Sóng: dùng công cụ Rectangular Marquee Tool (M), đổ màu trắng,


http://upload.windowsvn.net/files/23/iphone41.png



Vẽ khoá: Dùng công cụ Custom Shape Tool, đổ màu trắng và chọn như sau: (ai thích vẽ theo kiểu này thì vẽ k thì vẽ theo cách của riêng mình cũng đc)


http://upload.windowsvn.net/files/23/iphone42.png


Sau đó ta vào Edit chỉnh như hình sau:


http://upload.windowsvn.net/files/23/iphone43.png
http://upload.windowsvn.net/files/23/iphone44.png


Sau đó dùng Rectangular Marquee Tool (M) vẽ hình vuông kích thước phù hợp với hình vừa vẽ trên, đổ màu trắng, ghép lại sao cho hình vuông nằm trên hình vừa vẽ, ta được hình sau:


http://upload.windowsvn.net/files/23/iphone45.png


Vào Edit / Free Transform chỉnh lại cho vừa với điện thọai (nhớ chọn 2 layer chứa 2 hình này bằng cách nhấp chọn 1 trong 2 layer và giữ phím Ctrl nhấp chọn layer còn lại) --> Merge Layer lại.


Vẽ Pin: Vẽ hình chữ nhật ngoài cùng lớn nhất bằng công cụ Rounded Rectangle Tool (U) kích thước tuỳ ý, radius: 2px.


http://upload.windowsvn.net/files/23/iphone46.png


Vào Blending Option:


http://upload.windowsvn.net/files/23/iphone47.png



Tiếp tục, chọn Rectangular Marquee Tool (M) vẽ 2 hình còn lại như hình dưới:


http://upload.windowsvn.net/files/23/iphone48.png





Sử dụng công cụ Type tool đánh chữ màu trắng nhập giờ tuỳ ý (vd: 11:07) size: tùy ý phông chữ tuỳ ý, thời gian nhập vào giữa và nhớ chừa khoảng trống phía dưới để nhập ngày tháng. Chọn Arial , màu trắng để nhập ngày tháng (vd: Friday, July 24).

Cuối cùng ta có kết quả:

http://upload.windowsvn.net/files/23/iphone49.png

Một số kết quả khác:

http://upload.windowsvn.net/files/23/iphonedep.jpghttp://upload.windowsvn.net/files/23/iphonewfv.jpg

(tut gốc: google search)

[thamtubang]

đẹp nhỉ ;)) nhỏ trong tấm iphone cuối cùng tên gì thế đại ca :">

[dvkndn]

em có cái này độc hơn này :D

File PSD iPhone
http://www.ukimagehost.com/uploads/57dbb3ef3d.jpg

http://rapidshare.com/files/194513236/Kiba.vn_iPhone.rar

:D

cái nút slide anh làm chưa đẹp lắm

[solidsnack]

đẹp nhỉ ;)) nhỏ trong tấm iphone cuối cùng tên gì thế đại ca :">
Trên i-Pro đó bác

Thêm một số Icon iPhone để các bạn có thể thiết kế thêm:nhe:

http://rapidshare.com/files/67911621/iPhone_icons.zip

http://upload.windowsvn.net/files/23/iphone%203G.jpghttp://upload.windowsvn.net/files/23/iphone%20goc.jpg


cái nút slide anh làm chưa đẹp lắm
Thanks cái link của em, icon độc thiệt@-)

[Denvadi]

Tut hay quá =D> còn loại khác không bạn post thêm vài cái thực hành chơi :">

[But]

Hình như cái hình vuông trong nút tròn bên dưới bị lệch lên trên thì phải?

[windowse7ven]

Ảnh hỏng hết!!!!!!!

[beoandlun]

Không load được cái ảnh nào là sao?