누룽지맛치킨
어미새의 개발일지
누룽지맛치킨
전체 방문자
오늘
어제
  • 분류 전체보기 (86)
    • 코틀린 (8)
    • 안드로이드 (5)
      • 디자인 (2)
      • 개발 (2)
      • 도구 (1)
    • 피그마 (1)
    • 대외활동 (0)
    • 프로젝트 (0)
    • 백준 (55)
      • JAVA (55)
    • 알고리즘 (3)
    • 클라우드 (5)
    • 스터디 (2)
      • 코테 (2)
    • 자료구조 (5)
    • 컴퓨터 기술 (1)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 클라우드
  • 클라우드 컴퓨팅
  • Room Migration
  • 백준 자바
  • 백준 자바 2559번
  • 코틀린 인 액션
  • 자료구조
  • 백준 자바 2292번
  • 백준 자바 다이나믹 프로그래밍
  • 백준 자바 정렬
  • 백준 자바 수열
  • Room version 올리기
  • 안드로이드 디자인
  • 자바 Priority Queue
  • 알고리즘 조합
  • 백준 자바 누적합
  • 코틀린
  • 코틀린 runBlocking
  • 백준 자바 벌집
  • 안드로이드

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
누룽지맛치킨

어미새의 개발일지

피그마 사용법
피그마

피그마 사용법

2023. 1. 15. 23:49

Team 생성

  • Team을 생성하여 다른 사람들과 함께 디자인 협업을 진행 가능

New file 생성

  • design file -> 디자인을 진행하기 위해 파일 생성
  • figzam file -> 브레인스토밍, 협업을 위한 화이트보드

상단 메뉴바

  • move tool : 선택
  • frame : 대지 생성(아트보드 역할)
    • 기본으로 휴대폰 사이즈 선택 가능
  • shape : 도형 그리기
    • 프로필 사진 등 그릴 때 보통 사용
  • pen : 그리기
    • 아이콘 그릴 때 사용 가능
  • Text : 텍스트 작성
  • hand tool: 잡기
  • comment : 코멘트 남기기

우측 사이드 메뉴

  • align : 가운데 정렬 등
  • 치수 : 숫자로 사이즈
  • constraint : 다른 컴포넌트에 연결 가능(안드로이드 컨스트레인트 레이아웃과 동일한 개념)
  • color : 색상 변경
    • 자주 사용하는 색을 이름으로 저장 가능 → 디자인 색 변경 시 한번에 변경 가능
  • Stroke : 테두리나 모양 설정 가능
  • Effect : 그림자 설정
  • export : 외부로 컴포넌트 저장

컴포넌트 이름 설정

  • 이름 앞에 특수 문자를 붙여 개발에 사용할 것을 특정할 수 있음.

community

  • plugin : community에서 유용한 기능 설치 가능
  • 유용한 plugin : Unsplash
  • Unsplash : 도형에 이미지를 바로 넣을 수 있음.
  • 다양한 UI KIT 다운 가능(icon, wireframe 등)

여러 개의 똑같은 양식의 컴포넌트

  • Ctrl + Alt + K → 컴포넌트로 만들기
  • 사용할 만큼 복사 붙여넣기 후 add auto layout으로 정렬 가능

프로토타입 제작

  • 기기 및 모델 지정
  • 컴포넌트를 프렘과 연결하여 이동 설정 가능
  • 컴포넌트들을 프레임으로 묶어 스크롤도 가능

🔔 느낀 점

  • UI 디자인 툴에는 어도비XD, 스케치, 인비저 스튜디오, 피그마 등 다양
  • 안드로이드 개발자가 간단하게 디자인하고 협업을 하기에 피그마가 적당
  • 플러그인 기능과 커뮤니티를 통해 KIT를 통해 좋은 디자인을 잘 끌어쓸 수 있음
  • 프로젝트 시에 디자인이 어려워서 생략하고 개발에 무작정 들어가는 경우가 있었지만 이제는 간단하게 디자인 가능
    누룽지맛치킨
    누룽지맛치킨

    티스토리툴바