글

라벨이 UIUX기획인 게시물 표시

피그마와 화면설계서 차이, 기획 문서 이렇게 바뀐다

이미지
피그마와 화면설계서 차이, 기획 문서 이렇게 바뀐다 피그마와 화면설계서 차이, 기획 문서 이렇게 바뀐다 IT 기획 · 서비스기획 · 2026.08 기준 작성 피그마로 기획 화면을 작성하고 리뷰 시간에 피그마 링크를 공유했더니, 옆에 있던 PM이 "그럼 화면설계서는 언제 나오나요"라고 물어본 적이 있습니다. 화면을 이미 다 보여줬는데 왜 별도 문서가 또 필요하냐는 질문이었습니다. 이 질문에 제대로 답하지 못하면 결국 두 문서를 이도저도 아니게 만들다가 시간만 낭비하게 됩니다. 오늘은 피그마와 화면설계서가 근본적으로 어떻게 다른지, 그래서 기획 문서 체계를 어떻게 다시 짜야 하는지 정리해보겠습니다. 📌 목차 피그마와 화면설계서는 애초에 만들어진 목적이 다르다 실제 사례: 피그마 링크 하나로 개발팀에 넘겼다가 벌어진 일 두 문서를 가르는 기준: "보여주는 것"과 "정의하는 것" 실무 팁 3가지 마무리 FAQ 피그마와 화면설계서는 애초에 만들어진 목적이 다르다 피그마는 디자인과 프로토타이핑 툴입니다. 화면이 어떻게 보이는지, 화면 사이를 어떻게 이동하는지를 시각적으로 보여주는 데 강점이 있습니다. 이해 관계자에게 서비스의 인상을 빠르게 전달하고 싶을 때 피그마만큼 효율적인 수단은 없습니다. 반면 화면설계서는 전통적으로 그 화면 뒤에 있는 로직을 텍스트로 정의하는 문서였습니다. 이 버튼을 눌렀을 때 어떤 조건이면 어떤 결과가 나오는지, 값이 비어있을 때는 어떻게 처리하는지, 권한에 따라 무엇이 달라지는지 같은 내용입니다. 건축에 비유하면 피그마는 조감도에 가깝고, 화면설계서는 시공 도면에 가깝습니다. 조감도만 보고는 배관이 어디로 지나가는지, 벽이 하중을 어떻게 견디는지 알 수 없습니다. 화면도 마찬가지로, 보이는 모습만으로는 그 안의 동작 조건까지 다 담을...

기획자라면 꼭 알아야 할 어도비 XD 실무 기능 6가지

이미지
기획자라면 꼭 알아야 할 어도비 XD 실무 기능 6가지 “디자인은 디자이너 몫?” 아니요, 요즘 기획자는 XD까지 써야 잘 나갑니다. 기능만 알면 생각보다 쉽거든요. 안녕하세요! 요즘은 기획서 작성 시 다양한 툴을 사용합니다. PPT, Figma 등 기획서를 작성하고 디자이너에게 디자인 요청한 후 수정이 필요한 경우가 많습니다. 디자이너에게 매번 '이거 위치 조금만 바꿔주세요', '여기 버튼 하나만 더 넣어주세요' 요청하다가 직접 XD를 배우기 시작했어요. 그리고 놀랐죠. 이거 생각보다 기획자가 쓰기 너무 좋은 거예요! 굳이 디자인 전문 지식 없어도, 논리적인 구조만 있으면 손쉽게 인터랙션까지 구현할 수 있더라고요. 오늘은 제가 실무에서 가장 많이 쓰는 XD 기능 6가지를 엄선해서 소개해드릴게요. 기획자는 '이 정도만' 알아도 충분히 활용할 수 있습니다! 목차 1. Repeat Grid: 반복되는 UI 만들기 꿀기능 2. Prototype 탭: 인터랙션 연결은 이걸로 끝 3. Component States: 버튼 상태 한 번에 관리 4. 문자 스타일 저장: 텍스트 관리가 쉬워진다 5. 앵커 링크: 한 페이지 내 점프 구현 6. 공유 & 피드백 기능: 실시간 협업의 핵심 1. Repeat Grid: 반복되는 UI 만들기 꿀기능 리스트, 카드, 게시판 등 반복되는 요소 만들 때 유용한 기능입니다. 예전에는 하나하나 복사 붙여넣기 하느라 손이 아팠다면, Repeat Grid 는 한 번만 만들면 자동으로 복제해줘요. 실무에서는 사용자 리스트, 상품 카드 등 ‘같은 구조 다른 내용’일 때 자주 사용됩니다. 2. Prototype 탭: 인터랙션 연결은 이걸로 끝 기획자가 XD를 쓰는 가장 큰 이유 중 하나가 바로 프로토타입 기능입니다. Prototype 탭에서 화면 간 흐름을 연결하면 ...