Thiết kế tab Web 2.0 bằng Photoshop

Hướng dẫn sau đây cố gắng cung cấp cho bạn ý tưởng làm thế nào để thiết kế menu tab đẹp mắt theo phong cách Photoshop, Web 2.0.

Bước 1

Tạo một khung vẽ mới với nền [#ffffff] màu trắng ở bất kỳ kích thước nào bạn thích, tốt nhất là hình chữ nhật; chúng phù hợp hơn để vẽ các tab. Sau đó chuyển sang Tab kênh (Windows -> Kênh), nhấp Tạo kênh mới phía dưới bên phải.

Bước 2

Trên lớp kênh đã chọn, vẽ hình dạng tương tự với công cụ Đa giác Lasso. Tô nó lên với màu trắng [#ffffff]; bỏ chọn vùng Đa giác (chọn bất kỳ công cụ Marquee nào và nhấn vào màn hình một); cho hình Gaussian Blur với bán kính 6.0px.

Bước 3

CTRL-L để gọi lên Hộp thoại Cấp và đẩy mũi tên trái và phải để gặp mũi tên ở giữa, như hình trên. Điều này sẽ “trơn tru” hình dạng mờ của bạn lên và cung cấp cho bạn một hình dạng góc tròn đẹp.

Bước 4

Trong tab Kênh, Giữ CTRL, bấm vào Hình thu nhỏ kênh của lớp Alpha 1. Hình dạng mới bây giờ sẽ được chọn, chuyển về Tab lớp, Tạo lớp mới và lấp đầy khu vực đã chọn bằng màu đen [# 000000].

Bước 5

Loại bỏ các góc tròn cho bot phía dưới bên trái và dưới cùng bên phải, di chuyển nó về bên trái và đặt nó như minh họa ở trên. Tiếp theo chúng ta sẽ tập trung vào Tab màu đen.

	Giữ CTRL, bấm vào tab Lớp hình thu nhỏ để làm nổi bật toàn bộ hình ảnh tab.
	Với hình ảnh tab vẫn được tô sáng, chọn Công cụ hình chữ nhật Marquee, giữ ALT và vẽ một hình chữ nhật của khu vực chúng tôi muốn xóa.
	Bạn chỉ nên xem phần trên cùng được chọn. Lựa chọn -> Sửa đổi -> Hợp đồng, Hợp đồng bằng 2px và bạn sẽ nhận được một cái gì đó giống như hình ảnh bên trái.
	Tạo một lớp mới, điền vào vùng được tô sáng bằng [#ffffff] màu trắng. Nhấp chuột phải, chọn Tùy chọn trộn sau đó Lớp phủ tốt nghiệp. Thay thế điểm dừng màu [#ffffff] màu trắng bằng màu xám [# 616161]. Tab của bạn sẽ trông giống như hình ảnh bên trái.

Bước 6

Tạo một lớp mới; Lựa chọn Công cụ hình chữ nhật tròn (Bán kính 8px), vẽ một hình chữ nhật và đặt lớp này phía sau lớp tab màu đen. Nhấp chuột phải và chọn Tùy chọn trộn và chèn các cài đặt sau.

Thả bóng

Độ mờ đục: 31%
Khoảng cách: 0px
Lây lan: 0%
Kích thước: 2px

Vát và chạm nổi

Độ sâu: 100%
Kích thước: 0px
Làm mềm: 0px

Lớp phủ tốt nghiệp

Dưới đây là cài đặt Dừng màu.
Màu sắc: #aaaaaa, Vị trí: 0%
Màu: #ffffff, Vị trí 100%

Bước 7

Đặt trong một số văn bản để xem giao diện web 2.0 tổng thể. Tôi đang sử dụng phông chữ Lucida Fax, cỡ chữ 32pt và 25pt. Và tab của bạn đã hoàn tất! Thoải mái chơi xung quanh với sự kết hợp màu sắc của Tab.

Tải về hướng dẫn