Tạo biểu tượng ứng dụng bằng Photoshop trong 20 bước đơn giản

Là nhà thiết kế, chúng tôi biết biểu tượng ứng dụng là gì: một biểu tượng đồ họa nhỏ đại diện cho một chương trình ứng dụng. Chúng tôi cũng biết rằng một biểu tượng thành công sẽ thu hút nhiều người tiêu dùng hơn đến với chính ứng dụng đó.

Trong hướng dẫn này, tôi sẽ sử dụng Photoshop để giải thích cách tạo một biểu tượng ứng dụng thú vị cho ứng dụng trò chơi bi-a. Và phần hay nhất: Tôi sẽ chỉ cho bạn cách tạo ra kết quả ấn tượng trong một khoảng thời gian NGẮN.

Hãy lăn!

1. Tạo một tài liệu mới

Chúng tôi sẽ thiết kế biểu tượng của mình ở 1024 × 1024 pixel nhưng hãy thoải mái thiết kế biểu tượng của bạn ở 256 × 256 hoặc 512 × 512 pixel.

Vì điều này sẽ được sử dụng trên màn hình, chúng tôi phải đặt chế độ màu thành RGB (không phải CMYK) và độ phân giải thành 72 pixel (không phải 300).

2. Vẽ hình dạng thứ nhất trên lớp thứ nhất

Dùng công cụ Rounded Rectangle Tool (U), vẽ một hình rồi tô màu (# b67032).

3. Tạo hiệu ứng gỗ

Tạo hiệu ứng gỗ bằng cách sử dụng “sợi” từ menu bộ lọc (Filter> Render> Fibers), đảm bảo bạn đặt màu nền trước là # b67032 và màu nền là # 72319b.

4. Vẽ hình thứ 2

Một lần nữa, với công cụ Rounded Rectangle Tool (U), vẽ cùng một hình dạng nhưng làm cho nó ngắn hơn hình dạng gỗ đầu tiên (khoảng 6 pixel từ phía dưới).

Sử dụng các hướng dẫn, nếu bạn thấy khó tạo cả hai hình có cùng chiều rộng.

5. Sao chép lớp thứ nhất lên hình dạng thứ hai

Chọn hình dạng (alt + enter), sau đó sao chép lớp đầu tiên lên hình dạng thứ hai (ctrl + c rồi ctrl + v). Vì vậy, bây giờ chúng ta có hai lớp với kết cấu bằng gỗ nhưng ở độ cao khác nhau.

6. Làm cho lớp 1 tối hơn

Sử dụng cài đặt Đường cong (ctrl + m) để làm cho Lớp 1 tối hơn lớp kia.

7. Thêm chiều sâu bằng cách sử dụng cài đặt Layer Style

Nhấp đúp vào Layer 1 trong Layer Palette, sau đó thiết lập cài đặt Layer Style như bên dưới.

Tôi chỉ chọn cài đặt Inner Shadow và Inner Glow.

8. Thêm chiều sâu hơn với công cụ Brush Tool

Thêm chiều sâu cho Lớp 1 bằng cách tô màu tối hơn với Công cụ “Brush” (b).

9. Thêm hiệu ứng Inner Glow cho Layer 2

Chuyển sang Layer 2, chúng ta sẽ bật Inner Glow. Một lần nữa, nhấp đúp vào Layer 2 trong Layer Palette để chuyển đến cài đặt Layer Style.

10. Vẽ hình thứ 3

Tạo một layer mới và sử dụng công cụ Rounded Rectangle Tool và Ellipse Tool để tạo 2 hình dạng mới (xem bên dưới).

11. Sao chép Layer thứ 2 lên Layer thứ 3

Chọn hình dạng (alt + enter) sau đó sao chép Layer 2 (ctrl + c rồi ctrl + v) lên Layer 3. Bước này tương tự như BƯỚC 5 và BƯỚC 6.

Đừng quên làm tối Layer 3 bằng cách điều chỉnh cài đặt Curves (ctrl + m).

12. Nhân đôi lớp 3

Nhân đôi Layer 3 (ctrl + j), tô nó (alt + delete) với màu xanh lục (# 005e20), sau đó di chuyển nó xuống một chút. Chúng tôi sẽ gọi lớp này, Lớp hình dạng màu xanh lá cây.

13. Cắt Layer hình dạng màu xanh lá cây để vừa với Layer 3

Bây giờ chúng ta muốn xóa vùng màu xanh lá cây tiếp xúc bên ngoài Layer 3. Để thực hiện việc này, hãy chọn Layer 3 bằng cách giữ nút ctrl và nhấp vào lớp đó trong Layers Palette. Bạn sẽ thấy một vùng chọn – các đường chấm xung quanh các phần tử – được tạo.

Nhấp lại vào Lớp hình dạng màu xanh lá cây trong Bảng màu xanh lá cây, nhưng đảm bảo rằng lựa chọn bạn đã thực hiện là từ Lớp 3. Sau đó cắt (nhấn xóa) trên Lớp hình dạng màu xanh lá cây.

Hình dạng màu xanh lá cây nên được xếp cùng với Lớp 3.

14. Tạo lỗ trên bàn bi-a

Bây giờ, tạo một hình dạng mới (và lớp) bằng công cụ Ellipse Tool – tô màu đen cho nó.

15. Tạo hiệu ứng Outer Glow cho Layer 3

Quay lại Layer 3 và tạo cho nó hiệu ứng Outer Glow (xem bên dưới).

16. Thêm chiều sâu cho Hình dạng màu xanh lá cây

Tương tự như BƯỚC 8, thêm chiều sâu cho Hình dạng màu xanh lá cây bằng cách thêm màu tối hơn với Công cụ Brush (b).

17. Thêm bộ lọc tiếng ồn

Sau đó thêm “Noise” vào Green Shape Layer (Filter> Noise> Add Noise).

Tôi đã cho nó khoảng 5% Tiếng ồn.

18. Thêm các điểm nổi bật và chi tiết

Đặt một vòng tròn màu đen khác lên trên hình lỗ của bàn bi-a, sau đó đánh dấu lỗ của bàn bi-a phía sau bằng cách sử dụng Công cụ Brush (b). Thêm Bộ lọc tiếng ồn.

19. Vẽ một quả bóng đơn giản

1. Tạo một hình tròn bằng công cụ Elliptical Marquee Tool (m) và tô nó bằng màu trắng.
2. Lấy màu tối hơn (# 9d956e) và chải (b) cạnh của hình ảnh để tạo ra một gradient mềm mại.
3. Sử dụng một bàn chải có đường kính nhỏ hơn và một màu sáng hơn cho điểm nổi bật gradient thứ hai.
4. Tạo điểm nhấn bằng Công cụ Pen (p).
5. Sau đó chải (b) hình dạng đó để tạo cảm giác bóng trên quả bóng.

20. Tạo bóng cho quả bóng

Bươc cuôi! Tạo một vòng tròn màu đen bên dưới quả bóng sau đó tạo cho nó Hiệu ứng Blur (Filter> Blur> Gaussian Blur).

Và đây là kết quả cuối cùng!

Tôi hy vọng bạn thích – cảm ơn vì đã theo dõi và chúc may mắn với thiết kế của riêng bạn! 🙂