>

Tạo chữ gấp theo phong cách cổ điển
Thứ 6, 16/12/2011
1337

Hầu hết tất cả mọi người trong chúng ta đều đã có lần cầm một mảnh giấy và gập qua gập lại khi rảnh tay. Bắt nguồn từ cảm hứng đó các chuyên gia đồ họa đã xây dựng nên một cách thiết kế các chữ cái theo phong cách gấp giấy đó trên phần mềm đồ họa. Hãy cùng chúng tôi học hỏi cách thiết kế thú vị này nhé!

THIET-KE-QUANH-CAO

Bước 1: Công tác chuẩn bị bên ngoài trước khi thiết kế

 

Đầu tiên chuẩn bị một mẫu giấy kích thước 8.5” x 11” (inch) và cắt thành những dải băng đều nhau.
 

01 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Và bắt đầu gấp chúng thành chữ cái với góc là 90o. Chữ N thì tôi không đủ giấy nên tạm thời để như vậy.
Và đây là sản phẩm:
 

01 reference Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 2: Bắt đầu tạo sản phẩm thiết kế

Bây giờ chúng ta có một ý tưởng chung về cách gấp giấy, chúng ta sẽ đi vào Photoshop và tạo một tài liệu mới có kích thước 1.200 x 600px (pixel)

Tôi dùng font Futura Bold.

02 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 3: Thêm màu sắc cho thiết kế

Tiếp theo chúng ta thêm màu sắc cho từng ký tự. Thông số màu sắc cho các ký tự:

  • D: #00AEB7 (blue)
  • E: #FF9900 (orange)
  • S: #BA0000 (red)
  • I: #01AD4E (green)
  • G: #FEDE58 (light yellow)
  • N: #FF99AB (pink)

Tất nhiên, chúng ta sẽ thay đổi màu của chữ “INSTRUCT” thành màu nâu (#3B2601).

03 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 4: Thiết kế những đường “Guide” cho ký tự D

Bắt đầu với chữ D, hãy tạo nho1mm mới (Layer > New > Group). và tôi đặt tên nhóm (folder) là “D”.

Tiếp theo tạo Layer mới (Ctrl/Cmd + Shift + N) trong nhóm (folder) “D”.

Tiếp theo chúng ta dùng “Guide” trong Photoshop để định hướng những nét gấp cho ký tự. Tôi muốn có những Guide trên, dưới, trái, phải và bên trong phía bên trái chữ cái D
 

04 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 5: Tạo mẫu thiết kế

Tất cả các mẫu giấy gấp đều có độ rộng bằng nhau. Chúng ta bắt đầu với công cụ Rectangular Marquee Tool (M).

Giữ phím Shift và kéo chuột để tạo vùng chọn hình vuông, hãy tạo một hình vuông bên trái của “D”

Tạo Layer mới (Ctrl/Cmd + Shift + N) và tô (Edit > Fill) màu đen (#000000).

Đảm bảo luôn giống nhau về kích thước, chúng ta sẽ di chuyển khối vuông này bằng công cụ Move (V).

05 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 6: Thiết kế Guide cho ký tự “D”

Bây giờ chúng ta đã có mẫu, kéo khối vuông tới 4 góc và thêm những đường Guide cho giống hình phía dưới.

06 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 7: Thiết kế khung “D”

Bây giờ chúng ta đã định hình xong chữ cái D. Sử dụng Rectangular Marquee Tool (M) tạo vùng chọn theo các guide chúng ta đã thêm, tô cho chúng màu xanh (#00AEB7).

Bây giờ chúng ta có thể cắt những phần dư thừa của ký tự D.

07 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 8: Thiết kế chữ cái “D”

Chúng ta bắt đầu tạo hình chữ cái D, cắt những góc dư thừa như bên phải để tạo nét gấp như mẫu ta đã xếp.

08 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Dùng Polygonal Lasso Tool (L), tạo vùng chọn và cắt góc phía trên.

08 toplasso Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Tương tự thao tác với góc phía dưới
 

08 bottomlasso Tạo Chữ Gấp Theo Phong Cách Cổ Điển

08 outcome Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 9: Thiết kế phần dư

Giống như chữ cái ta đã gấp, chúng ta tạo những nét gấp dư thừa trên sản phẩm.

Dùng Rectangular Marquee Tool (M), Tạo vùng chọn hình chữ nhật phía trên chữ “D”. và tô vùng chọn (Edit > Fill) bằng màu xanh (#00AEB7).


09 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Làm tương tự cho phía dưới và cùng tô với màu xanh (#00AEB7).

09 outcome Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 10: Thiết kế Guide cho ký tự “E”

Chúng ta sẽ tạo bóng và chất liệu cho những thành phần của ký tự sau, Tiếp tục với ký tự bên cạnh. Tạo một nhóm (folder) mới (Layer > New > Group), gọi là “E” và tạo Layer mới (Ctrl/Cmd + Shift + N) trong nhóm (folder) vừa tạo.

Bây giờ chúng ta sẽ sử dụng hình vuông mà ta tạo ra cho “D” để đảm bảo rằng các ký tự có chiều rộng nhất quán.

Từ khi ta tạo ra các Guide cho “D”, phần trên và dưới chữ cái E đã hoàn chỉnh. Nhưng có một vài vấn đề phẫn giữa.

Di chuyển khối vuông và đặt nó ở trung tâm (trong hình). Thêm 2 Guide phía trên và dưới.

Ngoài ra cũng thêm một guide nơi phần giữa của chữ E kết thúc.

10 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 11: Tô màu thiết kế

Chọn Layer mới tạo trong nhóm (folder) “E”. Dùng màu cam (#FF9900) và tô màu xung quanh ký tự E như hình dưới.

11 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 12: Thiết kế khối “E”

Giống bước 8 và 9, chúng ta cắt góc và thêm những phần dư cho chữ cái E như hình dưới đây.

12 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 13: Thiết kế chữ “S”

Tạo nhóm (folder) mới với tên là “S” và một Layer mới trong đó. Chọn vùng chọn xung quanh chữ S và tô cho nó màu đỏ với thông số (#BA0000).


13 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 14: Thiết kế phần thô cho “S”

Sử dụng Rectangular Marquee Tool (M), chọn hai khu vực giữa của “E”, và sau đó nhấn phím Delete để xóa. Điều này sẽ cho chúng ta ba thanh ngang với chiều rộng tương tự như “E”.


14 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Step 15: Tạo khối “S”

Đặt hình vuông lên trên góc trái “S” và thêm một Guide phía tay phải của nó. thao tác tương tự, đặt hình vuông sang góc phải và thêm một guide phía tay trái của nó.

Bây giờ sử dụng Rectangular Marquee Tool (M) để chọn vùng, tô với màu đỏ có thông số #BA0000 giống hình dưới.


15 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 16: Tạo hình “S”

Cắt các góc chữ S như hình dưới đây


16 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Chữ S nhìn có vẻ không được đẹp lắm. Chúng ta sẽ quay lại với nó sau.


Bước
17: Không cần thay đổi ký tự “I”

Tạo một nhóm (folder) tên “I” và một Layer mới trong đó. Tạo vùng chọn giống với chữ cái I và tô cho nó màu xanh là cây có thông số (#01AD4E)


17 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước
18: Tạo khối cơ bản cho ký tự “G”

Tạo nhóm (folder) mới cho “G”, và đương nhiên là phải có một Layer mới (Ctrl/Cmd + Shift + N) trong đó. Giống như S, chúng ta bắt đầu tạo vùng chọn từ trên xuống dướ, từ trái qua phải theo đường viền của ký tự “G”.

Với vùng đã chọn, tô màu vàng với thông số (#FEDE58).

Bây giờ thêm Guide vào phía trong tay trái và phải của ký tự


18 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước
19: Shaping the “G”

Điều này sẽ bắt đầu ra tương tự như “D”. Trước tiên, đưa hình vuông bên trái lên trên cùng và thêm một Guide ở phía bên phải của nó.

Tiếp theo, đặt các hình vuông xuống góc dưới bên phải và đặt một guide bên trái. Tạo vùng chọn mà các guide đã tạo bên trong, và sau đó xóa nó đi.


19 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 20: Hoàn tất việc tạo khối cho “G”

Để làm kỳ tự chúng ta tạo giống chữ “G”, Sử dụng Rectangular Marquee Tool (M), tạo vùng chọn và xóa bằng phía Delete như hình dưới đây.


20 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 21: Tạo hình cho ký tự “G”

Dùng công cụ Polygonal Lasso Tool (L) để tạo vùng chọn, và dùng phía Delete để xóa giốn như hình dưới đây.

21 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 22: Chỉnh sửa lại độ rộng cho ký tự “G”

CÓ vẻ độ rộng ký tự G không giống như mong muốn. Để sửa nó, dùng Rectangular Marquee Tool (M) tạo một vùng chọn như hình dưới

22 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Với vùng đã chọn, dùng Move Tool (V), giữ nguyên phím Shift, và di chuyển vùng chọn sang trái.


22 moveg Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 23: Tạo khối cơ bản cho ký tự “N”

Tạo nhóm (folder) mới tên là “N” và một Layer mới nằm trong đó. Tạo một vùng chọn xung quanh N và tô nó màu hồng có thông số (#FF99AB).

Di chuyển hình vuông với Move Tool (V), đặt nó ở góc trên bên trái của ký tự. Thêm một Guide vào phía bên trái và bên phải.

Di chuyển hình vuông với góc trên bên phải, thêm Guide bên trái và bên phải.

Bây giờ chọn phần giữa bằng Rectangular Marquee(M) và xóa nó.


23 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 24: Tạo thanh bắc ngang cho ký tự N

Sử dụng Rectangular Marquee Tool (M) một lần nữa, chúng ta sẽ tạo ra một vùng chọn xung quanh thân bên phải của “N” và lặp lại việc lựa chọn vào một layer mới bằng cách nhấn Ctrl / Cmd + J.

Nhân đôi và sau đó sử dụng lệnh Free Transform (Ctrl / Cmd + T) để xoay cho giống hình dưới đây.

24 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Chọn phần phía trên của thanh ngang và dùng công cụ Rectangular Marquee Tool (M) và xóa nó đi.


24 cropn Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 25: Hoàn tất chữ cái “N”

Nếu bạn nhìn vào thực tế vào nét gấp chữ “N” trong bức ảnh tham khảo, bạn sẽ nhận thấy rằng những nếp gấp ở trên cùng và dưới cùng là không hoàn toàn nằm ngang. Chúng ta sẽ tạo ra những góc như vậy bằng cách di chuyển hình vuông lên góc bên trái trên cùng.

Sử dụng lệnh Free Transform (Ctrl / Cmd + T) và sau đó thêm một Guide ngay chính giữa. Những gì chúng tôi đang làm là thêm một guide tại điểm giữa của hình vuông. Thao tác tương tự cho góc phải bên dưới.

Với Polygonal Lasso Tool (L), xóa các góc như hình dưới

25 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 26: Xóa Layer Text

Bạn có cái gì đó trông khá lộn xộn. Hãy dọn sạch bằng cách xoá bỏ các yếu tố phụ chúng ta không cần.


26 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 27: Tạo một nhóm (folder) phía trên “D”

Bây giờ chúng tôi có thể bắt đầu tạo ra những nếp gấp cho chữ “D”. Để tạo ra những nếp gấp, chúng ta sẽ sử dụng các Guide và dùng mô hình để tham khảo.

27 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Có 2 mảnh nằm ngang phía trên “D”. do đó, có bóng đỏ vào 2 mảng chiều dọc.

Để tạo bóng, chọn khu vực ở giữa với Rectangular Marquee Tool (M). Sử dụng Công cụ Gradient (G) có thông số màu từ đen đến trong suốt.

Thử nghiệm nhiều lần đến khi thấy vừa ý. Nếu bạn không thích các gradient bạn đã thực hiện, chỉ cần nhấn Ctrl / Cmd + Z để hủy bỏ nó, và sau đó thử lại.

Để xóa gradient thừa, Ctrl / Cmd + click vào layer “” D, vào Select > Inverse (Shift + Ctrl / Cmd + I) để đảo ngược lựa chọn của bạn, và nhấn phím Delete để xóa.


27 shadow Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 28: tạo nét gấp cho “E”

Với chữ cái E, chúng ta cần phải tạo 3 phần bóng đỏ như hình dưới.

28 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 29: tạo nét gấp cho “S”

Với “S”, phần cong luôn nằm trên đầu, tất cả phần còn lại sẽ bị bóng mờ.

29 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 30: Không làm nếp gấp với “I”

30 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 31: Tạo nét gấp với “G”

Với “G”, Có 2 đường dọc 2 bên là nằm bên trên, Vì vậy sẽ tạo bóng cho mảng nằm ngang.

31 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 32: Tạo nét gấp cho “N”

Với “N”, thân trái nằm dưới thanh ngang và thanh ngang sẽ nằm dưới thân phải.

32 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 33: Thay đổi chế độ hòa trộn của bóng

Bây giờ chúng tôi đang đi để thay đổi chế độ hoà trộn của tất cả các Layer. Chỉnh thuộc tính Blending mode của tất cả Layer bóng thành Overlay, ngoại trừ nếp gấp phía bên phải của N là có blending mode là Soft Light.

33 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Bước 34: Thay đổi bề mặt

Các nếp gấp trông khá tốt, nhưng chúng ta muốn có sự khác biệt về bề mặt trước và sau của tờ giấy để tạo cho các ký tự có chiều sâu.

Chọn các mảng gấp bằng Rectangular Marquee với Tool (M) và mở Hue / Saturation image adjustment command (Ctrl / Cmd + U).

Lưu ý: Để chọn được nhiều vùng chọn rời rạc, bạn giữ phím Shift và tạo các vùng cần chọn.

34 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Thay đổi Saturation đến -40 và Lightness đến +20. Chúng ta đang sử dụng tùy chọn Lightness trong Hue / Saturation, vì nó chỉ làm màu sắc thay đổi nhẹ.

34 saturation Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 35: Thay đổ bề mặt phần còn lại của ký tự

Áp dụng Hue/Saturation trong Step 34 cho các phần còn lại của ký tự.

35 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 36: Thêm Satin

Click vào layer “” D và vào Layer> Layer Style> Satin. Điều này sẽ làm cho các ký tự sáng lên đổi chút và tạo sữ nổi bật cho khu vực ở giữa của ký tự.

Áp dụng kỹ thuật này cho phần còn lại của các ký tự. Có cách làm nhanh là click chuột phải vào layer “” D, chọn Copy Layer Style, chọn các Layer khác, nhấp chuột phải vào chúng, và sau đó chọn Paste Layer Style từ menu xuất hiện.

36 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 37: Thên Gradient Map

Chúng ta sẽ thêm một số hiệu ứng cho văn bản và hình ảnh của chúng tôi. Trước hết, chúng ta sẽ đi đến Layer> New Adjustment Layer> Gradient Map.

37 Tạo Chữ Gấp Theo Phong Cách Cổ Điển

Nhấp vào gradient vàng và đỏ đã được cài sẵn và chọn tùy chọn Reverse.

Giảm opacity của layer Gradient Map xuống khoảng 15%. Điều này thực hiện ở Layer trên cùng. Bây giờ làm cho các ký tự có ánh lên một màu vàng nhạt.

37 outcome Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 38: Thêm Hue/Saturation adjustment vào layer

Chúng ta cũng sẽ giảm độ sáng. Vào Layer > New Adjustment Layer > Hue/Saturation.

38 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


38 outcome Tạo Chữ Gấp Theo Phong Cách Cổ Điển


B 39: Tạo cho văn bản một hiệu ứng không đồng đều

Bây giờ sẽ cung cấp cho văn bản của chúng ta một cái nhìn tự nhiên. Trước tiên, hãy chắc chắn rằng foreground và background là màu đen và trắng (nhấn D để thiết lập lại màu sắc của bạn).

Tạo một lớp mới bằng cách nhấn Ctrl / Cmd + Shift + N, sau đó vào Filter> Render> Clouds. Hãy chắc chắn rằng layer này nằm dưới Gradient Map và the Hue Saturation layer. Đặt tên Layer là: grunge texture

39 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Thay đổi blend mode của Layer mới này thành Overlay và giảm Opacity xuống còn 50%.


39 outcome Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Step 40: Thêm chất liệu cho nền

Mở chất liệu giấy và đưa vào trong Photoshop

Ngoài ra, hãy sử dụng chất liệu giấy của chính bạn, hoặc xem thêm ở Freebies section.

Vào Image > Image Rotation > 90o CCW.

Vào Image > Image Size và thay đổi width thành 1200px để làm chất liệu giống với tấm bạt.

Với chất liệu giấy vừa làm được, copy và paste và chắc nó nằm phía dưới Layer “grunge texture”, đặt tên là paper texture 1

Thay đổi blend mode của Layer “paper texture” thành Overlay và sau đó mở Levels image adjustment dialog window (Ctrl/Cmd + L). Thay đởi những lựa chọn trong đó cho đến khi bạn thấy giống hình bên dưới.


40 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 41: Điểu chỉnh chất liệu

Mở Hue/Saturation (Ctrl+u) và giảm Saturation xuống -40. Giảm opacity của Layer này xuống khoảng 50%.

41 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 42: Thêm chất liệu thứ 2

Nhân đôi layer “paper texture” bằng Ctrl/Cmd + J và di chuyển nó nằm dưới các ký tự.

Thay đổi blend mode thành Multiply và giảm opacity xuống còn 20%.

 

42 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 43: Thêm hình minh họa

Đối với hiệu quả nghệ thuật và đưa mắt nhìn của người xem về phía trung tâm các mảnh ghép, chúng ta làm tối các cạnh của tấm bạt, tạo ra một số họa tiết giả. Nhấp vào Rectangular Marquee Tool (M) trên bảng Tools,và trong thanh tùy chọn, thay đổi Feather thành 50px. Click và kéo một vùng chọn xung quanh toàn bộ khung (hoặc nhấn Ctrl / Cmd + A).

Vào Select> ngược và tô màu đen (# 000000).

Thay đổi blending mode của Layer này thành Overlay.

 

43 Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Bước 44: Điều chỉnh chất liệu

Bạn có thể dùng nhiều chất liệu giấy khác.

Tiếp theo, tôi giới thiệu cho các bạn những chất liệu khác để tạo ra những sắc thái khác nhau. Thử các chất liệu khác nhau để tạo ra cái gì đó của riêng bạn.

 

final Tạo Chữ Gấp Theo Phong Cách Cổ Điển


Tổng kết

Trong hướng dẫn này Photoshop, tôi chỉ cho bạn làm thế nào để tạo ra một kiểu chữ giấy gấp thú vị. Trước tiên, chúng tôi tạo ra một mô hình thực của văn bản, mà tôi hy vọng cho bạn thấy giá trị của việc có một tài liệu tham khảo trước khi bắt đầu công việc.

Chúng tôi sử dụng các kỹ thuật Photoshop đơn giản như: tạo vùng chọn thủ công bằng cách sử dụng Lasso của Photoshop và các công cụ Marquee. Để thực hiện chính xác hơn và đồng nhất hơn cho các chữ cái, chúng tôi tạo ra một mẫu hình vuông và sử dụng một số lượng lớn các Guide Photoshop. Để hoàn tất việc ghép mảnh, chúng tôi điều chỉnh các thuộc tính của layer để cung cấp cho thiết kế một cái nhìn cổ điển.

 

final Tạo Chữ Gấp Theo Phong Cách Cổ Điển

 

Để thực hiện chức năng này. Bạn vui lòng Đăng nhập nếu đã có tài khoản tại designs.vn

hoặc Đăng ký tài khoản miễn phí.

Bình luận trên Facebook

Bình luận khác (1)

quynh chi (13:04 10/07/2012)

WOA PHỨC TẠP QUÁ TRỜI ƠI

Bình luận trên Designs.vn

Tên của bạn Email của bạn
Lời bình của bạn
Mã hiển thị      Captcha
  • a-design-award
  • pritzker-award