직무교육 10회차 과제 - [유데미x스나이퍼팩토리] UI/UX 디자이너 인턴형 프로그램 과정

 

10회차 과제

메인화면 UI디자인 시안 도출

 

메인 페이지(미완)

11월 10일 금요일 실습시간 내내 메인 페이지와 디자인 스타일을 제작하는데에 몰두했다.

메인컬러를 선정하는 단계에서 kt가 왜 쨍한 민트컬러보다 약간 탁한 느낌의 민트컬러를 사용했는지 알 수 있었다.

쨍한컬러를 사용하게 될 경우 한 두 번 보기엔 예뻐보여도 자주 사용하는 사용자들의 경우 눈이 피로해져 거부감이 들 수 있을 것 같다.

UX와 UI간의 적절한 타협을 통해 원래 내가 생각했던 밝은 컬러보다는 눈이 더 편한 기존의 컬러를 사용하기로 결정했다.

 

UX라이팅을 적극 적용하게 될 타이틀 영역은 다른 텍스트로 대체할 예정이고, 그 아래에 등급과 잔여포인트의 디자인을 고민중이다.

바로 뒷배경은 현재는 메인컬러로만 되어있는데 기존 kt멤버십 앱처럼 일러스트적 요소를 배치할 예정이다.

 

아이콘의 경우 글래스모피즘이 적용된 아이콘을 직접 제작하여 사용했다.

이런 스타일의 아이콘은 처음 제작해보는거여서 아직 완성도가 낮아보이지만 여러차례 수정을 거쳐 완성도를 높일 것이다.

 

배너는 안정적으로 배치하고자했고 아래에는 순서대로 <혜택 브랜드 랭킹>, <마들랜>, <자사 서비스 혜택(지니뮤직, 블라이스, 기프티쇼)> 섹션을 배치했다.

 

최하단의 메뉴바는 카카오페이앱의 메뉴바를 벤치마킹하여 디자인해보았다.

다만 카카오페이의 경우 메뉴바 아이콘이 면으로 되어있는데 나는 선를 사용했다.

검색 아이콘을 면으로 처리할 방법을 고민하던중 차라리 메뉴바 아이콘을 모두 선으로 표현하는게 낫겠다고 판단했다.

이 부분은 확정된 부분이 아니므로 나중에 바뀔 가능성이 있다.

 

메뉴바 바로 위에는 바코드 조회 및 내통장결제 버튼이 fix된 형태로 존재한다.

앱 접속시 바로 바코드조회로 이동하는 경우가 많아서 이 버튼은 홈 화면에서만 적용되고 메뉴바의 다른 페이지에서는 보이지 않게 할 예정이다.