오토 레이아웃2 반응형 및 디바이스 접점 설계 피그마 기초 스터디로그 · 09 반응형 및디바이스 접점 설계8일차까지는 화면 하나를 잘 만드는 이야기였는데,오늘은 같은 서비스가 폰, 태블릿, 데스크톱에서 어떻게 달라져야 하는지를 배웠어요.화면을 줄이고 늘리는 게 아니라, 기기마다 만나는 순간을 다시 설계하는 거더라고요.TODAY'S BASICS오늘 배운 네 가지1디바이스별 상황기기마다 쓰는 상황이 달라요2브레이크포인트화면 폭에 따라 그리드가 바뀌어요3늘고 줄어드는 규칙오토 레이아웃으로 반응하게 만들기4우선순위와 일관성기기에 맞게 덜어내되 같은 브랜드로01 · DEVICE CONTEXT디바이스별 상황기기마다 쓰는 상황이 달라요반응형은 화면 크기만의 문제가 아니에요.기기마다 사용자가 놓인 상황과 입력 방식이 달라서, 접점도 달라져야 해요.기기별 접점 상황.. 2026. 10. 14. 레이아웃 규칙, 오토 레이아웃과 허그 · 필 · 픽스 피그마 기초 스터디로그 · 02 레이아웃 규칙오토 레이아웃과 허그 · 필 · 픽스1일차에서 프레임과 레이어를 배웠는데,오늘은 그 안의 요소들을 자동으로 정리해주는 기능을 배웠어요.이름부터 낯선 "허그·필·픽스"까지 정리해볼게요.TODAY'S BASICS오늘 배운 네 가지1오토 레이아웃요소를 자동으로 정리해주는 기능2크기와 정렬요소들의 기준선과 간격 맞추기3UI 요소버튼처럼 재사용하는 조합 만들기4허그 · 필 · 픽스크기가 반응하는 세 가지 방식01 · AUTO LAYOUT오토 레이아웃요소를 자동으로 정리해주는 기능오토 레이아웃을 켜면 요소들 사이 간격과 정렬을 자동으로 맞춰줘요.하나씩 손으로 옮기지 않아도 알아서 줄이 맞아요.적용 전 vs 후BEFOREABC→AFTER (오토 레이아웃)ABC왜 중요한가요.. 2026. 10. 1. 이전 1 다음
