|
|
검색어를 다 치기도 전에 결과를 보여주는 실시간 자동완성으로 편의성을 극대화했습니다.
클릭 시 도감 팝업으로 직행하여 검색한 정령의 정보(예장&나들이&트루엔딩)를 보여줍니다.
단순 텍스트가 아닌 투명한 유리 질감(Glassmorphism)과 깜빡이는 초록색 불빛(Ping 효과)을 넣어 "사이트가 살아있다"는 생동감을 주었습니다.
가로 스크롤 카드 형태이며, "D-Day 배너"를 자동 계산해 붙여주어 에버스톤을 모을 시간을 직관적으로 알 수 있습니다.
공간 효율을 위한 자동 롤링(Carousel) 방식과 1~3위 특별 컬러 강조로 랭킹 보는 재미를 살렸습니다.
EVERTALK AI
재미삼아 구현한 기능이며, 메인화면 오른쪽 하단 대화 아이콘을 누르면 대화창에서 에버소울 3대 오퍼레이터와 간단하게 대화를 해보실 수 있습니다 :)
📒2. 정령 도감 (기존 '정령조회' 페이지)
가장 많이 쓰일 기능이기에 '찾기 쉬움'과 '정보의 완결성'에 집중했습니다.
필터링 시 카드 배경색과 테두리가 각 종족의 상징색(인간-주황, 불사-보라 등)으로 바뀌어 시각적 만족도를 높였습니다.
페이지 이동 없이 [트루 엔딩 선택지], [예장/유물 세팅] 등 핵심 공략을 탭으로 구분했습니다.
에버소울 모든 정령들을 한 번의 클릭으로 확인이 가능합니다.
💘3. 인연 선물 계산기 (핵심 유틸)
선물 기준은 "행운의 꽃다발" , "영원꽃" 을 제외한 (1월 14일 기준 행운의 꽃다발, 영원꽃도 가능) 선호선물과 비선호선물로 선물할때 (20pt vs 15pt)를 기준으로 토글 스위치로 빠르게 변경 가능하며, 에버서치에 가입된 분은 데이터가 서버에 저장됩니다.
따로 로그인하지 않아도 계산은 가능하나, 모든 정령을 전체적으로 관리하고싶으신 분들은 로그인하여 저장하시면 됩니다.
단순 개수 계산을 넘어, "이만큼 주면 다음 레벨은 호감도 몇 점으로 시작합니다"까지 미리 보여주어 효율적인 선물 분배가 가능합니다.
📚4. 공략 & 팁 게시판
썸네일이 없어도 예쁜 타이포그래피(글자) 중심의 카드 디자인을 적용했습니다.
카테고리별 배지 색상으로 가독성을 높였습니다.
현재 4개의 카테고리로 분류되어 있고 각 항목을 누를 시 빠르게 확인이 가능합니다.
📮5. 문의 및 건의 (관리자 시스템)
관리자가 답변을 달면 [답변 완료] 배지와 파란색 강조 박스로 신뢰감을 줍니다.
문의 게시판을 보시는건 누구나 확인이 가능하며, 회원가입이 되신 분들만 문의 게시판에 글을 작성하실 수 있습니다.
🔐6. 회원 시스템 (Seamless)
페이지 이동 없이 현재 화면 위 팝업(Modal)으로 로그인이 진행되어 탐색 흐름이 끊기지 않습니다.
회원가입 시 닉네임/아이디/비밀번호를 입력합니다.
닉네임은 로그인 시 상단 UI에 표시되는 이름이며, ID/PW는 로그인 시 사용됩니다.
상단 UI에 닉네임을 누르시면 '내 정보'를 볼 수 있고, 해당 창에서 비밀번호 변경이 가능합니다.
여기까지 리뉴얼이 어떻게 진행되었는지 소개하는 시간이였습니다.
기본적인 기능은 전부 구현이 완료되었으니, 이제는 사소한 디테일과 기능들이 더 추가될 예정입니다.
많은 방문 부탁드리며 추가했으면 하는 기능이나 버그가 발견되신다면 언제든 편하게 문의 부탁드립니다. 😄
감사합니다 ㅎㅎ
Eversearch Renewal Project
Developed by. 상한고구마
첫댓글 리액타입조합엔 레딕ui가 커스텀하기 좋죠 claude 로 만들었나보네요 라라벨에선 flux가 비슷한 ui셋임당
고맙다네!!! 정말 직관적이고 쉽게 데이터를 찾아볼 수 있게 만들어줘서 너무 유용할 것 같다네!! 앞으로 자주 이용하겠네!!