inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[UI3 업데이트] 피그마 배리어블을 활용한 디자인 시스템 구축하기

만능으로 쓰이는 기본 카드(Basic Cards) ✅

'만능으로 쓰이는 기본카드' 강의 내용에 대해 질문드립니다.

39

D.Hye

작성한 질문수 1

0

안녕하세요, 강의듣고 있는 수강생입니다.

'만능으로 쓰이는 기본카드'
강의 내용에서 utillties 부분에 해당하는 이미지

크기를 고정 시키는 플러그인을 알려주셨는데,
해당 플러그인 현재 2026년 8월 기준에는 나오지 않아서 첨부한 이미지와 같은 'Aspect Ratio Lock'을 사용해보았는데, 비슷하면서도 다른 플러그인이라 그런지, 강의에서 알려주신대로 도형에 바로 적용되지 않는 플러그인이며, 비율을 400:400로 키운다음에 1:1로 맞추려고 하면 고정 자체가 되지 않습니다

image.png

이렇게 플러그인을 사용할 수 없는 상황이라면, 이미지 비율을 고정시킬 수 있는 대체 방법에 대해 알려주실 수 있으실까요?

웹-디자인 figma figma-tokens 디자인-시스템 아토믹-디자인 figma-variable 프로덕트디자인

답변 2

0

볼드 UX

안녕하세요, D.Hey님

강의 제작 이후 피그마 자체에서 Lock Aspect Ratio(비율 고정) 기능을 사용할 수 있게 되었습니다. 그러면서 제가 소개해드렸던 플러그인은 업데이트가 중단되며 자연스럽게 사라졌습니다.

Dimensions 항목에서 W, H 오른쪽에 있는 Lock Aspect Ratio 버튼을 켜시면 됩니다.

  • 1:1 비율로 만들고 싶으시면, W 200, H 200으로 설정한 뒤 오른쪽 버튼을 눌러주세요. 그러면 크기를 조절해도 비율이 그대로 유지됩니다.

  • 다른 비율, 예를 들어 2:3으로 하고 싶으시면 W 200, H 300으로 설정 후 버튼을 누르시면 이후부터 그 비율로 고정됩니다.

한번 적용해보시고 결과 알려주시면 감사하겠습니다.

Screenshot 2026-08-07 at 10.48.57.png

.

원하시는 시점에 맞춰 빠르게 답변드리지 못한 점 개인적으로 죄송하게 생각합니다. 얼마 전 태어난 둘째 아이가 독감으로 응급실에 다녀오게 되어 경황이 없었습니다. 그럼에도 미리 말씀드린 대로 약속드린 3일 이내에는 답변을 드리고자 노력했습니다.

오늘 남겨주신 강의 평점을 보니 아쉬움이 있으셨던 것 같습니다. 앞으로 강의를 완강하시는 과정에서 궁금하신 점이 있으면 언제든 편하게 질문 주세요. 성심껏 답변드리며 만족스러운 경험이 되실 수 있도록 노력하겠습니다.

올해는 둘째 출산으로 챌린지를 진행하지 못했지만, 하반기에 새로운 챌린지를 준비하고 있습니다. 기존 강의에 더불어, AI를 활용하는 방법에 대해 다룰 예정이니, 그때 꼭 연락 주시면 함께 디자인 시스템을 제대로 배워보는 기회가 되었으면 좋겠습니다.

감사합니다!

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. D.Hye님, 강의를 수강해 주셔서 감사합니다.

피그마에서의 이미지 비율 고정과 관련해 발생한 문제에 대해 아래와 같은 해결책을 제안드립니다.

피그마에서의 대체 방법:

  1. 피그마의 기본 기능 사용: 피그마는 기본적으로 이미지나 도형을 선택한 후 오른쪽 속성 패널에서 ‘비율 고정’ 체크박스를 통해 가로 세로 비율을 고정하는 기능을 제공합니다. 이를 통해 별도의 플러그인 없이도 비율을 유지한 채 크기를 조정할 수 있습니다.

  2. 비율 계산 적용: 이미지 비율을 1:1로 유지하길 원하신다면, 원하는 비율로 도형 크기를 먼저 조정한 뒤 해당 크기(예: 400x400)로 설정해 주세요. 그 후 ‘비율 고정’ 옵션을 설정하여 크기를 조절하면 같은 비율을 유지할 수 있습니다.

  3. 커스텀 단축키 설정: 피그마에서 ‘비율 고정’을 자주 사용할 경우 편리하게 접근할 수 있도록 단축키를 설정하여 효율적인 작업이 가능합니다.

관련 질문 및 해결 방법:

이와 비슷한 문제를 겪으신 분들을 위해, 아래 링크에서 유사한 질문과 해결 방법을 확인하실 수 있습니다:

위 링크에서는 피그마의 다양한 기능을 활용하여 비율 고정을 어떻게 할 수 있는지에 대해 소개하고 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해 드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

figma.com/@boldux 계정이 없다고 나옵니다

0

54

2

반응형 웹 디자인

0

106

3

액션 아이콘 컴포넌트 질문

0

73

2

셀렉트(Select & Dropdown menu) - 파트 1 / selected 토글 버튼

0

81

3

스피너 아이콘 크기 질문

0

84

2

미리보기 빈칸생기는 현상

0

77

2

아이콘 빌런 부분

0

66

2

배리어블 Value에 관해 질문있습니다.

0

103

1

Body>font weight 에서 semibold에 짝대기가 생기는 이유?

0

84

1

Navigation Mobile 토글 베리어블이 안됩니당

1

80

2

Typography 모드 적용시 표현된 값과 우측에 표시되는 값다름

0

83

1

디자인 시스템에 그룹명을 숨길 수도 있나요?

0

88

2

디자인 시스템 네이밍에 관한 질문드립니다.

0

103

2

next step?

1

110

1

16강 Print Variables 출력 질문

0

112

2

open in Figma 누르고 ui kit 다운?받았을 때

0

126

2

variables 이름 지을때 소문자,대문자 사용에 관해..

0

142

2

디자인 시스템 네이밍 순서에 대해 질문남깁니다!

0

160

2

이미지 캐러셀 영상

0

115

2

아이콘 사이즈 컴포넌트 구성 방식 관련

0

176

3

완강/리뷰 이벤트 후 강의자료

0

96

2

Stack 컴포넌트 관련하여 궁금한 점이 있습니다.

0

94

1

컴포넌트별 베리어블 구축

0

149

2

인풋 텍스트필드에서는 왜 'interactive/bg' 배리어블을 활용하지 않는 것인가요?

0

66

1