Figma 입문과 사용자 시나리오

페이지·프레임·레이어를 구성하고 조사 근거에서 6컷 사용자 시나리오 만들기

이번 문서에서 만드는 것

2주에는 리서치와 병행하여 Figma의 페이지·프레임·레이어를 구분하고 사용자 상황을 여섯 장면으로 표현합니다. 완성된 UI를 모사하는 대신 “누가 어떤 상황에서 무엇을 하려는가”를 시각적으로 공유하는 것이 목표입니다.

Figma 계정에 로그인하고 팀 파일 편집 권한과 공유 링크 열기를 확인합니다. 1주의 문제 정의와 사용자 리서치 질문도 준비합니다. 권한 문제는 세션 전에 해결합니다.

아래 세션 신청 사례는 학습용 가상 예시이며 실제 조사 결과를 대신하지 않습니다.

Figma에서 새 디자인 파일을 만들고 이름을 LION-TRACK / 팀명 / 학습 기록으로 정합니다. 파일 안에 다음 페이지를 만듭니다. 페이지 수를 그대로 유지하는 것이 평가 기준은 아니며 팀이 찾기 쉽게 조정할 수 있습니다.

Frame 도구로 화면의 경계를 만들고 Text 도구로 제목을 넣습니다. Frame은 레이아웃과 화면의 기준이 되는 컨테이너입니다. Group은 여러 레이어를 묶는 용도로 사용할 수 있지만 화면 구조와 Auto Layout을 학습할 때 Frame과 구별합니다.

첫 프레임을 Scenario / 01 / 공지 발견으로 이름 짓고 복제합니다. Frame 123 대신 역할과 순서를 이름에 담습니다. 레이어 패널에서 텍스트가 어느 프레임의 자식인지 이동해 보며 확인합니다.

사용자 여정의 장면은 UI 화면과 일대일일 필요가 없습니다. 서비스를 사용하기 전의 상황과 사용 후의 결과도 포함합니다.

장면	가상 사용자 가람의 행동	생각·제약	확인할 근거
1	이동 중 세션 공지를 본다	휴대폰으로 짧게 확인	실제 공지 확인 상황
2	날짜·준비물을 찾는다	수업과 시간이 겹치는지 궁금	가장 먼저 확인한 정보
3	신청 가능 여부를 본다	마감 여부가 불명확하면 주저	멈춘 지점과 질문
4	필요한 정보를 입력한다	계정에 이미 있는 정보는 반복 입력하고 싶지 않음	실제 입력 항목·소요 시간
5	완료 여부를 확인한다	저장되었는지 확신이 필요	완료 후 실제 행동
6	세션 전에 다시 준비물을 연다	링크를 다시 찾기 어려울 수 있음	재방문 경로

각 프레임에 사람·상황·행동·생각을 한두 문장으로 적고 확인한 사실과 가정을 별도 색상뿐 아니라 [관찰], [가정] 텍스트로 표시합니다. 그림 실력보다 순서를 설명할 수 있는지가 중요합니다.

컴포넌트·Variant·Auto Layout의 세부 규칙은 5주 문서에서 이어갑니다. 이번 주에 모든 기능을 익힐 필요는 없습니다. 편집 권한이 없는 사람은 검토 가능한 권한으로 공유하고 개인정보가 담긴 조사 원본을 공개 파일에 붙이지 않습니다.

권장 90분: 도구 탐색 20분, 시나리오 작성 30분, 리서치 근거 연결 20분, 상호 설명 20분입니다. 사용자 리서치의 실제 인터뷰 시간은 별도 과제로 배정하거나 세션 시간을 늘려 진행합니다.

제출물은 Readme와 여섯 장면 링크, 가정 두 개와 확인 계획입니다. 완료 기준은 팀원이 화면 설명 없이 상황·목표·막히는 지점을 이해하고 실제 관찰이 없는 문장을 조사 결과처럼 쓰지 않는 것입니다.

주차·미션	참고 VOD 범위
2주 · Figma와 시나리오	PM 6장 / Figma 1장

PM은 ‘PM업무, 강의 하나로 정리하기’, Figma는 ‘Figma로 앱 디자인부터 포트폴리오까지’를 뜻합니다.

강좌 안내: 참고 강좌 1 · 참고 강좌 2. 이 문서는 영상 전체를 옮긴 전사 자료가 아닙니다. 세부 내용은 위 공식 문서에서 확인합니다.