[31기 1차 세미나] (4) 피그마 세미나

1차 세미나의 네 번째 주제 또한, 노션 세미나와 마찬가지로 SOLUX의 모든 부원들이 함께 수강한 세미나였는데요.

바로 피그마를 활용해 자연스러운 UI를 만드는 방법을 배워보는 피그마 세미나였습니다. 

 

노션과 더불어 개발 프로젝트에서 빠질 수 없는 필수 툴로 자리 잡은 피그마, 이번 세미나는 과연 어떤 내용들로 구성되었을지 지금 바로 함께 살펴보시죠! 

 

 

주제

---

 

기간

 

3월 23일 (월) ~ 4월 3일 (금)

 

---

 

세미나 소개

 

허희윤 멘토님께서 진행해 주신 피그마로 만드는 자연스러운 UI 세미나에서는

피그마의 기초부터 UI 제작 실습까지 피그마의 다양한 활용 방법을 폭넓게 다루었습니다.

 

 

내용

---

1. 피그마 개요

 

피그마는 UI/UX 디자인, 프로토타이핑, 디자인 시스템 구축, 실시간 협업을 지원하는 클라우드 기반의 올인원 디자인 툴입니다.

별도의 설치 과정 없이 웹 브라우저에서 바로 접속이 가능하며, 이는 OS에 관계없이 누구나 같은 환경에서 작업할 수 있다는 것을 의미합니다.

 

디자인 파일이 클라우드에 있어 실시간으로 수정이 가능해 가장 최신 버전을 함께 볼 수 있습니다.

 

섹션 1에서는 피그마의 개념을 살펴본 뒤, 본격적인 실습에 앞서 기본 세팅을 함께 진행하였습니다. 

 

---

 

2. 기능 이해하기 

 

피그마 상단바에는 선택 도구, 프레임, 도형, 펜, 펜슬, 텍스트 등 다양한 디자인 작업을 위한 기능들이 마련되어 있습니다.

 

선택 도구는 오브젝트를 선택하고 크기를 조정할 수 있도록 하며, 디자인을 담는 바탕이 되는 프레임 도구는 휴대폰, 태블릿 등 다양한 디바이스에 맞춘 디자인 틀을 만들 때 사용됩니다. 

 

 

 

이어서 진행된 실습에서는 원하는 크기의 프레임을 생성하고, 도형, 이미지, 텍스트를 삽입해 간단한 레이아웃을 구성하며 피그마의 핵심 기능들을 직접 활용해 보는 시간을 가졌습니다.

 

또한 오토 레이아웃과 컴포넌트 기능을 통해 깔끔하고 자연스러운 반응형 웹 디자인을 쉽게 구현할 수 있다는 점도 확인할 수 있었습니다.

반응형 웹 디자인이란, 화면 크기에 따라 오브젝트와 레이아웃이 자동으로 유동적으로 조정되는 디자인을 의미합니다. 

 

---

 

3.  협업

 

마지막 섹션에서는 프로토타이핑과 피그마의 실시간 협업 도구 실습이 진행되었습니다.

 

이미지처럼 플로우 기능을 통해 화면과 같이 선택한 기기에 맞춰 프로토타입을 진행했습니다.

실시간 협업 도구를 통하여 팀원들과 코멘트, 피드백 기능을 통한 협업 실습도 진행해 보았습니다.

 

 

과제

---

- 필수 요소를 충족하여 프로토타입 제작해 링크 공유

 

이번 과제는 최소 3종류 interaction, 최소 4종류의 색상/도형(ppt에는 없지만 영상에서 설명함), 최소 5개 페이지 혼자서 구현해보는 과제였습니다.

 

SOLUX의 모든 부원들이 세미나에서 익힌 내용을 바탕으로 성실히 과제를 제출해 주셨습니다. 

 

실무에서 유용하게 활용될 수 있는 피그마의 기본 사용법에 익숙해지고, 다양한 기능을 직접 적용해볼 수 있었던 유익한 시간이었습니다.

앞으로도 피그마를 통해 더욱 활발한 디자인 협업이 이루어지길 진심으로 응원합니다! ✨