앱과 웹 화면을 설계하는 3가지 방법

화면 설계라고 하면 사용자가 이용하게 될 앱 또는 웹 화면을 기획하는 것을 말합니다. 그러나 조금 더 생각해 보면 앱/웹 화면은 서로 다른 의미를 가질 수 있다는 사실을 알 수 있습니다. 사용자에게 보이는 화면 그 자체, 앱/웹을 작동시키는 관점의 화면, 사용자의 경험을 형성하고 변화시키는 화면이 바로 그것입니다.

 

 

사용자에게 보이는 화면 그 자체

 

일반적으로 화면 설계라 하면 사용자에게 보이는 화면을 기획하는 것을 의미합니다. 이러한 부분은 상당히 디자인적 요소와 겹치기도 합니다. 그래서 이 유형의 화면 설계 기획자의 이전 직업이 디자이너였던 경우도 많습니다.

 

보통 이러한 기획 작업은 주로 웹에이전시에서 기획할 때 많이 합니다. 때로는 UI/UX라고 하기도 하지만 일부분은 맞고, 일부분은 엄밀히 보면 적절하지 않을 수도 있습니다.

 

사용자에게 보이는 화면에 대한 기획은 분명 사용자가 해당 앱/웹을 작동하기 위한 UI가 포함됩니다. 그러나 이는 목업 수준이고 정확히 작동의 의미를 갖지는 않습니다. 

 

그러나 서비에서 해당 기능의 로직이 완성되었다면 이를 연동하는 화면의 인터페이스 측면에서 해당 디자인은 적절히 UI가 될 수 있음은 자명합니다.

 

UX의 경우도 다소 복잡합니다. 분명 디자인된 화면의 정보는 사용자의 인지 시스템을 거쳐 특정한 경험을 형성하는 것을 맞습니다. 그러므로 UX가 됩니다.

 

그러나 사용자 인식이 수반된 시각적 자극물은 어느 것이든 경험에 영향을 미친다는 점에서 이를 앱/웹 비즈니스 측면의 UX라 하기에는 다소 무리가 따릅니다.

 

그러므로 이를 UX를 구성하는 디자인 요소로 넣을 수는 있지만 UX 기획이라 하기에는 어려울 것 같습니다. 

 

이 차이는 아래의 내용을 보면 더 명확해집니다.

 

 

앱/웹을 작동시키는 관점의 화면

 

사용자가 앱/웹을 이용하기 위한 화면의 컴포넌트들은 앱/웹 프로그램과 사람이 상호 소통하는 방법의 정의를 의미합니다. 그래서 이를 UI라 합니다.

 

문제는 화면에 버튼이 입력 창이 있기는 한데 실제 눌러도 이에 맞게 앱/웹이 작동하지 않을 때입니다. 작동하지 않는 앱의 버튼을 UI라 부를 수는 없을 것입니다.

 

이 논의에서 기존 운영하는 앱/웹에서 화면을 수정하는 화면 설계의 상황이라면 문제 될 것이 없을 수도 있습니다. 이미 작동하고 있고 이는 버튼을 위치를 바꾸든, 검색 입력 창의 색을 변화시키든, 클릭 항목을 조정하든 이는 서버를 통해 사용자의 이용 의도에 맞게 정보나 화면을 제공해 줄 것이기 때문입니다.

 

그러나 기존 운영 시스템이 없는 상태에서 개발을 하는 상황이라면 좀 더 생각을 해보아야 합니다. 추가로 기존 시스템이 있더라도 화면의 새로운 한 화면 설계가 기존 서버 프로그램이 처리할 수 없는 내용을 가지고 있다면 이를 생각해 보아야 합니다.

 

위의 기존 운영 시스템이 없는 상태에서 화면 설계가 된 경우, 기존 시스템이 있는 상태에서 화면 설계를 새로이 했는데 화면의 콘텐츠를 기존 시스템이 처리할 수 없는 경우, 두 케이스는 모두 화면 설계는 되어 있다는 공통점이 있습니다.

 

그러나 이 화면이 작동되기 위해서는 화면을 통해 받은 사용자 명령을 처리할 수 있는 서버 프로그램이 있어야 합니다. 문제는 기술적으로나 처리 과정 상 개발이 어렵거나 안 되는 상황이 있을 수 있다는 것입니다. 

 

이는 단지 데이터가 없거나, 처리를 위해 연동해야 하는 외부 시스템과 계약이 안되어 있는 상태이거나, 보안 때문에 처리에 시간이 걸리거나 하는 문제일 수도 있습니다.

 

아니면 명령이 처리는 될 수 있지만 프로그램 로직 상 화면 설계의 내용이 아니라 다른 추가 과정이 필요할 수도 있습니다. 이는 기존 설계된 화면과 화면사이 팝업이 필요하다던지 중간 화면이 필요하다던지 하는 방안이 필요할 수도 있습니다.  

 

 

사용자의 경험을 형성하고 변화시키는 화면

 

이 부분은 작동과 다른 기획적 분야입니다. 작동은 되더라도 사용자 경험은 다른 차원의 기준이 됩니다. 물론 작동이 안 된다면 사용자 경험이 최악의 앱/웹 될 것이기는 합니다.

 

사용자 경험이라 부르는 UX는 기본적으로 프로그램 로직이 아닌 사용자의 인지적 로직을 의미합니다.

 

디자인하고 프런트/백 엔드 개발을 하는 것은 화면의 구성과 프로그램 로직에 대한 작업입니다. 그러나 사용자 경험의 로직은 앱/웹 통해 이루어지는 사용자 내부의 정보 처리 로직에 대한 것을 의미합니다.

 

그런데 사용자의 내부 정보 처리 로직은 기획자가 알 수도 없고 프로그래밍할 수도 없습니다. 그래서 이를 검은 상자의 함수라고 부르기도 합니다.

 

이는 일종의 질문에 대해 인공지능(AI)아 대답하는 것을 분석하는 것과 비슷합니다.

 

정확히 알 수는 없지만 분명 인풋이 있으면 아웃풋이 있다는 것입니다. 그리고 이 입출력에는 어떤 규칙이 있다는 것은 분명합니다.

 

UX에서는 동일한 규칙이 나타나는 사용자 그룹을 활용하여 경험의 형성과 강화를 기획합니다. 물론 동일 그룹에 묶였다 해도 각 사용자들이 모두 같은 것은 아닙니다. 단지 동일한 앱/웹의 정보에 대해 오차 범위 내의 유사한 아웃풋의 사용자 그룹일 뿐입니다.

 

사용자의 경험을 형성하고 변화시키는 기획 측면의 화면 설계가 다른 두 화면 설계와 다른 근본적 차이는 바로 여기에 있습니다.     

 

 두 화면 설계가 사용자가 보게 되는 앱/웹 화면, 사용자에 의해 작동되는 앱/웹 화면 등 정적이냐 동적이냐 차이는 있지만 사용자 외적 로직과 구성의 설계를 의미한다면, 

사용자의 경험을 형성하고 변화시키는 기획 측면의 화면 설계는 사용자에게 보이는 화면 그 자체, 앱/웹을 작동시키는 관점의 화면 설계를 통해 만들어진 정보 체계가 사용자에게 전달되면서 형성되는 경험에 대한 사용자 내적 로직 설계라는 점을 의미합니다. 그래서 UX에는 인지 심리학적 요소가 많이 포함되어 있는 것입니다.