bbborang 님의 블로그

요구사항 분석 및 요구사항 정의서(PRD) Product Requirements Document = 제품 요구사항 정의서 요구사항 분석은 프로젝트나 제품 개발의 핵심 과정으로, 개발팀이 어떤 제품을 만들 것인지를 명확히 정의하는 단계요구사항을 구체적으로 파악하고, 이를 문서화하여 각 팀(개발, 디자인, QA 등)이 동일한 목표를 가지고 작업할 수 있도록 공유PRD는 요구사항을 체계적으로 정리한 문서로, 프로덕트 개발 과정에서의 지침서 역할을 함이 문서가 잘 작성되면 개발 팀은 물론, 이해관계자들 간의 커뮤니케이션을 원활히 하고 프로젝트 진행이 명확해짐 요구사항 정의서(PRD) 작성 방법 제품이나 서비스에서 제공해야 할 구체적인 기능들을 나열함기능 이름 : 기능의 이름기능 설명 : 해당 기능이 어떤 역할을..

1. PV (Page View, 페이지뷰)사용자가 웹사이트 또는 앱 내에서 특정 페이지를 조회한 횟수동일한 사용자가 같은 페이지를 여러 번 새로고침해도 PV는 증가PV는 방문자 수와 관계없이 페이지가 얼마나 많이 조회되었는지를 나타내는 지표2. UV (Unique Visitor, 순 방문자)특정 기간 동안 웹사이트나 앱을 방문한 중복되지 않은 개별 사용자 수같은 사람이 여러 번 방문해도 하루 동안은 1명의 UV로 계산3. DAU (Daily Active Users, 일간 활성 사용자)하루 동안 특정 서비스에 방문하거나 특정 액션을 수행한 사용자 수 4. WAU (Weekly Active Users, 주간 활성 사용자)일주일 동안 특정 서비스에서 활동한 사용자 수DAU의 주간 버전으로, 주 단위 사용자 충..

1. 데이터 드리븐 기획 사용자 행동 데이터, 시장 데이터, 성과 데이터 등을 기반으로 의사결정을 내리고 제품을 기획하는 방식 우리 서비스에서 사람들이 실제로 어떤 행동을 하는지 데이터로 확인하고데이터를 분석해서 문제를 찾고객관적인 근거를 바탕으로 해결책을 기획 2. 데이터 드리븐 기획이 중요한 이유- 정확한 기획이 가능- 고객이 원하는 것을 제대로 알 수 있음- 비즈니스 성과 극대화 3. 데이터 드리븐 기획 단계 문제 정의 → 데이터 수집 및 분석 → 가설 수립 및 실험 → 결과 분석 및 데이터 기반 의사결정 → 지속적인 개선 4. 데이터 드리븐 기획의 실제 사례 ex) 넷플릭스 사례 넷플릭스는 완결률, 정지 및 시작 시간, 시청 시간대, 시청 패턴(예: 일시 정지, 빨리 감기, 되감기 등) 같은 데이..

Framer에서 만들어지는 모든 것들은 Frame에서 출발한다. stack = 특수한 frame 화이트 리스트(Whitelist) : 접근이 기본적으로 차단된 상태에서 안전하다고 검증되어 예외적으로 허용된 대상이나 승인된 목록블랙리스트(Blacklist) : 기본적으로 모두 허용하되 문제가 되는 대상만 차단(서로 반대되는 개념)

Webflow: 설계도와 건축 구조를 세밀하게 잡을 수 있는 전문 건축 도구Framer: 빠르게 예쁜 쇼룸을 만들고 시연하기 좋은 도구Bubble: 내부 기능이 복잡한 업무용 시스템을 만들기 좋은 도구Zapier: 건물을 짓는 도구가 아니라, 여러 시스템을 연결하는 자동화 배선 도구 - Framer의 강점빠른 프로토타입 제작Figma와 유사한 쉬운 사용성인터랙션과 애니메이션 표현빠른 랜딩 페이지 제작과 배포MVP나 포트폴리오 제작 프로토타입 완성도는 보통 아이디어 스케치 수준에서 실제 작동하는 제품 수준으로 올라가는 흐름 비유하면, 카페를 만든다고 할 때: 페이퍼 프로토타입종이에 “여기에 메뉴판, 여기에 주문 버튼”처럼 그려보는 단계가장 빠르고 저렴하게 아이디어를 확인가능실제 클릭이나 동작은 없고, 구조..

User Flow 권장 도구: Miro, FigJam, draw.io, Figma Wireframe 권장 도구: Figma, 구글 스티치 특히!!!구글 Stitch -> 모바일 앱 디자인 / 와이어프레임 제작에 굉장히 유용한 tool 이라고 느꼈다. 프롬프트를 입력한뒤 보내면 AI가 와이어프레임을 생성해주는데각 퍼널별로 우클릭하면 Copy as 가 나오는데이게 진짜 대박이었다. Copy as Code -> 구현된 와이어프레임 코드를 직접 따낼 수 있음Copy as Figma -> 피그마로 옮겨서 내가 원하는대로 수정가능Copy as PNG -> PNG 사진파일로 복사하기 쌉가능