HAJAE_ELOG

관련 수업 정리 자료 [코드스테이츠 PMB 11기] #W4D3 #수업정리, Wireframe & Prototype 와이어프레임 (Wireframe) 화면 설계서, 화면 청사진이라고 불리는 와이어프레임은 실제 GUI디자인이 입혀지기 전, 페이지의 골격을 확인하기 위해 만드는 시각적 산출물을 뜻한다. 앱이나 웹 등 IT hajae-elog.tistory.com 과제) 선정한 앱 또는 웹 서비스에 개선이 필요한 UX를 분석하고 페이퍼 프로토타입을 제작해 보세요. 이번 과제는 앱 또는 웹 서비스 1개를 선택해 해당 서비스가 가지고 있는 Flow에서 UX 개선이 필요한 부분을 서비스 이용자 관점에서 정의 및 분석한다. 그리고 이를 바탕으로 어떻게 UI를 개선할 수 있는지에 대해 페이퍼 프로토타입을 제작하는 과제다..

와이어프레임 (Wireframe) 화면 설계서, 화면 청사진이라고 불리는 와이어프레임은 실제 GUI디자인이 입혀지기 전, 페이지의 골격을 확인하기 위해 만드는 시각적 산출물을 뜻한다. 앱이나 웹 등 IT 프로덕트를 개발할 때 필수적이며, 대부분의 스타트업에서는 Figma를 많이 사용한다. 와이어프레임은 만들고자 하는 서비스의 기능 및 화면의 초안을 PM 또는 기획자가 만들어야 커뮤니케이션이 수월하며, 텍스트로 전달될 시 커뮤니케이션 오류와 불필요한 커뮤니케이션 비용이 발생하기 때문에 이미지와 혼용해서 작성한다. 와이어프레임을 만드는 이유는 앱 또는 웹의 전체 서비스를 명확하게 예측할 수 있도록 돕고 팀 구성원에게 개발하려는 프로덕트가 어떻게 동작하고 어떻게 인터렉션 하는지 예측하기 위함이다. 또한, 개발..

사내 디자인 협업 툴을 여러 번 바꿨다. 최초엔 Zeplin을 쓰다가 중간에 Adobe XD를 쓰고, 지금은 Figma로 이전을 완료했다. 나도 관련이 있는 사람이라 Edit 권한을 가지고 사용하고 있으며, 확실히 익숙해지니까 간단한 작업은 Figma로 해버리는 지경에 이르렀다. 이번 인사 웹을 제작할 때에도 Figma를 메인으로 사용하였다. 원래는 기능 명세서든 요구사항 명세서든 제대로 된 문서화를 해서 전달해주는 게 정상이지만, 이번에 기획하는 웹은 너무나도 간단한 것이기 때문에 와이어프레임만 전해도 충분히 이해가 가는 수준이어서 다른 문서들은 작성하지 않았다. 물론, 배우는 시기다 보니까 많이 미숙해서 작성을 못한 것도 있다. 무튼, 같이 개발하는 직원과 회의를 진행하였고, 아래의 기능이 있으면 좋..