Hãy đăng ký thành viên để có thể dễ dàng trao đổi, giao lưu và chia sẻ về kiến thức đồ họa.
  1. Hãy đăng ký subscribe kênh Youtube mới của Việt Designer tại địa chỉ: Youtube.com/VietDesignerChannel để theo dõi các video về thiết kế đồ họa. Do trước đó kênh cũ bị Youtube quét không rõ lý do, trong thời gian chờ kháng cáo nếu các bạn thấy video trên diễn đàn bị die không xem được thì có thể vào kênh mới để tìm xem video sơ cua nhé.
    Loại bỏ thông báo

[Chia sẻ] Tối ưu công việc cho web designer - phần 2

Chủ đề thuộc danh mục 'Thủ thuật - Kinh nghiệm về web' được đăng bởi Silent, 16/3/14.

Lượt xem: 3,750

  1. Silent Thành viên cấp 0

    Do mình sơ suất quên mất phần export của Photoshop (Ps) luôn >> mình tạm thời dời phần giới thiệu tool lại 1 chút nhé.

    +Bonus: Xuất hình

    Nếu như ở các phiên bản Ps trc đây mình thường dùng Slice tool (C)

    [​IMG]

    Đặc điểm của tool này nhiều người tưởng kéo thành ô rồi dùng tiếp tool Crop tool để cắt :lmao:. Thực chất tool này phải sử dụng cùng với chế độ Save for web… (Alt + Ctrl + Shift + S) thì mới phát huy tác dụng. Thì hiệu quả của nó là giúp bạn xuất ra tất cả các thành phần được khoanh vùng bởi Slice trong 1 lần xuất duy nhất.

    Ví dụ, mình có file psd như sau, đã dùng Slice khoanh vùng:

    [​IMG]

    Tiếp tục dùng Slice Select Tool (C) nhấp vào các con số xanh 03, 05, 10 (nhấp nhẹ thôi) ở các vùng khoanh nhập tên vào phần name, đây là tên của thành phần sau khi xuất ra.

    Mặc dù có slice background type cơ mà nếu bạn ko tắt layer background thì xuất ra là png, gif để transparent nó cũng ko hề transparent đâu : sosad:.

    [​IMG]

    Kích hoạt Save for web… (Alt + Ctrl + Shift + S)

    [​IMG]

    Ở đây, bạn bấm từng khu vực đã khoanh vùng rồi thiết lập thông số xuất ra. Sau khi xuất ra (nên để chế độ là Images only). Thì toàn bộ file sẽ nằm trong folder tên images

    [​IMG]


    Bạn có thể thấy ngoài 3 khu vực đc khoanh vùng và đặt tên ban đầu thì tất cả các phân vùng rác khác nó cũng xuất luôn xD. Chưa kể vì mình ko tắt layer background nên file hình Pol.gif dù check transparent nhưng nó có nền trắng :lol:

    Do đó mình đã bỏ cách này từ khá lâu rồi :v. Còn 1 cách khác khá hay là File>Script> Export layer to files…

    [​IMG]

    Thì nó sẽ xuất toàn bộ các layer trong file psd ra thành các file hình, định dạng theo các bạn thiết lập, có trong suốt luôn.

    [​IMG]

    Thằng này vì chỉ là 1 đoạn script do đó rất ngu, xuất cả text và các layer có thiết lập Blending option. Ví như mình thiết lập shadow cho cái hình tam giác thì nó sẽ ko tài nào xuất đc (nó cho thành thư mục images đó). Và nó chỉ xuất đc mỗi lần 1 loại định dạng. Cách đặt tên cho file thì quá tệ.


    Do đó ở Ps CC đã cung cấp cho chúng ta 1 chế độ cực kì hay. Có thể làm tới đâu xuất đến đó, ko cần bấm xuất hay gì nữa. Nó nằm ở File>Generate>Image Assets

    Chỉ cần kích hoạt, và thay đổi tên layer là nó sẽ tạo ra 1 thưc mục cùng chỗ với file psd và xuất file hình đó ra. Xuất đc cả group chứ đừng nói là layer.

    [​IMG]

    Nó thiết lập đc cả thông số xuất ra, dù hơi hạn chế 1 chút. Chi tiết: http://helpx.adobe.com/photoshop/using/generate-assets-layers.html


    +Bonus: Tô màu nhanh

    Cách tô màu bất cứ layer nào dù là text hay shape, image… đó là tổ hợp phím Alt + Backspace (là nút thường dùng để xóa kí tự đứng phía trước ấy). Nó sẽ tô với màu nào thì các thím tự mò nha :brick:


    +Bonus: Paragraph Style

    Phần này mình ko tính nhét vào vì mình ko hay xài cho ui design lắm, chỉ xài khi edit truyện là nhiều thôi. Cơ mà có ng nhắc nên nhét vào luôn.

    [​IMG]

    Cái tool này có tác dụng là lưu trữ lại các thiết lập của các đoạn text. Ví dụ mình setting như sau:

    [​IMG]

    Thì khi mình tô đen hoặc chọn 1 layer text nào đó và áp chế vào lập tức toàn bộ sẽ chạy theo setting này. Và một khi mình thay đổi thiết lập của 1 paragraph style và lưu lại thì toàn bộ các đoạn text ảnh hưởng bởi nó cũng sẽ thay đổi theo.

    À mà khuyên các bạn nào xài máy ko đc mạnh thì nhớ tắt chế độ preview đi nhé :)

    ...
    banbaonylongGooner Designer thích bài viết này.
  2. banbaonylong

    banbaonylong Ko phải assmin

    Comic Sans có bản wuyền ko mà xài :3
  3. canhlee

    canhlee Thành viên cấp 1

    thanks bợn

Ủng hộ diễn đàn