Thumbnail
BEST
디자인 UX/UI

[MASTER] 만들면서 배우는 Figma UI Design 대시보드

(4.5)
22개의 수강평 ∙  264명의 수강생

55,000원

지식공유자: 디자인튜터
총 10개 수업 (2시간 32분)
수강기한: 
무제한
수료증: 발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

초급자를 위해 준비한
[UX/UI, 그래픽 디자인] 강의입니다.

피그마를 다룰 줄 알지만, 컴포넌트에 대한 활용이 다소 익숙하지 않은 경우 이 강의가 도움되리라 생각합니다.

✍️
이런 걸
배워요!
피그마를 활용한 완벽한 컴포넌트 관리
피그마를 활용한 프로토타이핑
피그마 오토레이아웃과 카드 컴포넌트 디자인
피그마 컴포넌트와 반응형 컴포넌트 디자인
피그마 공유 기능과 Zeplin 완벽분석 활용

Figma, 컴포넌트 활용까지 완벽하게!

🙆🏻‍♀ Welcome aboard our Figma Class Flight 🙆🏻‍♂

환영합니다 :) 우리 피그마 클래스의 여정은 이제부터 시작입니다.

안녕하세요. 피그마 클래스를 함께할 '연남동이재용'입니다. 유튜브에서 크리에이터로 활동하고 있고, 현재 다양한 디자인 클래스에서 온오프라인으로 디자이너들에게 FIGMA, SKETCH, ADOBE XD와 UI/UX를 강의하고 있습니다.

오프라인 강의의 장점은 호흡하며 진행할 수 있다는 장점이 있지만 멀리 계시는 분들과의 호흡은 함께할 수 없다는 아쉬움이 항상 남아 있는 것 같습니다. 인프런으로 이제 언제 어디서든 쉽고 편리하게 피그마 강의를 들으실 수 있도록 준비했습니다.

 

"시작하는 사람과 시작하지 않은 사람의 차이는 하늘과 땅 차이 입니다"


🗒 미국에서 유행하는 미국물 잔뜩 머금은 FIGMA

Figma는 최근 다양한 해외 디자이너들 사이에서 스케치, AdobeXD를 대체할 디자인 툴로 주목받고 있습니다. Framer처럼 어려운 코딩이나 복잡한 UI에서 벗어나 간단한 조작만으로 완성도 높은 프로토타이핑을 구성할 수 있기 때문이죠. 플러그인을 사용하지 않더라도 높은 수준의 디자인 결과를 만들 수 있고, 브라우저 베이스의 툴로 실시간 협업, 실시간 동기화, Hand off 기능으로 디자이너와 개발자 간의 협업도 원활하게 가능합니다. 

해외 유튜버들도 피그마로 전환해가고있습니다.


🌈 피그마 클래스 Master

안녕하세요. 피그마는 브라우저 기반의 새로운 디자인 툴 입니다. 이미 출시된 지 수년이 흘렀지만, 국내에서는 제대로 다루지 않고 있는 디자인 툴이기도 하죠.

새로운 디자인 툴에 대한 다양한 니즈가 존재하고 이제 강제로 익숙해져야 하는 시대가 아닌 나에게 맞는 툴을 직접 고르고 디자인할 수 있는 시대가 도래했습니다.

좋은 디자인 툴 자체가 디자인의 퀄리티를 높여주거나 실력을 향상 시켜주지는 못하지만, 툴을 잘 활용한다면 디자이너의 부족한 부분을 보완해주는 역할을 합니다.

다양한 툴이 넘쳐나고 회사, 개인, 환경과 협업 관계에 따라 어떠한 툴을 선택할지 고민이 많이 되는 시기이기도 합니다. 말 그대로 디자인 툴의 춘추전국 시대죠.

이러한 과도기에 실력을 쌓고 그 실력을 온전히 나의 것으로 만들면서 뒤처지지 않는 것, 이제 같이 시작하고 함께 완성해보시죠.

  • 🎓클래스 01 - 피그마의 컴포넌트 100% 활용하기


MATERIAL DESIGN을 기반으로 하는 화면 구성 과정에서 다양한 경우를 하나의 컴포넌트로 처리하여 앱의 전체적인 톤 앤 매너를 일정하게 유지하는 방법에 대해 학습합니다. 

  • 🎓클래스 02 - 반응형 디자인과 컴포넌트 

컴포넌트를 상황에 맞게 자유롭게 크기를 변형하여 사용할 수 있도록 반응형 컴포넌트로 개발합니다. 

그리드 시스템에 대한 내용은 프레임별로 별도로 적용할 수 있는 그리드 기능을 활용해서 컴포넌트별 그리드를 적용하고 조합하여 사용할 수 있는 방법까지 알아보는 과정입니다.

  • 🎓클래스 03 - 오토레이아웃

피그마에서 선보이는 오토레이아웃은 단순한 버튼을 쉽게 만드는 것부터 카드 컴포넌트를 쉽게 구축할 수 있는 새로운 방법을 제안합니다.

 

  • 🎓클래스 04 - 일을 더 빠르고 효율적으로! - 플러그인도 함께 

피그마를 활용한 디자인을 더욱 쉽고 빠르게 해주는 다양한 플러그인도 알아봅니다. 

 

  • 🎓클래스 05 - 컴포넌트와 프로토타이핑 오버레이  

다양한 프로토타이핑 기능에 대해 학습하고, 컴포넌트에 프로토타이핑을 적용하는 방법에 대해 살펴봅니다. 

🙌 이 강의를 수강하기 위해 필요한 것!

피그마가 설치된 PC, 노트북이 필요합니다. 

Figma는 무료 디자인 툴 입니다.
무료로 다운로드하고 회원가입을 서두르세요! 


🙋🏻‍♂️ 질문있어요옷!!

Q. 디자인을 처음 배웁니다 어렵지 않을까요?

A. 디자인 비전공자도 쉽게 들을 수 있는 강의입니다. 본 클래스는 기초부터 중급까지의 수준으로 제공되고 있습니다. 

B. 본 마스터 과정은 피그마의 기본적인 내용을 이해하고 있다는 전제하에 진행되는 과정이며, 기본 과정에서 이어지는 연속 과정입니다. 

 

Q. 왜 피그마를 배우는게 좋은가요?

A. 피그마는 오래된 디자인 툴은 아닙니다. 아트보드가 아닌 프레임을 쓴다는 것은 피그마가 기존의 디자인 툴과는 다르게 '움직임'을 디자인한다는 것이죠. 마이크로 인터렉션이 중요해지고, 트렌지션(화면전환)효과를 통해 더 높은 사용성을 제공할 수 있습니다.

 

Q. 윈도우 PC도 가능한가요?

A. Figma는 브라우저 베이스의 툴입니다. 다양한 OS에서 모두 사용 가능합니다. Mac, Linux, Windows, Chrome 등 모두 가능합니다 :)

 

 Hello! 에브리바디 '연남동이재용'입니다 

저는 2017년 '맛있는 스케치'라는 스케치 앱에 대한 책을 썼습니다. 공들인 시간 만큼 안 팔린 졸작이지만 ㅜㅜ IT 회사를 운영하면서 디자인 툴을 접하게 되고, 디자이너로서 그리고 직접 디자인한 내용을 실물 앱 서비스로 완성해가면서 누적된 노하우를 공유하고 더 좋은 아이디어를 만들어가는 것에 즐거움을 느끼고 있습니다.

최근에는 FIGMA 가이드북 이라는 책을 집필하게 되었고 책에 있는 내용을 설명 드리려고 합니다 :) 저자 직강인것이죠! 

피그마를 처음 접하시면서 막막한 그 기분을 충분히 이해합니다. 천천히 차근차근 따라 하다 보면 어느새 전문가처럼 익숙해져 있을 거예요.

 

지금 시작하세요. 시작한 사람과 시작하지 않은 사람은 엄청난 차이를 나타냅니다.

이런 분들께 추천드려요!

🎓
학습 대상은
누구일까요?
피그마를 사용할줄 알지만 컴포넌트 활용을 자주 안하시는 경우
컴포넌트 디자인에 관심있는 분
디자인 시스템을 구축하려는 분
팀 라이브러리의 사용방법이 궁금한분
📚
선수 지식,
필요할까요?
피그마 기초과정을 이해하면 좋습니다

안녕하세요
디자인튜터 입니다.
디자인튜터의 썸네일

안녕하세요 다양한 디자인 툴을 강의하고 있는 '디자인튜터'입니다 :) 

 

현) 리메인 디자인툴 테크닉 클래스 강사

전) 패스트캠퍼스 UI/UX디자인 강사

전) LG전자 디자인팀 Sketch 디자인 강의

 

저서 : 맛있는 스케치 디자인, 피그마 가이드북 

커리큘럼 총 10 개 ˙ 2시간 32분의 수업
이 강의는 영상, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 첫번째 섹션의 제목을 입력해주세요.
피그마 컴포넌트 디자인 01 08:02
피그마 컴포넌트 디자인 02 미리보기 16:10
피그마 컴포넌트와 반응형 디자인 14:37
오토 레이아웃 기능 100% 활용하기 20:56
프로토타이핑 기능 Part01 19:20
프로토타이핑 기능 스크롤 기능 14:10
개발자와의 공유 방법 ZEPLIN과 SHARE 기능 16:58
팀 라이브러리 기능 13:07
섹션 1. [업데이트 강의] Variant 기능
[updated] Variant 기능으로 버튼 컴포넌트 만들기 01 16:27
[updated] Variant 기능으로 버튼 컴포넌트 만들기 02 12:27
강의 게시일 : 2020년 12월 16일 (마지막 업데이트일 : 2023년 01월 01일)
수강평 총 22개
수강생분들이 직접 작성하신 수강평입니다.
4.5
22개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
sy thumbnail
5
내용이 너무 좋아서 여러번 반복해서 듣고 익히려구요. 도움이 많이 되었습니다.
2021-05-28
지식공유자 디자인튜터
소중한 수강평 감사드립니다 ;)
2021-07-13
Daju thumbnail
5
실제로 많이 쓰는 예제 위주여서 도움이 많이 되었습니다
2021-03-26
김혜진 thumbnail
5
감사합니다.
2024-04-04
박희진 thumbnail
5
실무에 활용하기 좋고, 매우 유익합니다.
2024-03-21
sangyulchoi thumbnail
5
꼼꼼하게 한 단계씩 나아가는, 쏙쏙 들어오는 강의였어요. 마침 이런 기능 없나 하던 참이라 개인적으로도 안성맞춤인 강의였습니다. 감사합니다!
2023-11-18