
요구사항 분석이 끝났다고 해서 바로 개발로 넘어갈 수 있는 것은 아니다. 실제로 사용자가 보게 될 화면을 어떤 흐름으로 설계할지, 어떤 방식으로 상호작용하게 만들지, 그리고 그 화면이 얼마나 좋은 품질을 가져야 하는지까지 정리되어야 비로소 다음 단계로 넘어갈 수 있다.
이번 글에서는 화면 설계 내용을 바탕으로, 화면 설계의 기본 개념부터 사용자 인터페이스의 종류, UI 설계 단계, 그리고 품질 요구사항까지 한 흐름으로 정리해보려 한다.
요구사항 분석이 완료되었다면, 이제 그 요구를 실제 사용자가 만나는 형태로 옮겨야 한다. 이때 필요한 것이 바로 화면 설계다. 화면 설계는 단순히 예쁜 화면을 그리는 일이 아니라, 사용자의 경험과 상호작용 방식을 구체적으로 설계하는 과정에 가깝다.
이 단계에서 먼저 알아두면 좋은 개념들이 있다.
UX(User Experience)는 사용자가 서비스나 제품을 사용하면서 느끼는 총체적인 경험을 뜻한다.HCI(Human Computer Interaction)는 그 UX를 더 잘 만들기 위해 사람과 컴퓨터의 상호작용을 연구하는 학문이다.감성 공학은 사용자의 감정과 감성에 맞춰 제품이나 서비스를 설계하고 제작하는 접근이다.결국 화면 설계는 단순한 배치 작업이 아니라, 사용자가 무엇을 보고 어떻게 느끼며 어떤 흐름으로 행동하는지까지 함께 설계하는 일이라고 볼 수 있다.
인터페이스는 서로 다른 두 시스템을 이어주는 컴포넌트를 뜻한다. 화면 설계에서 말하는 사용자 인터페이스는 사용자가 시스템과 상호작용하는 접점을 의미하며, 그 방식은 여러 가지로 나뉜다.
CLI(Command Line Interface)는 텍스트를 입력하는 방식의 인터페이스다.GUI(Graphic User Interface)는 그래픽 환경에서 버튼, 창, 아이콘 등을 통해 상호작용하는 방식이다.NUI(Natural User Interface)는 Drag, Pan, Flick, Pinch처럼 보다 자연스러운 행동 기반 상호작용을 말한다.VUI(Voice User Interface)는 음성을 통한 인터페이스다.화면 설계를 할 때 중요한 것은 이 중 무엇이 더 최신이냐가 아니다. 서비스의 목적과 사용자 맥락에 맞게 어떤 인터페이스를 선택할지 판단하는 것이 핵심이다. 어떤 환경에서는 여전히 CLI가 가장 효율적일 수 있고, 어떤 서비스는 GUI가 더 직관적일 수 있으며, 또 어떤 상황에서는 NUI나 VUI가 더 자연스러울 수도 있다.
UI는 한 번에 완성형으로 만들어지지 않는다. 사용자의 요구에 맞게 조금씩 구체화되며 발전해 나간다. 이 흐름을 이해하면 왜 와이어프레임과 목업, 스토리보드, 프로토타입이 각각 따로 존재하는지도 더 분명하게 보인다.
가장 처음 등장하는 것은 와이어프레임(Wireframe)이다. 말 그대로 화면의 뼈대를 손그림처럼 빠르게 잡아내는 단계다. 이 시점에서는 세부 디자인보다 구조와 배치가 더 중요하다.
![]() 와이어프레임 예시 |
|---|
그다음 단계는 목업(Mockup)이다. 와이어프레임보다 더 구체적이며, 실제 화면과 유사한 수준까지 시각적으로 만들어낸다. 다만 이 단계에서는 보통 실제 동작은 포함되지 않는다.
![]() 목업 예시 |
|---|
스토리보드(Story Board)는 여기서 한 단계 더 나아가, 디자이너와 개발자 사이의 소통 도구 역할을 한다. 단순히 화면 모양만 보여주는 것이 아니라, 콘텐츠 설명과 화면 이동 흐름, 기능 의도까지 상세하게 기록한다.
![]() 스토리보드 예시 |
|---|
프로토타입(Prototype)은 실제 인터랙션을 담은 동적인 형태의 모형이다. 와이어프레임이나 목업이 구조와 형태를 보여주는 단계라면, 프로토타입은 사용자가 화면을 눌렀을 때 어떤 반응이 이어지는지까지 확인하게 해준다.
유스케이스(Use Case)는 사용자 시나리오를 정리하는 방식이다. 사용자가 어떤 목표를 가지고 시스템에 접근하고, 그 과정에서 어떤 기능과 상호작용하는지를 설명한다. 화면 설계와 함께 보면, 단순히 예쁜 화면을 만드는 것이 아니라 사용자의 행동 흐름을 설계하는 일이라는 점이 더 분명해진다.
와이어프레임, 목업, 스토리보드, 프로토타입은 서로 대체 관계가 아니라, 점점 더 구체적인 설계 단계로 이어지는 흐름에 가깝다.
화면을 설계할 때 중요한 것은 보기 좋은 화면을 만드는 것에서 끝나지 않는다. 실제로 그 화면이 얼마나 잘 작동하는지, 얼마나 사용하기 쉬운지, 유지보수와 확장이 쉬운지 같은 품질 요구사항도 함께 고려되어야 한다.
대표적으로 ISO/IEC 9126은 소프트웨어 품질을 평가하기 위한 국제 표준이다. 여기서는 다음과 같은 품질 요소들을 본다.
기능성: 얼마나 올바르게 작동하는가신뢰성: 얼마나 오류 없이 작동하는가사용성: 사용자가 쉽게 이해하고 다시 사용하고 싶은가효율성: 얼마나 효율적으로 작동하는가유지 보수성: 수정과 확장이 쉬운가이식성: 다른 환경으로 옮기기 쉬운가이후 표준들도 이 흐름을 확장한다.
ISO/IEC 12119는 ISO/IEC 9126에 테스트 관점을 더한 형태로 볼 수 있다.ISO/IEC 25010은 ISO/IEC 9126을 확장하면서 호환성과 보안성을 추가로 강조한다.결국 화면 설계에서도 품질 요구사항은 선택 사항이 아니다. 보기 좋은 UI만으로는 충분하지 않고, 정확하게 동작하고, 오류 없이 유지되며, 사용자가 편하게 느끼는 화면이어야 실제 좋은 설계라고 할 수 있다.
좋은 화면 설계는 예쁜 시안을 만드는 데서 끝나지 않는다. 요구사항을 사용자의 경험으로 바꾸고, 그 경험을 점점 더 구체적인 설계 산출물로 연결하며, 마지막에는 품질 기준으로 점검하는 과정까지 포함한다. 그래서 화면 설계는 개발 전 단계의 부수 작업이 아니라, 제품의 방향과 완성도를 결정하는 중요한 설계 작업이라고 볼 수 있다.