Buổi 1 - Introduction to UI Foundation

Lớp học UIF

Introduction to UI Foundation

Buổi 1

Buổi 1: Introduction to UI Foundation

Buổi 6: Typography (II)

Buổi 2: UI Component

Buổi 7: Color (I)

Buổi 3: Layout & Principle (I)

Buổi 4: Layout & Principle (II)

Buổi 5: Typography (I) Quiz Test

Buổi 8: Color (II)

Buổi 9: Review & Quiz Test Chia sẻ lộ trình phát triển Buổi 10: Practicing Test

1. Làm quen - Lộ trình, mục tiêu khoá học

- Tại sao cần học UI Foundation

- Giới thiệu về UI/UX

2. Bắt đầu như nào?

- Giới thiệu về công cụ - Chức năng cơ bản

- Thực hành

GIỚI THIỆU Mục tiêu

Mục tiêu của khoá học 1. Cung cấp những kiến thức nền tảng quan trọng về bố cục, màu sắc, kiểu chữ, các nguyên tắc (Principle) trong thiết kế giao diện.

2. Nắm chắc kĩ năng sử dụng công cụ để xây dựng giao diện người dụng (UI)

UI & UX Giới thiệu

"

!

UI & UX Mối quan hệ

UX

UI

User Experience (UX) là một thế giới rộng lớn!

UI & UX Công việc

UX Writer UX Designer

/

UI Designer

UX Researcher

UI & UX

UX Designer

Công việc

INPUT

OUTPUT

!

Brief

Low Fidelity Wireframe

UI & UX

UX UI Designer

Công việc

INPUT

OUTPUT

!

Low Fidelity Wireframe

High Fidelity Wireframe Prototype

UX D & UXR

UI D

-

Empathy Mapping

-

Personas

-

Tool

-

Prototyping

-

User Journey Mapping

-

Survey

-

Principles of Design

-

Design System /

-

Mental Models

-

Interview

-

Visual Design

-

Workflow Diagram

-

Usability Testing

-

Color Theory

-

Animation

-

Interaction Design

-

User Testing

-

Typography

-

Psychology

-

Sitemap

-

Storyboard

-

Layout / Grid

-

Icon / Illustration

-

Information Architect

-

A/B Testing

-

Low Fidelity Wireframe

-

Paper Prototype

-

Accessibility, Usability

/

UX Research

Design Guideline

UI Designer -

Tool

-

Prototyping

-

Principles of Design

-

Design System /

-

Visual Design

-

Color Theory

-

Animation

-

Typography

-

Psychology

-

Layout / Grid

-

Icon / Illustration

Design Guideline

UX Research

BẮT ĐẦU NHƯ NÀO? Giới thiệu

Bắt đầu với thiết kế theo mẫu - Tập quan sát - Tập làm quen - Tập triển khai thiết kế - Tập tính tỉ mỉ

BẮT ĐẦU NHƯ NÀO? Công cụ

BẮT ĐẦU NHƯ NÀO? Công cụ

Figma 16

- Gói Starter miễn phí

- Hỗ trợ Prototype, Plugin

- Hỗ trợ cả Mac và Window

- Hỗ trợ Preview trên mobile

- Làm việc online, teamwork tốt

- Cập nhật thường xuyên với những thay đổi đáng giá.

CHIA SẺ Những điều thú vị

Sử dụng tài liệu Tham khảo

hay

“Ăn cắp”

CHIA SẺ Những điều thú vị

Một nhà thiết kế làm công việc sao chép (copywork) cũng hấp thụ những lựa chọn tinh tế nhất từ các thiết kế mà họ tham khảo.

Erik Kennedy UI/UX Designer

Sao chép như một kỹ thuật học tập.

Khoi Vinh Senior Director of Product Design Adobe

Thường xuyên xem các thiết kế sẽ phát triển tư duy sáng tạo, giúp bạn phân biệt thiết kế tốt với thiết kế chưa tốt.

Sao chép là cấp độ đầu tiên của sáng tạo, dùng cho mục đích học tập và thực hành.

Rick Mess UI/UX Designer

Hoang Nguyen Design Coach GeekUp

CHIA SẺ Những điều thú vị

1. Không lấy trộm cảm hứng ban đầu

2. Đừng sao chép quá nhiều từ các ý tưởng

3. Đừng nhận thứ mình copy là của riêng mình

CHIA SẺ Những điều thú vị

Khác biệt giữa Nghệ thuật Art

và

Thiết kế Design

CHIA SẺ Những điều thú vị

Nghệ thuật Mục đích

Thông điệp

Đánh giá

Khả năng

Thiết kế

Khiến người xem đồng cảm, học được,

Truyền tải một điều gì đã tồn tại từ trước, vì một

truyền cảm hứng

mục đích nhất định

Có thể được diễn giải theo nhiều cách khác nhau

Đánh giá bởi quan điểm, gu thẩm mỹ chủ quan

Một nghệ sĩ thường có khả năng, tài năng thiên phú

Truyền tải thông điệp và thúc đẩy người xem làm một điều gì đó

Hoàn thành được mục đích, được thấu hiểu trọn vẹn và thúc đẩy người ta làm ra hành động mục tiêu

Là một kỹ năng có thể dạy được và học được

CHIA SẺ Những điều thú vị