UI&UX
- 나만의집 서비스 로고로, 클릭 시 메인 화면으로 이동할 수 있습니다.
- 로그인 화면으로 이동할 수 있는 버튼입니다.
- 인테리어 상품 리스트를 카테고리별로 묶어서 보여줍니다.
- 비회원은 좋아요, 개인 맞춤 추천 받기 기능을 사용할 수 없습니다.
비회원이 해당 기능 클릭 시, 위 그림과 같이 로그인이 필요함을 알립니다.
- 회원가입을 위해 먼저 공간, 가족형태, 평수를 입력받습니다. 공간, 가족형태의 경우 dropbox를 이용해 특정 선택지만 선택 가능하도록 하였습니다.
- 저희 서비스는 이메일 주소로 로그인을 진행하기 때문에, 이메일 주소를 입력받습니다. [이메일 확인] 버튼을 클릭하면 이메일 중복 확인과 형식 확인을 진행할 수 있습니다.
- 이메일이 고유하고 형식이 올바르다면 아래 그림과 같이 문구가 변경되고, [Next!] 버튼이 활성화됩니다.
- [Next!] 버튼을 클릭하면 아래 페이지로 이동합니다.
1. 사용자가 어떤 선택을 얼만큼 해야하는지 파악하기 쉽도록 설명하는 부분입니다. 마음에 드는 이미지를 최소 5개 선택해야함을 페이지에 명시하여 불편함을 덜고자 하였습니다.2. 이곳에 인테리어 이미지들이 표시됩니다. 마음에 드는 이미지를 선택하면 4번 영역 우측에 몇 개의 이미지를 선택했는지 표시하였습니다.
3. 2번 영역에 마음에 드는 이미지가 없거나, 더 많은 이미지를 보고 싶다면 클릭하는 부분입니다. 사용자가 몇 개의 이미지를 선택한 뒤 해당 버튼을 클릭하면 취향에 더욱 맞는 이미지들이 출력됩니다. 사용자가 5번 이상 [다음 상품들 보기 >] 버튼을 클릭한다면, 버튼이 아래 그림과 같이 변경됩니다.
4. 이미지를 5개 이상 고르면 이 영역을 클릭할 수 있습니다. 이미지를 모두 골랐다면 이 부분을 클릭해 회원가입을 완료할 수 있습니다. 회원가입을 완료하면 이미지를 더 이상 고를 수 없으므로, 확인 메시지를 띄운 뒤 회원가입을 완료합니다.
- 회원가입 페이지에서 작성했던 이메일을 입력해 로그인을 진행합니다. 로그인 과정에서도 마찬가지로 이메일 형식이 올바른지 확인합니다.
- 아직 회원이 아니라면 회원가입 버튼을 클릭해 회원가입을 진행할 수 있습니다.
- 회원의 경우 좋아요 기능을 사용할 수 있습니다. 하트를 클릭하면 아래 그림과 같이 하트 아이콘이 변경됩니다.
- 1번에서 선택한 선호한 아이템들은 마이페이지에서 확인할 수 있습니다.
- [새로운 추천 받기] 버튼을 클릭하면 새로운 상품들을 확인할 수 있습니다. 선호하는 아이템에 하트를 클릭한 뒤 클릭하면 더욱 정밀한 추천 결과를 받아볼 수 있습니다. 새롭게 추천된 상품들을 쉽게 확인할 수 있도록, 아래 그림과 같이 상단에 노출시켰습니다.
- 페이지의 최상단으로 이동하는 버튼입니다.
- 서비스 이용을 완료하였다면 로그아웃 버튼을 클릭해 종료할 수 있습니다.
- 상품의 더 상세한 정보를 확인할 수 있습니다.
- 디테일 페이지 내에서도 선호도를 표현할 수 있습니다.
- 디테일 페이지 하단에서는 해당 상품과 관련된 상품들을 볼 수 있습니다. 3번 영역에는 클러스터링 과정을 통해 같은 클러스터로 묶인 상품들이 보여집니다.
- 이 영역에는 같은 판매자가 판매하는 같은 카테고리 상품들이 보여집니다.
- 이 영역에는 같은 카테고리에서 인기 있는 상품이 보여집니다.
- 마이페이지에서는 클릭하면 이전에 눌렀던 선호하는 상품들을 한 번에 확인할 수 있습니다.
- 로딩 페이지
- 기능 중 약간의 시간이 소요되는 경우 로딩 페이지를 통해 서비스가 문제 없이 작동하고 있음을 나타냈습니다.
- 메뉴바와 새로운 추천받기 버튼 고정
- 서비스 이용 중 상단 메뉴바에 언제든 접근할 수 있도록 고정시켰습니다.
- 새로운 추천 받기 버튼도 페이지 어디에서든 클릭할 수 있도록 스크롤을 내려도 고정될 수 있도록 하였습니다.