02 · PART 2 · CLASS / FIGMA UX·UI

실습 05-2
UI 종합 개선안

앞선 분석을 한 화면에 통합하고 사용자 행동에 가장 큰 영향을 주는 세 문제를 개선한다.

진행 중 · 실습지와 검수 기준 준비

대상나정당 인터넷 비교 화면

훈련 초점종합

완료 산출물진단표, 우선순위 매트릭스, 개선 시안 1~2장

최종 목표는 화면 이미지를 베끼는 것이 아니라, 위계·여백·반응형·컴포넌트 규칙을 이해하고 편집 가능한 화면으로 직접 재구성하는 것이다.

클론 학습 흐름

참고 화면 고정요소 측정수동 재구성반응형 검사차이와 근거 기록

단계	Figma에서 직접 할 일
화면 선정	첫 화면과 요금제 비교 영역 1~2장을 선정한다.
5축 평가	타이포·색상·간격·정렬·아이콘마다 좋은 점과 문제를 1개 이상 기록한다.
우선순위	영향도×발생 빈도로 상위 3개 문제를 고른다.
개선 시안	상위 문제만 반영한 전후 화면과 기대 행동을 연결한다.

작업 후 각 항목을 5점으로 자기 평가한다. 현재 막대는 목표 기준이며 실제 점수는 결과물 검수 후 기록한다.

구조 충실도

4/5

편집 가능성

5/5

반응형

4/5

일관성

4/5

접근성

4/5

① Figma 결과 링크작업 완료 후 보기 링크와 프레임 이름을 기록한다.

② 전후 비교원본·수정본 이미지와 바꾼 이유를 기록한다.

③ 수치 검증폭, padding, gap, 대비, 컴포넌트 속성을 적는다.

④ 회고재사용할 규칙과 다음에 고칠 한 가지를 적는다.