Giao diện thân thiện với người dùng, đồ họa được vẽ đẹp, sự sắp xếp chính xác của các thành phần trên trang - một nửa thành công của trang web với khách truy cập. Vẽ các nút cho một trang web là một phần nhỏ nhưng quan trọng khi làm việc trên một dự án trực tuyến.
Hướng dẫn
Bước 1
Hãy thử vẽ một nút tròn. Phương pháp đưa ra dưới đây cũng phổ biến để tạo biểu trưng và hình đại diện. Vẽ nó không phải là khó khăn, mặc dù số lượng các hành động mà bạn phải thực hiện.
Bước 2
Mở Adobe Photoshop. Tạo tài liệu mới bằng cách nhấn tổ hợp "Ctrl + N". Thông số ảnh 300 * 300, độ phân giải 72 ppi. Nền và chế độ màu mặc định tương ứng là trắng và RGB.
Bước 3
Tốt nhất là vẽ bằng vectơ, để khi giảm nút, chất lượng của nó không bị xấu đi. Chọn công cụ Oval, giữ phím Shift và vẽ một vòng tròn từ tâm.
Bước 4
Bây giờ áp dụng một số hiệu ứng cho vòng tròn kết quả. Chuyển đến menu "Lớp" - "Kiểu lớp" - "Tùy chọn hòa trộn". Ở đây bạn sẽ cần phải áp dụng một gradient.
Bước 5
Tiếp theo, tại đây, chọn hộp bên cạnh "Dập nổi" để tạo cho nút có độ phồng cần thiết và đặt các thông số sau: kiểu - dập nổi đường viền, phương pháp - cắt mềm, độ sâu - 220%, kích thước - 1 pixel, làm mềm - 5 pixel, góc - 135® không có chiếu sáng toàn cục, chiều cao - 32, chế độ đánh dấu - bình thường với độ mờ 30%, chế độ bóng - nhân với độ mờ 25%
Bước 6
Để tăng âm lượng hơn nữa, tại đây trong các thông số hòa trộn, hãy chọn hộp "Bóng" và đặt các thông số sau: chế độ hòa trộn - phép nhân, độ trong suốt - 40%, góc - 125o bằng cách sử dụng chiếu sáng toàn cục, bù đắp - 5 pixel, kích thước - 20 pixel.
Bước 7
Kết quả của các thao tác đã thực hiện sẽ là một hình ảnh như trong hình.
Bước 8
Bây giờ tạo một layer mới, chọn "Oval" một lần nữa và vẽ một hình tròn với bán kính nhỏ hơn hình dạng đầu tiên. Mở "Blending Options", đánh dấu vào ô bên cạnh "Inner Shadow" và thiết lập các thông số: Blending Mode - Soft Light, Angle - 125o, Offset - 0px, Shrink - 45%, Size - 21px.
Bước 9
Tiếp theo, tại đây trong các tùy chọn hòa trộn, bạn đánh dấu chọn vào "Gradient overlay" và tạo một gradient với các thông số như trong hình. Bấm OK
Bước 10
Tiếp theo, đặt Blending Style thành Radial, Scale thành 124%
Bước 11
Bây giờ đánh dấu vào hộp "Stroke" và thiết lập các thông số sau: kích thước - 5 pixel, vị trí - bên ngoài, chế độ hòa trộn - bình thường, độ mờ - 100%, loại nét - gradient.
Bước 12
Kết quả của những hành động này, bạn sẽ nhận được một cái gì đó trông giống một nút hơn. Bạn có thể mở lại các tùy chọn hòa trộn và thử nghiệm với chúng.
Bước 13
Bây giờ chúng ta cần thêm các nút nổi bật để nút có kết cấu thủy tinh. Để thực hiện việc này, hãy tạo lại một lớp mới, chọn công cụ Oval Selection, tạo một hình bầu dục phía trên nút và tô màu trắng bằng công cụ Fill. Giữ Ctrl, nhấp vào lớp có vòng tròn màu, đảo ngược vùng chọn ("Lựa chọn" - "Đảo ngược"). Bây giờ nhấn Delete. Hình bầu dục nên được cắt xung quanh chu vi của hình tròn.
Bước 14
Trong bảng Layers, thay đổi tùy chọn Normal thành Soft Light, sau đó nhấp vào biểu tượng mặt nạ vector và chọn công cụ Fill Tool - Gradient. Tô điểm đánh dấu từ dưới lên trên. Nút gần như đã sẵn sàng.
Bước 15
Bạn có thể thêm một dòng chữ vào nút. Bạn cũng có thể áp dụng các hiệu ứng pha trộn cho nó, chẳng hạn như ánh sáng bên trong, bên ngoài, gradient, v.v. Đừng ngại thử nghiệm, bạn càng sử dụng nhiều trí tưởng tượng trong công việc, bạn sẽ càng nhanh chóng thành thạo cả bản thân trình chỉnh sửa và thiết kế web.
