Tự học thiết kế giao diện UX UI - Bài 1: Giới thiệu khóa học thiết kế UI - UX

  

I/ Trả lời các câu hỏi:

1/ What

-    Các phần mềm sẽ học?

+    adobe Muse CC 2017

+    adobe experience CC 2017

=> biết sử dụng hai phần mềm sau là một lợi thế: adobe photoshop cc 2017 và adobe Illustrator cc 2017.

-    Sẽ được học cái gì?

+    xử lý nguyên liệu thiêt kế

+    xử lý responsive,tương tác, logic,điều hướng ưng dụng tạo website, tạo ứng dụng iphone vơi  adobe Muse CC 2017, adobe experience CC 2017

2/ Why

-    Tại sao phải thiết kê UI/UX?

+    tạo ra một ứng dụng trên điện thoại máy tính như thật mà không phải thật.

+    Mục đich là để test trải nghiệm người dùng UX: xem co tiện hay không, có chỗ nào không ổn, click vào nut này hiển thị cái gì? để nút đăng nhập ở đây có tiện không,..

+    Mục đích thứ hai là để test giao diện người dùng UI: nút next to thế này có được không, cửa sổ bật lên thế này co ổn không.

+     phản hồi và làm việc trực tiếp trên thiết kế tương tác

-    Tại sao phải dùng phần mềm adobe muse và adobe experience mà không phải phần mềm khác?

+    adobe xd chuyên về thiêt kê ứng dụng trên điện thoại, 

+     app cho các điện thoại iphone, cần xử lý nhiều hiệu ứng và điều hướng.

+     adobe xd hỗ trợ sẵn các điều hướng trong nhân của phần mền.

+    adobe muse chuyên thiết kế web responsive.

+    không cần code

+    hỗ trợ tương tác

+    chuyển thẳng từ photoshop sang web có kèm tương tác điều hướng mà không cần code.

+    Tương tác với các phần mềm có sẵn như photoshop và Illustrator ..

3/ How

-    adobe muse: học qua bài tập

-    adobe experience

Giới thiệu kiến thức photoshop cần dùng

1/ Mục đích của khóa học

+    Thiêt kế ui/ux cho ứng dụng di động

+    Thiêt kế ui/ux cho website

+    Thiêt kế tương tác cho người dùng

+    Thiết kế app

+    Thiết kế photoshop Xử lý các đối tượng đồ họa mà trong muse và XD không xử lý được, thiết kế nút, thiết kế effect chi tiết như mặt nạ, đổ bóng, blur, xử lý màu,...Thiết kế banner

Cài đặt công cụ cho khóa học

+    photoshop

liên kết

Key : 1543-1629-9495-4496-3504-3227

+    illustrator

liên kết

+    adobe muse

+    adobe Xd design

Liên kết

1/ Cài đặt công cụ:

+    Link cài đặt

    -    bit.ly/adobecc2017bq

    -    bit.ly/vietnd08cc2017

    -    nêu bắt đăng nhập bằng user pass thì bạn vào adobe.com tạo user free tự đăng nhập

+ Note

    -    đây là bản đã set bản quyền sẵn

    -    có khả năng cập nhật.

Sử dụng photoshop

1/ Phương pháp sử dụng marquee tool và lasso tool

+ Phím tắt cần nhớ:

-    M : marquee

-    shift + M: chuyển đổi các công cụ khác sang marquee tool

-    ctrl + j : tạo layer mới từ vùng chọn đã chọn

-    ctrl + shift + N : Tạo layer mới

2/ Phương pháp sử dụng magnetic lasso 

    + Phím tắt cần nhớ:

-    M :  lasso tool

-    shift + L: chuyển đổi các công cụ khác sang marquee tool

2/ Phương pháp sử dụng quick selection tool và magic wand

+ Phím tắt cần nhớ:

-    W:  quick selection tool và magic wand

-    shift + W: chuyển đổi các công cụ khác sang quick selection tool và magic wand

+    chọn độ tương đồng màu càng cao (thông số tolenrance) lấy màu tương đồng càng chính xác hơn.

+    shift + click để chọn tiếp vùng chọn

+    ctrl + shift + i : đảo ngược vùng chọn.

+     tính năng Contigous cho magic wand: chọn các màu tương đồng bị ngăn cách bởi hình.

3/ Tách layer nâng cao với công cụ renfine edge

+    Chọn công cụ magic wand chọn vùng cần cắt layer

+    chuột phải vào vùng chọn rồi chọn renfine edg và lọc lại khối cần lọc viền.

4/ Tách layer bằng công cụ pentool:

+    Nhược điểm:  mất khá nhiều thời gian

+    Ưu điểm: áp dụng cho mọi tình huống

+    Cách làm và một số phím tắt:

    -    phím alt khi đang vẽ thay đổi tiếp tuyến

    -    phím space khi vẽ thay đổi điểm nút

    -    Ctrl + enter sau khi vẽ xong để tạo vùng chọn