inblog logo
|
wave
    FIGMA

    피그마 이용방법 | 첫 사용자를 위한 입문서

    피그마 기본 사용방법, 핵심 단축키, 피그마 간단하게 보는 방법, View 권한인 경우 사용법
    Feb 28, 2024
    피그마 이용방법 | 첫 사용자를 위한 입문서
    Contents
    🧐FIGMA 피그마가 뭐에요?01 워크스페이스 구조와 사용법02 실시간 협업 및 커뮤니케이션1) 작업본을 파일로 보관할 때 : PDF로 EXPORT2) 간편하게 작업 공유할 때 : link (view 권한)3) 결과물의 특정 부분 피드백할 때 : Comment4) 같이 작업 중인 경우 간단 채팅 : Cursor chat03 상황 별 FIGMA 작업본 활용📃 오늘의 연습NEXT 2회차 교육
     

    🧐FIGMA 피그마가 뭐에요?

    💡
    ‘디자인 및 협업’을 위한 클라우드 기반의 그래픽 디자인 작업 도구 *클라우드 기반 = 온라인 환경을 통해 사용자에게 서비스를 제공한다는 뜻 FIGMA를 이용하면,
    첫째, 협업이 용이합니다. #실시간_공동작업 - 유연한 협업: 동시에 동일한 파일을 편집하고 실시간으로 변경 사항을 확인
    둘째, 접근성&편의성이 뛰어납니다. #웹브라우저 #링크공유 - 별도의 소프트웨어 설치 없이 어디서나 인터넷에 접속하여 Figma에 접근
    셋째, 자동 저장 및 백업이 이루어집니다. - 클라우드 상에서 작업되어, 파일 자동저장 & 백업
     

    1️⃣ 회원가입하기

    1) Figma 피그마 접속 ▶️ https://www.figma.com/
    2) (권장) App다운로드 ▶️ https://www.figma.com/downloads/
    1 피그마 접속
    1 피그마 접속
    2 (선택) 피그마 Desktop 앱 다운로드
    2 (선택) 피그마 Desktop 앱 다운로드
    Guide to the Figma desktop app
    Before you start Who can use this feature Supported on any team or plan. macOS: Must be running macOS 11 or later Windows: Must be running Windows 10 or later in a 64-bit environment ...
    Guide to the Figma desktop app
    https://help.figma.com/hc/en-us/articles/5601429983767-Guide-to-the-Figma-desktop-app
    Guide to the Figma desktop app
    피그마는 클라우드 기반 그래픽 디자인 도구
    피그마는 클라우드 기반 그래픽 디자인 도구
     
     

    2️⃣ 작업공간 만들기

    + NEW draft 1. Design : 피그마에서 디자인 작업을 수행하는데에 적합합니다. 2. Figjam : 간단한 도식도 제작에 적합합니다.
    HOME 화면의 좌측은 폴더라고 생각하면 됩니다.
- DRAFT : 내가 작업하는 파일
- Favorite files : 별표시한 파일
- Teams : 그룹에서 작업하는 파일
    HOME 화면의 좌측은 폴더라고 생각하면 됩니다. - DRAFT : 내가 작업하는 파일 - Favorite files : 별표시한 파일 - Teams : 그룹에서 작업하는 파일
     
     
     
     
     

    01 워크스페이스 구조와 사용법

    🙌처음 보는 화면을 호기심으로 바라봐주세요 :) 요즈음 PPT라고 생각해보면, 더욱 수월할거예요.

     
     

    ☑️ 앞으로 쭉 써먹을 핵심 단축키

    notion image
     
    • 도움말 보기 Ctrl + Shift + /
    주요 단축키 사용 시 Figma 이용이 더욱 편리해집니다.
    주요 단축키 사용 시 Figma 이용이 더욱 편리해집니다.

    [작업 공간 구조]

    notion image
     
    1. 주요 메뉴: 자주 사용하는 메뉴 공간 *직접 클릭하는 것보다 단축키를 외우는 것이 훨씬 빠-름! *각 메뉴 위에 마우스를 올리면, 메뉴명과 단축키 표시됨 2. 레이어/에셋 패널: 작업 목록 1) 레이어: 현재 페이지에 생성된 요소의 목록 2) 에셋: 현재 파일에서 고정적으로 반복 사용할 요소를 에셋화한 디자인 오브젝트의 목록 3. 공유 & 비율 *작업자, 들어와 있는 공동 작업자, 공유 등 파일에 대한 설정 확인 가능! *FIGMA는 X축과 Y축으로 이루어진 큰 캔버스라고 생각해주세요 :) 4. 디자인/프로토타입 패널: 선택한 요소의 상세 편집 목록 1) 디자인: 크기, 색상 등 상세 편집 기능 2) 프로토타입: PPT 프리젠테이션 또는 웹브라우저 등 동적인 움직임을 설정할 수 있는 기능
     
     
     
     

    02 실시간 협업 및 커뮤니케이션

    ☝️피그마는 이렇게 활용할 수 있어요.

    - 작업 중인 파일의 최신본을 확인할 때! - 작업을 공유할 때! - 작업 중간 피드백이 필요할 때!
    (미리보기) 오늘의 연습
해당 글 확인 후, 1번에서 3번까지 진행해 보세요!
    (미리보기) 오늘의 연습 해당 글 확인 후, 1번에서 3번까지 진행해 보세요!

    1) 작업본을 파일로 보관할 때 : PDF로 EXPORT

    우측의 디자인 패널은 “선택한 요소”를 편집 또는 추출할 수 있어요 :)
- 선택한 요소는 좌측 레이어 패널에서 확인 가능
    우측의 디자인 패널은 “선택한 요소”를 편집 또는 추출할 수 있어요 :) - 선택한 요소는 좌측 레이어 패널에서 확인 가능

    2) 간편하게 작업 공유할 때 : link (view 권한)

    3) 결과물의 특정 부분 피드백할 때 : Comment

    코멘트 기능은 “협업”하는 경우, 매우 유용합니다.
    코멘트 기능은 “협업”하는 경우, 매우 유용합니다.

    4) 같이 작업 중인 경우 간단 채팅 : Cursor chat

     
     
     
     

    03 상황 별 FIGMA 작업본 활용

    ✌️ FIGMA는 링크기반으로 공유가 가능합니다.

    영업 담당자가 발표 자료를 공유할 때? 간단하게 최신 자료를 확인하고 싶을 떄?
    = 링크 주세요!
    1. Figma를 함께 사용하고 있다면?
- 레이어 이름 알려주세요 → [ Ctrl + F ] 검색 후, 레이어 클릭 → [ Shift + 2 ] 해당 영역으로 이동

2. Figma 작업본을 공유 받는다면?
- 링크 공유 주세요!
    1. Figma를 함께 사용하고 있다면? - 레이어 이름 알려주세요 → [ Ctrl + F ] 검색 후, 레이어 클릭 → [ Shift + 2 ] 해당 영역으로 이동 2. Figma 작업본을 공유 받는다면? - 링크 공유 주세요!
     
     
     
     

    📃 오늘의 연습

    1️⃣
    피그마 기본 셋팅 (계정 생성 및 작업환경 설정)
    위 과정을 차근차근 진행해주세요.
    • 회원가입 > 내 작업공간 살펴보기 > 프레임 만들기 & 주요 단축키 눌러보기
    2️⃣
    배운 기능 활용하기
    회원가입 후, 1번에서 3번까지 차근차근 연습해 보세요!
    회원가입 후, 1번에서 3번까지 차근차근 연습해 보세요!
     
     
     

    NEXT 2회차 교육

    • Figma Community 에서 템플릿 가져오기
    • 유용한 Plugin 활용
    • 반복 사용 Component 만들기
     
    Share article
    Contents
    🧐FIGMA 피그마가 뭐에요?01 워크스페이스 구조와 사용법02 실시간 협업 및 커뮤니케이션1) 작업본을 파일로 보관할 때 : PDF로 EXPORT2) 간편하게 작업 공유할 때 : link (view 권한)3) 결과물의 특정 부분 피드백할 때 : Comment4) 같이 작업 중인 경우 간단 채팅 : Cursor chat03 상황 별 FIGMA 작업본 활용📃 오늘의 연습NEXT 2회차 교육

    wave

    RSS·Powered by Inblog