Học thiết kế web theo chuẩn. » Photoshop

Photoshop CS6: Pharagraph & Character Style Panel

NamCam™ — Sun, 02 Sep 2012 04:59:16 +0000

Lâu quá không post tutorials lên izwebz, thỉnh thoảng rảnh rỗi muốn ghi video mà cái “phòng thu” nó lại ồn ào quá nên lại thôi =.=”

Video tutorial này sẽ giúp các bạn hiểu rõ hơn về 2 panel mới trong Photoshop CS6 là Paragraph và Character Style Panel (P&C) cũng như những ứng dụng của chúng

Ps:Còn 1 vấn đề nữa mà lúc ghi tutorial mình quên không nói, đó là P&C được lưu theo mỗi document chứ không như swatch hay brush được lưu cùng photoshop.

Nên khi các bạn đóng file lại thì P&C cũng mất luôn, nếu muốn dùng P&C cho nhiều file khác thì các bạn cần lưu file có chứa P&C lại thành 1 file .psd. Khi tạo file mới, các bạn tìm đến 1 menu nằm ở góc cùng bên phải của hộp thoại P&C, click vào menu này và chọn load….. rồi chọn đến file psd mà các bạn đã lưu là các bạn sẽ có thể sử dụng style ^^

Vertical Scrolling: Photoshop layout

Võ Minh Mẫn — Fri, 27 Jan 2012 12:00:06 +0000

Sau khi đã hoàn thành về series photoshop căn bản thì chúng ta sẽ bước qua những video hướng dẫn mới, với kỹ thuật cao hơn, không chỉ có thiết kế và còn cả lập trình nữa. Thông qua series này, mình sẽ hướng dẫn các bạn làm một website từ đầu tới cuối với phong cách Vertical Scrolling.

Trong bài đầu tiên thì chúng ta sẽ sử dụng photoshop để layout một website giả lập với tên là “Izwebz survey” nhằm khảo sát ý kiến người dùng. Ngoài các thao tác căn bản như đã học trong các bài trước, chúng ta sẽ tìm hiểu thêm về cách tạo texture cho website.
Phía dưới là hình demo website sau khi đã được tao ra với công cụ photoshop.

- Chú ý mã màu: Đỏ:e74c4a; Xanh:30adbf; Background:f7f7ef;

- Tham khảo thêm các cách khác tạo texture: Webdesign.tutsplus.com

Trong bài thứ 2 của series này thì chúng ta sẽ bắt tay vào chuyển từ photoshop sang HTML & CSS. Tuy nhiên, chúng ra sẽ sử dụng HTML5 và CSS3. Cái này mình sẽ nói rõ trong bài tiếp theo.

Giờ thì hãy thưởng thức thôi nào.

Photoshop action

Võ Minh Mẫn — Tue, 30 Aug 2011 13:44:10 +0000

Action rất quan trọng, nó giúp cho chúng ta tiết kiệm thời gian bằng cách lưu lại các hành động có xu hướng lập đi lập lại nhiều lần. Trong bài này mình sẽ hướng dẫn các bạn cách cài action cũng như cách tạo và chỉnh sữa.

Yêu cầu: Các kiến thức của các bài trước như Chỉnh sữa ảnh và blend màu, Smart object.

Basic photoshop: Căn bản về Smart Object

Võ Minh Mẫn — Tue, 10 May 2011 14:00:07 +0000

Smart Object có mặt từ rất sớm, phiên bản PTS CS3, nhờ tính tiện dụng nên nó được kế thừa và phát triển tới phiên bạn CS5. Tuy nhiên, hiện nay vẫn còn ít người hiểu sai lầm hoặc sử dụng nó chưa hết 100%. Trong tutorial này mình sẽ hướng dẫn các bạn hiểu 1 cách thấu đáo về Smart Object.

Định nghĩa:

Smart Object là đối tượng thông minh, nó chứa bên trong nội dung gốc của các layer, hình ảnh, vector. Nó cho phép bạn thực hiện chỉnh sửa không ảnh hưởng tới layer, hình ảnh, vector gốc.

Bạn có thể:

Sử dụng công cụ Transform (scale, rotate, skew, wrap,…) mà không làm mất, ảnh hưởng tới dữ liệu gốc nằm bên trong (hình ảnh, vector, layer).
Sử dụng bộ lộc filter mà ko làm thay đổi ảnh gốc.
Là mặt nạ thông mình ko sử dụng các bộ lộc filler.
Tự động cập nhật cho tất cả các Smart object dùng chung 1 layer ,hình, vector gốc.

Bạn không thể:

Vẽ trực tiếp lên Smart Object mà phải thực hiện trong layer, hình, vector gốc.

Photoshop Basic: Phím tắt, Lens Flare vs Knoll Light Factory

Võ Minh Mẫn — Fri, 04 Feb 2011 00:27:16 +0000

Đây là bài cuối cùng trong series về Photoshop căn bản. Trong bài này mình sẽ nói về shortcut (phím tắt), cách học và dùng phím tắt. Kèm theo đó là 3 e-book về phím tắt do Adobe phát hành tương ứng với các phiên bản CS3, CS4 và CS5. Đồng thời trong bài này mình sẽ nói thêm về filter Lens Flare của PTS và bộ plug-in rất hay về ánh sáng của Red Gaint Software đó là Knoll Light Factory. Trong bài này mình cũng chỉ cho các bạn các cách reflection trong photoshop.

Kết quả sau khi hoàn thành

Kết thúc series về PTS căn bản thì mình hi vọng rằng có thể giúp được ít nhiều cho các bạn trong thao tác của các bài PTS nâng cao như của anh DW và NickB.
Cảm ơn mọi người đã ủng hộ trong thời gian qua!!!

Basic photoshop: Bài 5 – Pen Tool – Phần 2/2

Võ Minh Mẫn — Thu, 27 Jan 2011 15:53:48 +0000

Quy trình thiết kế một icon, logo, banner và ngay cả layout một website thì công đoạn như sau: Ý tưởng > Vẽ ra giấy > Scan > Vẽ lại. Thì thao tác vẽ lại đó người ta sẽ sử dụng công cụ rất quan trọng đó là Pen tool. Trong bài này mình sẽ hướng dẫn các bạn cách sữ dụng pen tool để vẽ lại banner.

Ngoài ra mình sẽ nói 1 tí xíu về cách đưa các object từ bên AI qua PTS để thao tác. Đồng thời mình cũng sẽ nói lại 1 xíu về brush cũng như sẽ giải đáp 1 vài thắc mắc mà các bạn mắc phải.

Trong bài này mình sẽ không gửi file PTS mà chỉ đưa các bạn file hình JPG để các bạn vẽ lại. Kèm theo đó là bộ sưu tập các Vector Mix do mình sưu tầm.

Trong video mình có bảo sẽ chỉ shortcuts (phím tắt) vào cuối video, nhưng mà do thời gian hạn hẹp nên chúng ta sẽ hẹn gặp lại trong tutorial phần 6 của PTS căn bản vậy.

Photoshop Tut – Tạo chiếc lá X-mas

Demon Warlock — Fri, 24 Dec 2010 02:36:39 +0000

Giáng sinh đã đến rất gần rồi, nên chúng ta hãy làm một cái gì đó cho nó có không khí Giáng Sinh một chút. Trong video tutorial này, tôi sẽ hướng dẫn bạn sử dụng Photoshop để tạo ra chiếc lá biểu tượng của giáng sinh.

Trong bài này bạn sẽ học được cách sử dụng Pen Tool (P) công cụ Vector rất mạnh của Photoshop, tùy chỉnh công cụ Brush (B) để tạo ra hiệu ứng mờ dần, và một số cách đánh bóng kiểu aqua phổ biến.

Đây là hình kết quả mà chúng ta sẽ tạo sau khi làm xong video này

Thời lượng: 16:38

Download định dạng .mp4 chất lượng cao: MediaFire

Download file PSD mẫu: PSD mẫu

Dung lượng: 24.22 MB

Basic photoshop: Bài 5 – Chỉnh sửa ảnh – Phần 1/2

Võ Minh Mẫn — Fri, 29 Oct 2010 23:57:33 +0000

Hình ảnh là một phần không thể thiếu của website. Trong các website tin tức thì hầu như hình ảnh đều qua xử lí photoshop. Hình ảnh đẹp, hình có chất lượng, tức bài viết có chất lượng, lôi cuốn người xem. Trong tutorial này, mình sẽ hướng dẫn các bạn làm việc với bộ công cụ phục chế, bộ công cụ về màu sắc và độ sáng cho hình ảnh.

Basic photoshop: Bài 4 – Brush và Mask

Võ Minh Mẫn — Wed, 06 Oct 2010 13:09:48 +0000

Brush và Mask là 2 công cụ với cách sử dụng khá đơn giản, chỉ việc chấm chấm, kéo kéo. Nhưng mà làm sao sử dụng nó một cách hợp lý và cân đối. Trong bài 4 của Series về photoshop căn bản, mình sẽ hướng dẫn cách bạn cách cài thêm, sử dụng 2 công cụ brush và mask. Và đồng thời, trong phần bài tập mình sẽ nói thêm về gradient, vì bài 2 mình chưa nói, do quên hay sao ấy. Mấy bạn thông cảm.

Basic Photoshop: Bài 3 – Text và layer style

Võ Minh Mẫn — Tue, 28 Sep 2010 03:55:45 +0000

Như các bạn đã biết thì text là một phần không thể thiếu của một website. Trong bài 3 của series Photoshop căn bản thì mình sẽ hướng dẫn các bạn cách sử dụng text, paragraph. Đồng thời cũng hướng dẫn các bạn các chức năng cần thiết của layer style chuyên dùng cho việc thiết kế web.

Trong bài này thì mình sẽ hướng dẫn các bạn vẽ lại phần featured của izwebz.com. Để nói rõ hơn về cách bố trí và sử dụng text, cũng như ôn lại bài 1 và 2. Với cách kết hợp thực tế như vậy thì hi vọng là các bạn có thể khá hơn trong việc thiết kế.