피그마의 오토 레이아웃, 그리드, 컨스트레인츠 기능을 제대로 활용해 반응형 디자인을 마스터하고 싶은가요? 이 강의에서는 작은 UI 요소부터 카드, 테이블, 컴포넌트, 웹과 앱 화면까지 반응형 디자인으로 만들어내는 실력을 단계별로 키워갑니다. 취업 준비와 실무에서 바로 써먹을 수 있는 피그마 활용법을 익히고, 다양한 디바이스에 최적화된 반응형 인터페이스 디자인 능력을 마스터해보세요!
반응형 디자인에 대한 개념부터 실전 활용 능력까지 장착합니다.
피그마의 꽃 "오토레이아웃"을 마스터하여 반응형 디자인에 활용할 수 있습니다.
피그마의 오토레이아웃, 그리드, 컨스트레인츠 기능을 활용하여 작은 UI디자인 요소부터, 카드, 컴포넌트를 반응형으로 만들어봅니다.
반응형으로 웹과 앱을 모두 디자인할 수 있습니다.
하나의 디자인으로 다양한 디바이스 환경에 유연하게 대응할 수 있는 "반응형" 디자인 역량을 갖추게 됩니다.
개발자 및 이해관계자에게 더 효과적으로 디자인 핸드오프를 전달할 수 있습니다.
안녕하세요. 프로덕트 디자이너 에릭입니다. 👋
저는 현재 미국 뉴욕에 위치한 글로벌 테크 기업 TKWW(The Knot Worldwide)에서 시니어 프로덕트 디자이너로 일하고 있습니다. UX리서치부터 UI디자인, 디자인 시스템 구축 및 관리까지, UX/UI 전반을 아우르는 실무 업무를 담당하고 있고 면접관으로서, 지원자의 포트폴리오를 검토하고 평가하는 역할도 맡고 있어요. 그렇기 때문에 입문자나 취업을 준비하는 분들에게 어떤 역량이 실제로 필요한지 잘 알고 있습니다. 그리고 Amazon 베스트셀러에 오른 UX디자인 입문자를 위한 책 『Design thinking for beginners』를 집필하기도 했습니다.
이번 강의를 만들게 된 계기는 제가 실무에서 반응형 디자인과 이를 위한 피그마의 핵심 기능을 제대로 마스터한 이후, 디자인 생산성과 효율성이 몇 배 이상 향상된 경험을 했기 때문이에요. 그 핵심에는 피그마의 오토레이아웃, 그리드, 컨스트레인츠 기능을 활용한 체계적인 화면 설계 방식이 있었습니다.
이전에는 같은 디자인을 화면 사이즈별로 대응하는데 새로 만들고 수정하느라 시간이 너무 많이 들었어요. 하지만 지금은 하나의 디자인으로 다양한 디바이스에 유연하게 대응할 수 있는 반응형으로 UI 디자인 을 구축할 수 있게 되었고, 그 결과 반복 작업은 줄고, 디자이너-개발자 간 협업도 훨씬 매끄러워졌습니다. 저는 저의 경험과 지식, 실무 노하우를 바탕으로 반응형 디자인은 입문자/취준생 분들에게는 취업의 가능성을 크게 높이고, 반응형 디자인을 모르는 현업 디자이너에게는 업무 생산성을 크게 향상시킬 수 있도록 도와드릴 거에요. 이번 기회에 반응형 디자인을 제대로 배우고, 커리어 성장의 기회를 만들어보세요.
학습 대상은
누구일까요?
취업의 목표를 더 빠르게 달성하고 싶은 UX/UI디자인 입문자 및 취업준비생
UX/UI디자이너와 협업을 하는, 또는 직접 디자인을 하는 개발자
오토레이아웃/그리드 등을 활용하여 기획서 제작에 대한 업무생산성을 높이고 싶은 PM/PO/서비스기획자
반응형 디자인을 잘 모르거나 오토레이아웃/컨스트레인츠 활용법을 잘 모르는 주니어 또는 현직 디자이너
선수 지식,
필요할까요?
피그마(Figma)에 대한 기초 지식 및 활용법
UX/UI 디자인에 대한 기본 개념
4,943
명
수강생
654
개
수강평
301
개
답변
4.8
점
강의 평점
7
개
강의
현재 뉴욕의 글로벌 테크 회사 The Knot Worldwide에서 시니어 프로덕트 디자이너로 일하고 있습니다.
뉴욕에 오기 전에는 서울에서 UI기획자로 일을 했습니다.
브런치 매거진 "디자인, 그리고 프러덕트"와 UX, UI 지식과 정보를 공유하는 "뉴욕 UX디자이너" 인스타그램과 페이스북을 운영하며 디자이너 및 예비 디자이너들과 소통하고 있습니다.
개인적으로는 세 아이👶의 아빠이며 요리🍲, 교육🏫에 관심이 많습니다.
집필 및 강의
• "뉴욕 프로덕트 디자이너가 알려주는 UX디자인 입문 A to Z" 책 출간 (링크: Yes24, 알라딘, 교보문고)
• 퍼블리 아티클 "서비스의 첫 인상을 결정하는 3초: 랜딩 페이지 UX 4가지 원칙" 발행
• Samsung SW Academy for Youth (SSAFY) UX/UI다자인 및 피그마 강사
• 1:1 멘토링 및 기업 강의 진행 (토픽: UX, UI디자인, UX퍼실리테이션, UX/UI 포트폴리오 제작 및 발행)
경험 및 경력
• (현) 뉴욕 The Knot Worldwide 시니어 프로덕트 디자이너
• (전) 서울 Pantech 모바일 앱 UI기획자
• 뉴욕 기반의 다수 스타트업과 UX/UI 컨설팅 프로젝트 진행
• 뉴욕 School of Visual Arts 디자인 대학원 졸업 / 전공: Interaction Design
• 한동대학교 학부 졸업 / 전공: 산업디자인
전체
40개 ∙ (5시간 10분)
전체
9개
4.9
9개의 수강평
수강평 1
∙
평균 평점 5.0
5
Thank you for creating the necessary lectures.
Thank you for the feedback. I'm so happy that I was able to help you through the course. I'll be cheering for all your future plans to go well~!
수강평 1
∙
평균 평점 5.0
수정됨
5
I'm working on frontend development at a startup, but I'm also handling design tasks. Until now, I've been fumbling through design by searching for YouTube materials only when needed, but this time I had to learn responsive design quickly. Since the course is practice-oriented, I can follow along step by step or try first and then check, which seems effective for learning responsive design in a short period! The part where you explained the principles of constraints was especially helpful, and when alignment wasn't working, you pointed out why, which helped me understand aspects I had previously missed. Also, although I had difficulties with files during the course, I was grateful that you provided quick feedback despite the time difference...! This time, instead of the tedious way of manually adjusting values stitch by stitch like before, I want to work efficiently by properly applying what I learned in the course. Thank you so, so much 😭😭! I'll keep fighting until the end and complete the course!
I'm delighted to be able to help through the responsive design course. I also remember the times when I didn't use auto layout or constraints and had to do a lot of manual work stitch by stitch. I can say that productivity has increased dozens of times now. I believe that if Joy applies the course content to practical work, it will enhance work efficiency. Thank you for your valuable feedback, and I'll be cheering for you to achieve all the things you're planning ahead.
수강평 1
∙
평균 평점 5.0
5
I'm someone for whom understanding 'why' something needs to be done serves as a very important motivator. Actually, even if you know many features, if you don't know how to apply them or they're not practical, the utility of the information you have would decrease and the meaning of learning those features would also fade significantly. However, what I liked most about this course was that it felt like it was created not through a learning -> practical application route, but rather through a practical difficulties -> learning -> overcoming difficulties route. The way you actually explained things was also structured as why this feature is important in practice -> how to apply it + actual case examples, so it stuck in my head much better. And because you explained things in an easy way, I was able to completely break down the burden I felt about parts I had vaguely thought were difficult features. Also, as a job seeker, you told us throughout the course 'why' these are frequently used in practice, so even while learning, I found myself thinking I should remember this and looking at it once more. Thanks to this, my vague fear and burden about practical work has also decreased! Thank you :)
Thank you for your thoughtful review. I also remember feeling frustrated when I first learned and studied responsive design, especially auto layout, not knowing how to apply it in actual work. In other words, I didn't want to learn just for the sake of learning the feature itself, but I wanted to learn how to solve the problem of responsive design, and I remember that wasn't easy. So while creating this course, I tried to structure the curriculum and content by thinking about how students, especially beginners or those preparing for employment, could more easily understand and acquire skills applicable to real work. In other words, I set the goal of creating a course so that after taking this course and mastering responsive design, an applicant would make an interviewer think, "This person is ready with responsive design skills." Hearing that this course has reduced the vague and fearful burden of real work (!!) makes me incredibly happy and gives me great satisfaction in creating this course :) Once again, thank you for leaving such valuable reviews and feedback, and I deeply support all your future career plans.
수강평 2
∙
평균 평점 5.0
5
Thank you so much for such a valuable lecture! Sharing the Figma files made it great to practice along directly. However, I didn't quickly realize the materials were available at first, so I went searching for them during the lecture😊😊 Your intuitive explanations using comparisons, examples, analogies, etc. made it easy for beginners to understand, and it was wonderful to learn about the effects and applications of even the less noticeable Figma features! Plus, the quizzes at the end of each section helped me review and recall the content from each cycle, making the learning process enjoyable.
수강평 1
∙
평균 평점 5.0
5
Even though these are basics I already know, you explain the fundamentals thoroughly and easily as a reminder, making it easy to understand! You show real-world examples while explaining, and I think it's great that I can find similar cases on my own to compare and study!!!
Thank you. I designed the course with the goal of making it easy for students to understand and follow along, so I'm absolutely delighted to hear that it was helpful. I'll be cheering you on to achieve all the things you're planning in the future.
2025 추석맞이 감사할인 중
₩58
24%
₩99,000
지식공유자님의 다른 강의를 만나보세요!
같은 분야의 다른 강의를 만나보세요!
