Dùng dải ruybang trong thiết kế web đang là một xu hướng mới giúp webstie trở nên “dịu dàng” và bắt mắt hơn. Bạn có thể sử dụng nó để làm menu, chứa các thanh tiêu đề hay nhấn mạnh một bản tin cần thiết nào đấy…
Ở bài hướng dẫn trước mình đã chỉ các bạn cách tạo đèn chiếu sáng thì hôm nay ruybang sẽ là hướng dẫn tiếp theo. Nào, chúng ta cùng làm nhé.
Bước 1: Tạo một tài liệu mới với kích thước 600 x 600px, đặt tên là “Ribbon“.
Bước 2: Tạo layer mới với tên gọi là “Backgroun texture“. Tô nó với màu #cccccc. Tiếp tục, vào menu Filter > Noise > Add noise và thiết lập các thông số:
Amount: 10%
Distribution: Gaussian
Monochromatic: Checked
Và cho nó Opacity là: 15%.
Bước 3: Dùng công cụ Rouded Rectangle tool…vẽ một hình chữ nhật với kích thước 300 x 200px, đặt nó nằm giữa trang giấy và tạo layermask cho nó, đặt tên layer là “Clipping mask“.
Bước 4: Thiết lập một số hiệu ứng cho nó như:
Drop shadow:
Bevel and Emboss:
Stroke:
Bước 5: Tiếp theo, bạn sử dụng bất kỳ kỳ hình nào mình thích đặt giữa trang giấy, đặt nó nằm trên layer “clipping mask” và vào menu layer > Create clipping mask.
Bước 6: Bây giờ, để tạo ra ruybang trên quấn trên tấm ảnh bạn dùng Rectangle tool và vẽ một hình chữ nhật với kích thước tùy ý (như hình) và sử dụng phím Ctral + T quay một góc 35 độ và đặt nó như hình dưới. Đặt tên cho layer này là “Ribbon“.
Bước 7:
– Giữ phím Ctrl + click vào vector mask của layer “Clipping mask”. Điều này sẽ tạo ra một vùng chọn xung quanh mặt nạ clipping.
– Để vùng chọn vượt ra khỏi ranh giới của nó một ít, bạn vào Select > Modify > Expand và gõ vào thông số là 4px.
Bước tiếp theo, bạn chọn layer “Ribbon” và tạo layer mask cho nó bằng cách click vào button “Add layer mask” ở dưới hay vào Layer > Layer Mask > Reveal Selection.
Bước 8: Vẫn tại layer này bạn thiết lập một số hiệu ứng cho nó như:
Drop shadow:
Inner Glow:
Bevel and Emboss:
Gradient Overlay
Stroke:
Sau khi áp dụng hiệu ứng, bạn được kết quả:
Bước 9: Để tạo cảm giác như ruybang của bạn đang cuốn hình ảnh thì bạn làm như sau:
– Tạo một layer mới, đặt tên là “Ribbon Fold”, đặt nó nằm trên layer “Background texuture” và dưới layer “Clipping mask”.
– Thiết lập màu fore là màu tối, bạn có thể dùng màu #240500.
– Sử dụng công cụ brush tool, với kích thước cọ là 9px và thông số hardness là 100%.
Bây giờ sử dụng brush để vẽ một vòng tròn nhỏ trên cả hai của các cạnh đáy. Bởi vì lớp dưới clipping mask, bạn sẽ chỉ nhìn thấy một phần đen tối của brush xung quanh các góc băng chồng lên hình ảnh.
Bước 10: Tiếp tục, chúng ta sẽ đính kèm trên nó một dòng chữ nào đấy.
Bạn sử dụng Text tool và thiết lập các thông số như sau:
– Chunk Five
– 24pt
– 75 letter spacing
– Color #240500
Đặt text này trên layer “Ribbon” và sử dụng phím Ctrl + T quay nó một góc 35 độ như ở bước 6.
Tiếp theo, bạn áp dụng hiệu ứng cho chữ như sau:
Drop shadow:
Inner Glow:
Gradient Overlay:
Hoàn tất, bạn được kết quả thế này.
Bước 11: Để hoàn thiện ruybang của mình, bạn có thể add thêm hiệu ứng đường chỉ chạy ngang ruybang cho đẹp.
Để làm điều đó rất chi là đơn giản, bạn sử dụng công cụ text tool và gõ một loạt các dấu gạch ngang, thay đổi các thông số như sau:
– Chunk Five
– 13pt
– 200 letter spacing
– Color #700404
– Text Layer Opacity: 50%
Đặt nó trên ruybang của bạn và quay nó một góc 35 độ như ở bước 6 và 10
Sau đó, thiết lập thông số Drop shadow như hình
Bước 12: Nhân đôi layer này và di chuyển nó xuống song song với layer chính.
Bước 13: Để loại bỏ các đường chỉ dư thừa bên ngoài sao cho nó chỉ nằm gọn trên ruybang của mình. Bạn chỉ cần tạo cho chúng một layer mask là xong.
Lúc này bạn sẽ được kết quả như ý.
Bây giờ thì chắc bạn đã biết cách tạo ra một dải ruybang đơn giản trong photoshop rùi chứ. Hãy từng bước làm theo hướng dẫn và cũng có thể tự mình thay đổi màu sắc theo sở thích riêng thử xem.
Chúc các bạn thành công nhé.!
photoshop tuts text effect tutorial photoshop huong dan photoshop cs5 tao ruybang trong photoshop create ribbon with photoshop
Tin Tức Liên Quan
Tạo icon RSS bóng bẩy
Trong bài viết này chúng ta sẽ tạo một biểu tượng rss đầy màu sắc và cực kỳ bóng bẩy cho blog của bạn
Tạo chữ màu bạc tỏa sáng bằng photoshop
Trong bài viết này bạn sẽ có thể tự tay làm một hiệu ứng chữ đẹp mắt cho website hay blog của bạn, với chữ màu bạc tỏa sáng cực kỳ đẹp mắt.
Tạo chữ phát sáng nhiều màu sắc
Với hướng dẫn này mình sẽ chỉ các bạn tạo hiệu ứng chữ phát sáng với nhiều màu sắc lấp lánh như hình dưới, chỉ với 5 bước đơn giản thui, nào bắt đầu bạn nhé
Mẹo ghép ảnh cực cool bằng Photoshop
Bài hướng dẫn giúp bạn có được những bức ảnh ghép ấn tượng với thao tác đơn giản
Tự tay làm danh thiếp cực pro bằng Photoshop
Thủ thuật này sẽ giúp bạn thiết kế danh thiếp có giao diện chuyên nghiệp, hiện đại mà không cần phải có quá nhiều kiến thức về đồ họa mà chỉ bằng Photoshop và vài bước thao tác đơn giản
Tạo button đơn giản cho web bằng Photoshop
Trong bài viết này chúng ta sẽ tự tay làm một button đơn giản cho website hay blog của bạn chỉ với vài bước đơn giản
Mẹo tạo chữ kim loại 3D
Chỉ với vài bước đơn giản mình sẽ giúp các bạn tạo logo chữ kim loại hiệu ứng 3D cho website của mình, rất chi là dễ dàng lun, cùng thực hiện theo nhé
Tạo Abstract Wormhole Background
Hôm nay, mình sẽ chỉ các bạn cách sử dụng brush và điều chỉnh các lớp trong photoshop cs5, bạn có thể bạo ra một hình nền trừu tượng
Hiệu ứng chữ băng
Hôm nay, hy vọng rằng những hướng dẫn sau đây sẽ truyền cảm hứng cho bạn để tạo thêm một số hiệu ứng ice cho thiết kế của bạn
