스마트폰이 생긴 이후, 모바일 웹 수요가 늘어났습니다.
처음에는 모바일용 웹페이지를 따로 만들었지만 점차 반응형이라는 개념이 생겼고 결국 하나의 웹사이트로 모든 경우를 대응할 수 있는 반응형이 대세가 되었습니다.
구글은 모바일 친화적인 웹사이트에 SEO 우선순위를 더 주기 떄문에 검색 상위 노출을 생각한다면 반응형 개발이 꼭 필요합니다.
하지만 저는 오메가박스 프로젝트를 하면서 반응형을 포기해야 했습니다.
이유는 아이러니하게도 사용자 편의성 부족 때문이었습니다.
날짜, 영화, 상영관, 시간 옵션을 사용자가 편하면서 능동적으로 선택할 수 있게 만들기 힘들었기 때문입니다.
PC버전에서는 이처럼 한 화면에서 네 가지 옵션을 선택할 수 있습니다.
다만 반응형으로 제작시 옵션들이 지나치게 밑으로 떨어지기 때문에 편의성이 떨어집니다.
이를 반응형에 어울리는 형태로 변경하면 다음과 같은 UI가 됩니다.
이러한 화면이라면 충분히 반응형으로 만들 수 있습니다.
문제는 사용자가 처음 선택하고 싶은 옵션이 영화라면 어떨까요?
영화관 선택 옵션을 처음 보여준다면 극장을 먼저 고르고 싶을 때 문제가 생길 것입니다.
이를 실제 메가박스에선 어떻게 해결했을까요?
다음과 같이 어떤 선택을 먼저할 지 고르는 페이지를 하나 더 넣었습니다.
이러면 어느정도 문제가 해결되겠네요.
하지만 이런 구성으로 웹을 제작하면 PC 이용자는 어떨까요?
PC버전으로 제작한 화면에선 한 페이지에서 유동적으로 선택을 할 수 있는 반면
상영관 or 영화선택 페이지 -> 날짜 & 상영관 -> 영화 -> 시간 순으로 페이지를 넘어가야 합니다.
저는 끝내 PC 유저와 모바일 유저 모두를 만족시킬 수 있는 은탄환을 찾지 못했습니다.
따라서 프로젝트를 반응형으로 만들지 않고 PC버전 위주로 제작했습니다
(고민하느라 시간이 더 촉박해졌고, 처음 생각보다 늘어난 모바일 버전의 많은 페이지를 전부 구현할 시간이 부족했습니다).
이번 프로젝트를 통해 사용자 편의성을 생각할 경우 반응형 웹이 좋은 선택이 되진 않을 수 있다는 점을 배웠습니다.
If you like this blog or find it useful for you, you are welcome to comment on it. You are also welcome to share this blog, so that more people can participate in it. If the images used in the blog infringe your copyright, please contact the author to delete them. Thank you !