[우주적 베이글샵 개발일지 #03] 게임 메인 화면 UI 디자인 — '예쁜 화면'과 '읽기 쉬운 화면' 사이에서

들어가며

안녕하세요, 우주적 베이글샵 아트 파트를 맡고 있는 권지은이에요.

 

이번 주에는 게임의 메인 접속 화면 작업을 진행했어요.

메인 배경부터 UI 요소, 화면 레이아웃까지 전체적인 비주얼 작업을 담당했어요.

 

이 글에서는 어떤 방향으로 메인 화면을 만들었는지, 그리고 작업 과정에서 어떤 고민이 있었는지 공유해보려고 해요.

---

이번 주 목표

우주적 베이글샵은 심장병을 앓고 있는 주인공이 직접 우주를 탐험할 수 없어, 자신이 만든 하우스 로봇에 의식을 연결해 외계 행성을 돌아다니는 이야기예요.

 

그래서 메인 화면의 목표는 단순히 '예쁜 화면'이 아니었어요.

플레이어가 첫 화면을 보자마자 "지금 내가 로봇의 몸에 접속한 상태구나"를 자연스럽게 느끼게 하는 것.

여기에 게임의 분위기와 세계관까지 첫 화면 하나로 전해지도록 잡는 게 이번 주 목표였어요.

실제로 한 것

1. 메인 접속 화면 스케치

<이미지: 메인 화면 스케치>

먼저 메인 화면의 전체 구도와 요소 배치를 스케치했어요.

 

주인공이 로봇에 접속한 상태라는 설정을 표현하기 위해 미래적인 인터페이스와 다양한 화면 요소들을 배치했고, 화면 전체가 하나의 시스템처럼 느껴질 수 있도록 구성했어요.

2. 1차 시안 제작

<이미지: 메인 화면 1차 시안>

스케치 피드백을 바탕으로 실제 색감과 UI 요소를 적용한 1차 시안을 제작했어요.

 

메타버스 접속 화면이라는 컨셉에 맞춰 푸른색 홀로그램 느낌을 중심으로 작업했고, 로봇 메시지 창과 여러 화면 요소들을 추가해 미래적인 분위기를 표현했어요.

 

또한 일부 요소엔 흐림 효과를 줘서 화면에 입체감도 살렸고요.

3. 팀 피드백 반영 및 최종 수정

<이미지: 메인화면 최종 시안>

대면 회의에서 의견을 여럿 받았어요. 여기서 나온 수정 포인트는 이랬어요.

• 아이콘이 더 잘 보이도록 선 두께 조정
• 메인 화면 요소들의 위치와 크기 수정
• 환경 설정 버튼과 전원 버튼 추가
• 전체 색감 재조정

실제 플레이 상황에서도 한눈에 보기 쉽도록, 가독성을 중심으로 여러 부분을 수정했어요.

---

막힌 부분 또는 변경된 점

이번 작업에서 제일 어려웠던 건 '보기 좋은 화면'과 '읽기 쉬운 화면' 사이의 균형이었어요.

 

미래적인 분위기를 살리려고 요소를 계속 더하다 보니, 화면에 담기는 정보가 많아졌어요.

손봐야 할 레이어도 그만큼 늘었고요.

 

문제는, 요소가 많아질수록 화면이 복잡해 보이고 정작 중요한 정보가 눈에 안 들어온다는 점이었어요.

그래서 요소 하나하나의 위치와 크기를 여러 번 옮기고, 색감과 아이콘 두께를 조정하면서 균형을 맞춰 나갔어요.

 

지금도 계속 다듬는 중이에요.

목표는 분명해요. 플레이어가 정보를 쉽게 확인하면서도, 게임의 분위기는 충분히 느끼는 화면.

 

다음 주 계획

다음 주에는 메인 화면 작업에 이어 실제 게임 플레이와 연결되는 주문 화면 작업을 진행할 예정이에요.

 

현재는 주문 화면의 기본 구조를 제작하고 있으며, 메인 화면에서 사용했던 디자인 요소들을 동일하게 적용해 전체적인 분위기가 자연스럽게 이어질 수 있도록 작업하고 있어요.

 

또한 플레이어가 게임을 진행하는 동안 필요한 정보를 쉽게 확인할 수 있도록 화면 구성을 계속 다듬어 나갈 예정이에요.

 

앞으로도 게임의 세계관과 플레이 경험이 자연스럽게 연결될 수 있도록 작업을 이어갈 계획이에요.

 

Tip. UI에서 '멋'과 '가독성'이 부딪힐 땐, 요소를 더하기보다 위치·크기·대비를 먼저 조정해 보세요. 정보 우선순위가 잡히면 분위기는 오히려 또렷해져요.