FC매니저 모바일은 PC연동 온라인게임에서 독립한 모바일 축구 시뮬레이션 게임으로 PC게임과는 차별화된 게임 비주얼 아이덴티티를 만드는 것을 목표로 시작하였습니다.

축구 전략 모바일게임 GUI/UX 디자인

  • 비주얼 컨셉 정의, Graphic Design, Logo Design 

  • UI/UX Design, Interaction Design

  • 기간 : 6개월

  • 작업인원 : 9명 (기획 3명, 디자인 3명, 개발 3명)

  • 참여도 : 정책수립 및 기획 30%, 디자인 70%

FCMM은 PC버전의 온라인 게임 FCM에서 출발하였습니다. PC게임의 연동 버전에서 독립한 모바일 축구 시뮬레이터를 신규 개발하여, FCM과 차별화되고 새로워진 아이덴티티가 요구되었습니다.

게임 UI 기획과 디자인 방향성 수립

경기 룰과 선수 영입 및 선수단 구성 등 축구 매니저에게 필요한 정보들의 배치와 중요도 등을 고려하여 게임 정책 및 UI 기획에 참여하였습니다. GUI 디자인 단계에서는 기획자와 협업하여 축구를 좋아하는 사용자에 맞춘 UX로 최적화하였습니다.

카드를 연상할 수 있는 모서리가 둥근 사각형을 모티브로 잡았으며, 축구경기 방송 인터페이스를 접목시켜 디자인 하였습니다. 디스플레이가 약 5인치였기 때문에 선수의 정보를 앞, 뒷면으로 나누어 제공하기로 했습니다. 선수 기본정보는 카드 앞면에서, 매니저가 확인해야 하는 선수 능력치나 전략, 전술과 관련된 정보는 카드를 뒤집어 뒷면을 활용하기로 하였습니다.

기획, 개발자와의 협업 과정

일반적인 모바일 앱과는 작업과정 및 개발 언어가 달랐기 때문에, 인터랙션, UI 가이드, 리소스 배포 등 지속적인 협의가 필요했습니다. 게임의 특성을 더 살려야 하기 때문에 OS의 기본 가이드를 준수하되 시각적인 표현에 더 집중했습니다.

  • 축구 매니지먼트 게임의 특성 및 경쟁사 게임 그래픽 인터페이스 분석

  • 기존 PC버전의 축구매니지먼트 게임 유저들의 데이터 기반 게임 컨셉 및 기획 논의

  • 축구를 좋아하는 3040 남성 유저를 타겟으로, 축구 방송의 톤앤매너를 게임에 반영

  • 기획 단계에서 실제 선수 사진 리소스 제작, 디자인 : 게임 컨셉에 맞는 그래픽 인터페이스 구현

  • 모바일 사용성 및 개발구조에 맞춘 인터페이스 디자인 : 디자이너 + 개발자 지속적인 협업

디자인 과정

감독 광장(홈 화면) 디자인

게임하기 앞서 확인할 정보들이 모여 있는 화면입니다. 나의 팀과 상대 팀 정보를 대조하여 확인할 수 있습니다. 리그의 종류별로 팀의 랭킹을 확인할 수 있으며 감독은 랭킹에 표시된 팀을 매칭하여 경기를 진행할 수 있습니다.

경기 진행과 종료

방송과 유사한 중계화면을 표현하고 모바일 최적화된 2D화면을 구현하였습니다. 감독의 축구 매니지먼트가 중요하기 때문에 선수의 모습이 경기중에 보이는 것보다는 경기하는 플레이어가 구분될 수 있도록 최소한의 GUI로 디자인하였습니다.  

선수 실제 모습 대신 유니폼을 단순하게 표현하여 선수 입장을 구성하며, 선수카드를 입장순으로 표출함으로써 현재 출전한 선수와 능력치, 컨디션 등을 소개합니다. 상대 감독은 해당 선수들의 능력치, 컨디션을 확인하면서 선수 교체 등 전술을 변경할 수 있습니다.

경기가 끝나면 경기결과를 표시합니다. 대기 상대 팀과 자동 또는 수동 매칭 가능하며, 준비가 완료되면 다음 경기를 시작합니다. 팀별 성적 비교, 승패 표시, 시간대별 골 플레이어 등 실제 방송의 경기 결과와 유사한 무드를 표현하였습니다.

선수카드 디자인

신규 회원으로 등록하면 신입 감독으로 데뷔하게 됩니다. 신규 회원들에게 초기 선수 카드, 프리미어 리그 패키지 카드 등이 제공되고, 기본 레벨로 경기와 선수관리를 시작할 수 있도록 합니다. 선수카드는 앞, 뒷면으로 구성되며 앞면에는 몸값이나 레벨 등을 표출합니다.

뒷면을 회전하면 선수의 상세 능력치와 포지션 등의 정보를 표출합니다.

선수는 능력치를 강화하거나 컨디션을 관리할 수 있습니다. 컨디션이 나쁘거나 능력치가 작은 선수는 벤치에서 회복시키고, 포인트와 카드를 이용하여 선수의 능력치를 포지션에 맞게 집중적으로 강화하는 기능을 구현하였습니다. 감독은 선수의 컨디션이 완전히 회복될 때까지 다른 선수들로 배치하여 더 전략적인 경기를 진행할 수 있습니다.

결과

2014년 모바일 게임 1위 달성 (스포츠 게임 분야 1위, 2014년 2월 구글플레이스토어 무료게임 1위)

FC매니저 모바일은 PC연동 온라인게임에서 독립한 모바일 축구 시뮬레이션 게임으로 PC게임과는 차별화된 게임 비주얼 아이덴티티를 만드는 것을 목표로 시작하였습니다.

축구 전략 모바일게임 GUI/UX 디자인

비주얼 컨셉 정의, Graphic Design, Logo Design 

UI/UX Design, Interaction Design

기간 : 6개월 / 작업인원 : 9명 (기획 3명, 디자인 3명, 개발 3명)

참여도 : 정책수립 및 기획 30%, 디자인 70%

FCMM은 PC버전의 온라인 게임 FCM에서 출발하였습니다. PC게임의 연동 버전에서 독립한 모바일 축구 시뮬레이터를 신규 개발하여, FCM과 차별화되고 새로워진 아이덴티티가 요구되었습니다.

게임 UI 기획과 디자인 방향성 수립

경기 룰과 선수 영입 및 선수단 구성 등 축구 매니저에게 필요한 정보들의 배치와 중요도 등을 고려하여 게임 정책 및 UI 기획에 참여하였습니다. GUI 디자인 단계에서는 기획자와 협업하여 축구를 좋아하는 사용자에 맞춘 UX로 최적화하였습니다.

카드를 연상할 수 있는 모서리가 둥근 사각형을 모티브로 잡았으며, 축구경기 방송 인터페이스를 접목시켜 디자인 하였습니다. 디스플레이가 약 5인치였기 때문에 선수의 정보를 앞, 뒷면으로 나누어 제공하기로 했습니다. 선수 기본정보는 카드 앞면에서, 매니저가 확인해야 하는 선수 능력치나 전략, 전술과 관련된 정보는 카드를 뒤집어 뒷면을 활용하기로 하였습니다.

기획, 개발자와의 협업 과정

일반적인 모바일 앱과는 작업과정 및 개발 언어가 달랐기 때문에, 인터랙션, UI 가이드, 리소스 배포 등 지속적인 협의가 필요했습니다. 게임의 특성을 더 살려야 하기 때문에 OS의 기본 가이드를 준수하되 시각적인 표현에 더 집중했습니다.

  • 축구 매니지먼트 게임의 특성 및 경쟁사 게임 그래픽 인터페이스 분석

  • 기존 PC버전의 축구매니지먼트 게임 유저들의 데이터 기반 게임 컨셉 및 기획 논의

  • 축구를 좋아하는 3040 남성 유저를 타겟으로, 축구 방송의 톤앤매너를 게임에 반영

  • 기획 단계에서 실제 선수 사진 리소스 제작, 디자인 : 게임 컨셉에 맞는 그래픽 인터페이스 구현

  • 모바일 사용성 및 개발구조에 맞춘 인터페이스 디자인 : 디자이너 + 개발자 지속적인 협업

디자인 과정

감독 광장(홈 화면) 디자인

게임하기 앞서 확인할 정보들이 모여 있는 화면입니다. 나의 팀과 상대 팀 정보를 대조하여 확인할 수 있습니다. 리그의 종류별로 팀의 랭킹을 확인할 수 있으며 감독은 랭킹에 표시된 팀을 매칭하여 경기를 진행할 수 있습니다.

경기 진행과 종료

방송과 유사한 중계화면을 표현하고 모바일 최적화된 2D화면을 구현하였습니다. 감독의 축구 매니지먼트가 중요하기 때문에 선수의 모습이 경기중에 보이는 것보다는 경기하는 플레이어가 구분될 수 있도록 최소한의 GUI로 디자인하였습니다.  

선수 실제 모습 대신 유니폼을 단순하게 표현하여 선수 입장을 구성하며, 선수카드를 입장순으로 표출함으로써 현재 출전한 선수와 능력치, 컨디션 등을 소개합니다. 상대 감독은 해당 선수들의 능력치, 컨디션을 확인하면서 선수 교체 등 전술을 변경할 수 있습니다.

경기가 끝나면 경기결과를 표시합니다. 대기 상대 팀과 자동 또는 수동 매칭 가능하며, 준비가 완료되면 다음 경기를 시작합니다. 팀별 성적 비교, 승패 표시, 시간대별 골 플레이어 등 실제 방송의 경기 결과와 유사한 무드를 표현하였습니다.

선수카드 디자인

신규 회원으로 등록하면 신입 감독으로 데뷔하게 됩니다. 신규 회원들에게 초기 선수 카드, 프리미어 리그 패키지 카드 등이 제공되고, 기본 레벨로 경기와 선수관리를 시작할 수 있도록 합니다. 선수카드는 앞, 뒷면으로 구성되며 앞면에는 몸값이나 레벨 등을 표출합니다.

뒷면을 회전하면 선수의 상세 능력치와 포지션 등의 정보를 표출합니다.

선수는 능력치를 강화하거나 컨디션을 관리할 수 있습니다. 컨디션이 나쁘거나 능력치가 작은 선수는 벤치에서 회복시키고, 포인트와 카드를 이용하여 선수의 능력치를 포지션에 맞게 집중적으로 강화하는 기능을 구현하였습니다. 감독은 선수의 컨디션이 완전히 회복될 때까지 다른 선수들로 배치하여 더 전략적인 경기를 진행할 수 있습니다.

결과

2014년 모바일 게임 1위 달성 (스포츠 게임 분야 1위, 2014년 2월 구글플레이스토어 무료게임 1위)

FC매니저 모바일은 PC연동 온라인게임에서 독립한 모바일 축구 시뮬레이션 게임으로 PC게임과는 차별화된 게임 비주얼 아이덴티티를 만드는 것을 목표로 시작하였습니다.

축구 전략 모바일게임 GUI/UX 디자인

비주얼 컨셉 정의, Graphic Design, Logo Design 

UI/UX Design, Interaction Design

기간 : 6개월 / 작업인원 : 9명 (기획 3명, 디자인 3명, 개발 3명)

참여도 : 정책수립 및 기획 30%, 디자인 70%

FCMM은 PC버전의 온라인 게임 FCM에서 출발하였습니다. PC게임의 연동 버전에서 독립한 모바일 축구 시뮬레이터를 신규 개발하여, FCM과 차별화되고 새로워진 아이덴티티가 요구되었습니다.

게임 UI 기획과 디자인 방향성 수립

경기 룰과 선수 영입 및 선수단 구성 등 축구 매니저에게 필요한 정보들의 배치와 중요도 등을 고려하여 게임 정책 및 UI 기획에 참여하였습니다. GUI 디자인 단계에서는 기획자와 협업하여 축구를 좋아하는 사용자에 맞춘 UX로 최적화하였습니다.

카드를 연상할 수 있는 모서리가 둥근 사각형을 모티브로 잡았으며, 축구경기 방송 인터페이스를 접목시켜 디자인 하였습니다. 디스플레이가 약 5인치였기 때문에 선수의 정보를 앞, 뒷면으로 나누어 제공하기로 했습니다. 선수 기본정보는 카드 앞면에서, 매니저가 확인해야 하는 선수 능력치나 전략, 전술과 관련된 정보는 카드를 뒤집어 뒷면을 활용하기로 하였습니다.

기획, 개발자와의 협업 과정

일반적인 모바일 앱과는 작업과정 및 개발 언어가 달랐기 때문에, 인터랙션, UI 가이드, 리소스 배포 등 지속적인 협의가 필요했습니다. 게임의 특성을 더 살려야 하기 때문에 OS의 기본 가이드를 준수하되 시각적인 표현에 더 집중했습니다.

  • 축구 매니지먼트 게임의 특성 및 경쟁사 게임 그래픽 인터페이스 분석

  • 기존 PC버전의 축구매니지먼트 게임 유저들의 데이터 기반 게임 컨셉 및 기획 논의

  • 축구를 좋아하는 3040 남성 유저를 타겟으로, 축구 방송의 톤앤매너를 게임에 반영

  • 기획 단계에서 실제 선수 사진 리소스 제작, 디자인 : 게임 컨셉에 맞는 그래픽 인터페이스 구현

  • 모바일 사용성 및 개발구조에 맞춘 인터페이스 디자인 : 디자이너 + 개발자 지속적인 협업

디자인 과정

감독 광장(홈 화면) 디자인

게임하기 앞서 확인할 정보들이 모여 있는 화면입니다. 나의 팀과 상대 팀 정보를 대조하여 확인할 수 있습니다. 리그의 종류별로 팀의 랭킹을 확인할 수 있으며 감독은 랭킹에 표시된 팀을 매칭하여 경기를 진행할 수 있습니다.

경기 진행과 종료

방송과 유사한 중계화면을 표현하고 모바일 최적화된 2D화면을 구현하였습니다. 감독의 축구 매니지먼트가 중요하기 때문에 선수의 모습이 경기중에 보이는 것보다는 경기하는 플레이어가 구분될 수 있도록 최소한의 GUI로 디자인하였습니다.  

선수 실제 모습 대신 유니폼을 단순하게 표현하여 선수 입장을 구성하며, 선수카드를 입장순으로 표출함으로써 현재 출전한 선수와 능력치, 컨디션 등을 소개합니다. 상대 감독은 해당 선수들의 능력치, 컨디션을 확인하면서 선수 교체 등 전술을 변경할 수 있습니다.

경기가 끝나면 경기결과를 표시합니다. 대기 상대 팀과 자동 또는 수동 매칭 가능하며, 준비가 완료되면 다음 경기를 시작합니다. 팀별 성적 비교, 승패 표시, 시간대별 골 플레이어 등 실제 방송의 경기 결과와 유사한 무드를 표현하였습니다.

선수카드 디자인

신규 회원으로 등록하면 신입 감독으로 데뷔하게 됩니다. 신규 회원들에게 초기 선수 카드, 프리미어 리그 패키지 카드 등이 제공되고, 기본 레벨로 경기와 선수관리를 시작할 수 있도록 합니다. 선수카드는 앞, 뒷면으로 구성되며 앞면에는 몸값이나 레벨 등을 표출합니다.

뒷면을 회전하면 선수의 상세 능력치와 포지션 등의 정보를 표출합니다.

선수는 능력치를 강화하거나 컨디션을 관리할 수 있습니다. 컨디션이 나쁘거나 능력치가 작은 선수는 벤치에서 회복시키고, 포인트와 카드를 이용하여 선수의 능력치를 포지션에 맞게 집중적으로 강화하는 기능을 구현하였습니다. 감독은 선수의 컨디션이 완전히 회복될 때까지 다른 선수들로 배치하여 더 전략적인 경기를 진행할 수 있습니다.

결과

2014년 모바일 게임 1위 달성 (스포츠 게임 분야 1위, 2014년 2월 구글플레이스토어 무료게임 1위)