기존
변경 후
인프런 페이지를 참고하여 최대한 비슷하게 구성
전체적인 레이아웃은 인프런 사이트를 참고하여 구조와 디자인을 비슷하게 맞추었습니다.
헤더 UI를 3단 구성으로 구현
UI를 1단, 2단, 3단으로 나누어 각 영역별 역할을 명확히 구분하였습니다.
페이지별 헤더 구성 조정
인프런처럼 페이지마다 헤더가 다르게 구성되도록 조정하였습니다.
로그인 상태에 따른 UI 변경 구현
인프런과 동일하게 로그인 전에는 ‘로그인’ 텍스트가 보이고, 로그인 후에는 장바구니와 프로필 이미지가 나타나도록 구성하였습니다.
로그인 버튼 클릭 → 로그인 성공 → 장바구니 + 프로필 버튼 노출 흐름으로 구현되었습니다.
‘메뉴’ 및 ‘언어 설정’ 기능은 추후 구현 예정
해당 기능은 아직 구현이 완료되지 않아, 클릭 시 "기능 준비 중"이라는 메시지가 출력되도록 설정했습니다.
푸터 영역 추가
인프런 사이트의 푸터 구성을 참고하여 유사한 형태로 제작하였으며, 회사 정보, 정책 링크, SNS 아이콘 등을 포함하여 실제 서비스에 가까운 형태로 구성하였습니다.