문제 해결

피그마 앱 미러링 이미지 사이즈 차이

피그마 오픈카톡방2026. 3. 7.

질문사항

Figma 앱 미러링 시 보이는 이미지 사이즈와 실제 앱 구현 시 이미지 사이즈가 많이 달라지는 현상(이미지가 작아짐)이 발생합니다. 미러링과 실제 앱 구현 시 사이즈가 달라질 수 있나요?

답변

네, Figma 미러링 시 보이는 사이즈와 실제 앱 구현 시의 사이즈가 다르게 보일 수 있습니다. 몇 가지 원인이 있을 수 있습니다.

Figma 프레임 크기와 실제 기기 해상도/DPI 불일치:

Figma는 일반적으로 1x 해상도(예: iPhone 14의 경우 390x844pt)를 기준으로 디자인합니다.

Figma Mirror 앱은 디자인된 프레임을 실제 기기의 화면에 1:1 픽셀로 매칭하여 보여주려고 합니다. 만약 디자인한 프레임의 논리적 해상도(pt)와 미러링하는 기기의 실제 해상도(px)가 다르거나, 기기의 픽셀 밀도(DPI/PPI)가 높으면 시각적으로 다르게 보일 수 있습니다.

예를 들어, 375x812pt로 디자인된 프레임을 실제 375x812px보다 훨씬 높은 해상도를 가진 고밀도 디스플레이 폰(예: iPhone Pro Max)에서 미러링하면, Figma Mirror는 1:1 픽셀 매칭을 시도하므로 디자인이 상대적으로 작게 보일 수 있습니다.

앱 개발 시 이미지 처리 방식:

실제 앱 개발 시에는 이미지 에셋을 다양한 해상도(예: @1x, @2x, @3x)로 준비하고, 기기의 픽셀 밀도에 따라 적절한 에셋을 로드하여 스케일링합니다.

만약 개발자가 이미지를 특정 해상도에 맞춰 고정 크기로 처리했거나, 스케일링 로직에 문제가 있다면 Figma에서 의도한 것과 다르게 보일 수 있습니다. 특히 사용자 프로필 같은 이미지는 `contentMode` (iOS)나 `scaleType` (Android) 설정에 따라 다르게 보일 수 있습니다.

해결 방안:

Figma 프레임 설정 확인: 디자인하는 기기의 표준 해상도(pt)에 맞춰 프레임을 설정했는지 확인하세요.

개발자와 협의: 개발자에게 이미지 에셋 처리 방식과 스케일링 로직에 대해 문의하고, Figma 디자인과 실제 구현 간의 차이를 줄일 수 있는 방법을 논의하는 것이 가장 정확합니다.