Thiết kế ứng dụng IOS, Android theo chuẩn MATERIAL DESIGN bằng Photoshop

Thiết kế ứng dụng IOS, Android theo chuẩn Material design bằng photoshop của giảng viên Nguyễn Đức Việt sẽ giúp bạn có những thiết kế ứng dụng hay thiết kế web mới, đẹp và bắt mắt hơn.
Giảng viên: Nguyễn Đức Việt – Giảng viên Thiết kế web tại FPT – Arena

Giới thiệu khóa học

Khóa học áp dụng và so sánh logic giữa các qui tắc thiết kế cổ điển như qui tắc phối màu dựa trên bánh xe màu, qui tắc typography cơ bản .. áp dụng trên nguyên lý thiết kế hiện đại của google thế nào và thực hành trong thiết kế photoshop ra sao.
– Thiết kế ứng dụng và thiết kế web vốn là các thang độ màu, chi tiết khoảng cách, cỡ chữ, căn lề đều rất tương đối, cần một thời gian thiết kế đủ lâu thì mới làm ra một thiết kế chuẩn, tuy nhiên với lý thuyết thiết kế Material Design của google dựa nghiên cứu các nguyên lý thị giác kết hợp các quy tắc đồ họa nền tảng sẽ làm cho các bạn không cần trải qua một khoảng thời gian luyện tập dài nhưng vẫn có thể thiết kế tốt cả về mặt thị giác và sử dụng.
– Tầm quan trọng của việc học chuẩn thiết kế Material Design là giúp cho các bạn có thể ứng dụng các nguyên lý về khoảng cách, thang độ màu, sử dụng size chữ… để tùy biến và tạo ra nguyên mẫu thiết kế UI/UX đẹp và phù hợp với các nhu cầu khác.
– Sau khi học xong khóa có thể biết được thiết kế nào đẹp, là xịn, phân tích được độ chi tiết và độ chuẩn của một thiết kế app hay ứng dụng

Bạn sẽ học được gì

  • Khóa học đầu tiên về chuẩn thiết kế Google Design.
  • Điểm đặc biệt của khóa học là hướng dẫn chi tiết, cho người không có kinh nghiệm thiết kế ứng dụng và web thì vẫn có thể cho ra nhưng thiết kế đẹp và sử dụng thực tế được .
  • Phân tích kĩ và thực hành chi tiết từng bước theo kiểu cầm tay chỉ việc.
  • Đi sâu và phân nhỏ các đối tượng UI để có thiết kế chi tiết và chuẩn hóa theo Material Design

Nội dung khóa học

 Phần 1: GIỚI THIỆU
 Bài 1: Giới thiệu 0:09:48
 Bài 2: Cách học trong khóa học 0:06:25
 Phần 2: CÀI ĐẶT BỘ PHẦN MỀM
 Bài 3: Cài đặt công cụ Adobe CC2018 0:11:26
 Phần 3: NGUYÊN LÝ CƠ BẢN VỀ THIẾT KẾ TYPOGRAPHY
 Bài 4: Lý thuyết về thiết kế chữ 0:03:16
 Bài 5: 13 khái niệm cơ bản về chữ 0:14:33
 Bài 6: Tải font, tìm font, và sử dụng font 0:13:39
 Bài 7: Chọn font cho thiết kế thế nào? 0:05:20
 Bài 8: Các qui tắc kết hợp chữ – phần 1 0:06:50
 Bài 9: Các qui tắc kết hợp chữ – phần 2 0:04:43
 Bài 10: Các lỗi thường gặp khi kết hợp chữ 0:07:00
 Bài 11: Phân loại các phương thức tùy biến chữ cho ấn phẩm thiết kế 0:08:09
 Phần 4: TỔNG KẾT NGUYÊN LÝ TYPOGRAPHY ÁP DỤNG TRONG MATERIAL DESIGN
 Bài 12: Lý thuyết về qui tắc phối màu trong thiết kế 0:20:11
 Bài 13: Tổng kết lý thuyết phần typo 0:04:04
 Bài 14: Tổng kết phần font chữ 0:04:57
 Bài 15: Tổng kết các qui tắc dùng chữ trong Material Design 0:09:37
 Phần 5: NGUYÊN LÝ MÀU CƠ BẢN
 Bài 16: Bánh xe màu là gì 0:08:59
 Bài 17: Thực hành sử dụng bánh xe màu 0:12:58
 Bài 18: Học về màu cơ bản, màu thứ cấp, màu bổ túc qua ví dụ 0:05:48
 Bài 19: Nguyên lý phối màu sử dụng màu tương đồng 0:04:48
 Bài 20: Nguyên lý phối màu đơn sắc 0:03:09
 Bài 21: Định nghĩa về Tone màu 0:05:39
 Bài 22: Tổng kết về các hệ màu và các sử dụng hệ màu trong thiết kế 0:08:35
 Bài 23: Học về tính cách màu qua ví dụ 0:20:43
 Phần 6: NGUYÊN LÝ MÀU ÁP DỤNG TRONG MATERIAL DESIGN
 Bài 24: Giới thiệu hệ thống màu đưa ra bởi google 0:10:09
 Bài 25: Cách pha màu theo Material Design 0:08:11
 Bài 26: Cách chọn màu bằng công cụ của Adobe 0:07:40
 Bài 27: Kiểu phối màu đơn sắc trong Material Design 0:06:54
 Bài 28: Kiểu phối màu Triad trong Material Design 0:05:27
 Bài 29: 6 qui tắc dùng màu trong thiết kế chuẩn – Phần 1 0:06:23
 Bài 30: 6 qui tắc dùng màu trong thiết kế chuẩn – Phần 2 0:08:06
 Bài 31: 6 qui tắc dùng màu trong thiết kế chuẩn – Phần 3 0:07:35
 Bài 32: 6 qui tắc dùng màu trong thiết kế chuẩn – Phần 4 0:07:48
 Bài 33: Tổng kết phần màu 0:06:57
 Phần 7: LÝ THUYẾT VỀ ELEVATION TRONG THIẾT KẾ ỨNG DỤNG
 Bài 34: Giới thiệu nguyên lý về không gian thiết kế của Material Design 0:08:36
 Bài 35: Lý thuyết về không gian thiết kế 0:14:10
 Bài 36: Lý thuyết về Elevation trong thiết kế ứng dụng 0:08:53
 Phần 8: THỰC HÀNH VỀ ELEVATION
 Bài 37: Thực hành Elevation với Photoshop 0:13:02
 Bài 38: Hoàn thiện lý thuyết về phần Elevation của Material Design 0:12:37
 Bài 39: Sơ đồ và bảng thông số chi tiết các đối tượng thiết kế 0:08:11
 Bài 40: Phần tích thiết kế qua ví dụ 0:09:11
 Phần 9: LÝ THUYẾT VỀ LAYOUT VÀ QUY TẮC ĐẶT LAYOUT
 Bài 41: Giới thiệu phần layout 0:07:46
 Bài 42: Các qui tắc trình bày layout 0:08:27
 Phần 10: THỰC HÀNH LAYOUT
 Bài 43: Thực hành setup layout mobile theo thông số của Material Design 0:06:19
 Bài 44: Thực hành setup layout tablet theo thông số của Material Design 0:04:47
 Bài 45: Thực hành setup layout desktop theo thông số của Material Design 0:04:44
 Phần 11: LÝ THUYẾT VỀ BASELINE VÀ KEYLINE
 Bài 46: Khái niệm về đường gióng cơ sở baseline và cách setup trên photoshop 0:05:06
 Bài 47: Thực hành đường gióng cơ sở Baseline 0:04:32
 Bài 48: Lý thuyết và qui tắc về Keyline 0:11:25
 Phần 12: LÝ THUYẾT VỀ INCREMENT – TOUCH SIZE – CLICK TARGET
 Bài 49: Khái niệm và cách sử dụng Increment trong thiết kế 0:03:40
 Bài 50: Lý thuyết về Touch target và Click target 0:08:47
 Phần 13: THIẾT KẾ ĐỐI TƯỢNG UI BUTTON, PHÂN LOẠI BUTTON VÀ PHÂN CẤP THÔNG TIN CỦA BUTTON
 Bài 51: Giới thiệu về UI design dựa trên nguyên lý thiết kế Material 0:08:57
 Bài 52: Thiết kế nút 0:09:28
 Bài 53: Phân loại nút 0:05:54
 Bài 54: Cấu trúc và phân cấp thông tin của các loại nút 0:03:35
 Phần 14: THỰC HÀNH THIẾT KẾ TEXT BUTTON VÀ OUTLINE BUTTON
 Bài 55: Thiết kế text button bằng Photoshop 0:19:21
 Bài 56: Thiết kế outline button bằng Photoshop. 0:12:58
 Phần 15: THIẾT KẾ CONTAINED BUTTON
 Bài 57: Hướng dẫn thiết kế Contained button 0:09:48
 Bài 58: Hướng dẫn thiết kế Contained button kèm icon 0:06:24
 Phần 16: TOGGLE BUTTON VÀ CÁC TÙY BIẾN DỰA TRÊN MATERIAL DESIGN
 Bài 59: Hướng dẫn thiết kế Toggle Button 0:07:36
 Bài 60: Phân tích các trường hợp sử dụng và kết hợp của 4 loại nút trong Material Design 0:05:05
 Bài 61: Thiết kế tuỳ biến dựa trên Material Design 0:06:56
 Phần 17: THIẾT KẾ ĐỐI TƯỢNG UI FLOATING ACTION BUTTON
 Bài 62: Giới thiệu về Floating Action Button dạng tròn 0:05:38
 Bài 63: Giới thiệu về Floating Action Button dạng dài 0:02:56
 Bài 64: Hướng dẫn thiết kế 2 loại Floating Action Button 0:11:52
 Phần 18: GIỚI THIỆU VÀ QUI CHUẨN THIẾT KẾ KHỐI NỘI DUNG – CARD
 Bài 65: Giới thiệu cách thiết kế khối nội dung – Card 0:09:31
 Bài 66: Qui chuẩn thiết kế cho phần nội dung 0:07:41
 Phần 19: THỰC HÀNH THIẾT KẾ KHỐI NỘI DUNG
 Bài 67: Thiết kế khối nội dung phần thực hành 0:12:42
 Bài 68: Hoàn thiện thiết kế khối nội dung 0:07:32
 Bài 69: Thiết kế card mở rộng theo thông số material 0:09:35
 Bài 70: Thiết kế text cho khối nội dung 0:13:01
 Phần 20: GIỚI THIỆU VÀ THỰC HÀNH ĐỐI TƯỢNG UI BANNER
 Bài 71: Hoàn thiện thiết kế khối nội dung 0:16:06
 Bài 72: Giới thiệu banner và cách sử dụng banner 0:03:52
 Bài 73: Bài tập thiết kế banner cơ bản 0:08:51
 Bài 74: Bài tập thiết kế banner loại 3 0:15:13
 Bài 75: Cách thiết kế tuỳ biến dựa trên Material Design 0:04:35
 Phần 21: GIỚI THIỆU VÀ THỰC HÀNH THIẾT KẾ ĐỐI TƯỢNG UI CHIPS
 Bài 76: Giới thiệu các thiết kế thành phần nhập liệu – Chips 0:07:19
 Bài 77: Thiết kế Chips cơ bản 0:09:34
 Bài 78: Chữa bài thiết kế Chips có icon 0:14:11
 Phần 22: GIỚI THIỆU VÀ THIẾT KẾ DIALOG THEO CHUẨN MATERIAL DESIGN
 Bài 79: Giới thiệu về thiết kế dialog 0:06:54
 Bài 80: Thực hành thiết kế dialog theo chuẩn 0:11:04
 Bài 81: Hoàn thiện dialog cho giao diện web 0:12:23
 Phần 23: THIẾT KẾ UI APPBAR
 Bài 82: Giới thiệu đối tượng UI Appbar 0:04:30
 Bài 83: Thiết kế thanh Appbar 0:11:58
 Bài 84: Thực hành thiết kế Appbar 0:09:16
 Bài 85: Tùy biến thanh Appbar 0:02:30
 Phần 24: THIẾT KẾ DANH SÁCH DỮ LIỆU CƠ BẢN
 Bài 86: Giới thiệu cách thiết kế danh sách dữ liệu và các loại danh sách dữ liệu 0:06:07
 Bài 87: Thiết kế danh sách cơ bản 0:17:41
 Phần 25: THỰC HÀNH THIẾT KẾ CÁC LOẠI DANH SÁCH DỮ LIỆU
 Bài 88: Thực hành thiết kế danh sách có ảnh 0:05:20
 Bài 89: Thực hành danh sách 2 dòng 0:04:32
 Bài 90: Danh sách 2 dòng có overline text 0:04:26
 Bài 91: Thiết kế danh sách 3 dòng có avatar 0:13:44
 Phần 26: THIẾT KẾ MENU DROPDOWN
 Bài 92: Thiết kế menu 0:03:01
 Bài 93: Thực hành với menu dropdown 0:10:17
 Phần 27: THIẾT KẾ THANH NAVIGATION DRAWER
 Bài 94: Thiết kế thanh navigation drawer 0:06:37
 Bài 95: Thực hành thiết kế thanh navigation drawer 0:18:43
 Bài 96: Ví dụ về tùy biến menu 0:02:58
 Phần 28: THIẾT KẾ MENU NGANG
 Bài 97: Giới thiệu thành phần UI menu ngang 0:04:00
 Bài 98: Thiết kế menu tab dạng chữ 0:08:37
 Bài 99: Thiết kế menu tab dạng chữ kèm icon 0:06:42
 Phần 29: THIẾT KẾ BỐ CỤC ẢNH
 Bài 100: 4 loại bố cục sắp xếp trong Material Design 0:07:08
 Bài 101: Thiết kế bố cục ảnh chuẩn 0:14:32
 Bài 102: Thiết kế bố cục ảnh dạng free layout 0:09:03
 Bài 103: Thiết kế bố cục ảnh dạng free layout nhịp 2 0:08:22
 Bài 104: Thiết kế bố cục ảnh dạng free layout 6 cột 0:09:44
 Bài 105: Thiết kế bố cục ảnh nhịp 2 0:08:37
 Phần 30: TỔNG KẾT KHÓA HỌC
 Bài 106: Tổng kết khoá 0:04:58

 

Trả lời

Email của bạn sẽ không được hiển thị công khai.