Thứ Tư, 10 tháng 4, 2013

Hướng dẫn cách tạo một banner đơn giản cho website bằng Photoshop

Chào các bạn sangkien , hôm nay mình sẽ hướng dẫn các bạn dùng photoshop để tạo một banner cho forum hoặc website. Trong phạm vi bài viết này mình sẽ lấy ví dụ là banner của forum chúng ta :)
Trên thực tế, photoshop (pts) không có gì phức tạp, nó đơn thuần chỉ là một phần mềm "Cắt","dán","vẽ","đo" hình ảnh dựa trên hệ thống các lớp (layer) và filter(bộ lọc) để tạo ra các hiệu ứng ánh sáng. Nói như thế có nghĩa là banner đẹp hay xấu,chuẩn hay cần chỉnh..lệ thuộc vào sự sáng tạo và óc thẩm mỹ của tác giả là phần lớn, chứ kĩ thuật pts chỉ là một phần hỗ trợ :). Nói nôm na : hồi xưa người ta vẽ tranh trắng đen bằng mực tàu vẫn đẹp hơn khối tranh vẽ bằng máy tính ngày nay nếu không có sự đầu tư nghệ thuật ^^ >> kĩ thuật chỉ mang tính hỗ trợ.
Bài hướng dẫn sẽ gồm 3 phần : 1-Nền
2-Các chi tiết
3-Hiệu ứng màu

Ở phần 1 này mình sẽ hướng dẫn các bạn cách tạo nền và tìm bộ màu phối phù hợp cho các yếu tố của banner ^_^ 

Đầu tiên chúng ta sẽ nhìn qua banner này : 
Posted Image

Như các bạn thấy, banner có các phần nổi bật là "chữ","hình" và bộ phận in chìm phía sau - đó chính là background (nền) mà chúng ta đang muốn đề cập đến. Phần tạo nền của một banner đôi khi rất khó và phức tạp, đôi khi lại khá dễ dàng như trường hợp của chúng ta, vì nền chỉ do một hình ảnh duy nhất ở sau lưng đảm nhiệm :)
Đó là hình này. 
Posted Image

Đương nhiên là hình này muốn tạo ra nó cũng sẽ rất phức tạp và cần một số phần mềm hỗ trợ 3d mà trình độ của mình thú thật là cũng chưa đạt tới nổi haha . Cho nên hình nền này mình dùng google để tìm và sử dụng sau khi đã xin phép bản quyền ( hoặc xóa mất bản quyền ^^ ). Gợi ý cho các bạn muốn tự tìm thấy nó trên google là mình sử dụng từ khóa có từ "background" và một từ nữa có 4 chữ cái,hehehe.
Ở phần 1 này các bước làm sẽ rất đơn giản,chỉ là khởi tạo,cắt và tinh chỉnh kích thước :)
Bước 1 : các bạn mở phần mềm adobe photoshop cs5 
Bước 2 : trong tab menu file, các bạn chọn new
Bước 3 : các bạn chỉnh kích thước của file banner sắp tạo là 1200x300 đơn vị là pixels. Resolution tức là độ phân giải, các bạn để ở 20pixel/cm là ổn,không cần to quá cũng không nên nhỏ quá :). Phần hệ màu (8bit, rgb....) chúng ta sẽ đề cập sau ở những bài hướng dẫn tạo các sản phẩm để in ấn.
Posted Image

Bước 4 :trong menu file, các bạn chọn "open" để mở tấm ảnh nền của chúng ta lên(sau khi đã download về hoặc tạo ra). (bạn nào không hiểu hệ thống đường dẫn tới chỗ lấy file thì mình chịu, phải có một bài hướng dẫn khác )
Posted Image

Bước 5: sau khi mở đc file ảnh nền, các bạn sẽ thấy có 2 tab trên màn hình pts. một tab là ảnh nền,tab còn lại là project banner của chúng ta. các bạn chỉnh qua tab ảnh nền để tiến hành cắt ghép nó vào banner.
Posted Image

Bước 6: Các bạn dùng công cụ regtangular maquee tool để cắt, kéo một hình chữ nhật hết tấm ảnh và bấm tổ hợp phím ctrl+x để cắt.
Posted Image

Bước 7: các bạn quay lại tab banner của chúng ta và bấm ctrl+v để dán tấm ảnh vừa cắt vào. Nếu các bạn thấy nó không vừa (như ảnh) thì tiến hành bước 8, còn nếu đã vừa thì chúc mừng bạn đã xong:))
Posted Image

Bước 8 : trường hợp ảnh nền không vừa thì ta chọn layer chứa ảnh nền trong project banner. Sau đó bấm ctrl+t để chỉnh kích thước lại cho vừa thế là xong ^^
Posted Image
Posted Image
Posted Image

Chúc mừng các bạn đã xong cái nền banner của chúng ta bằng cách ứng dụng khả năng cắt gọt và phẫu thuật thẩm mỹ to - nhỏ tuyệt vời của pts :) ở phần 2 tương đối dài dòng và phức tạp,mình sẽ hướng dẫn các bạn tạo các chi tiết của banner mẫu. Chúc các bạn thành công^^

 

0 nhận xét:

Đăng nhận xét