포트폴리오로 돌아가기TYPOGRAPHY호버하여 재생
Interactive 3D atlas3DDENTAL ATLAS3D 아틀라스 열기
CodeLune Feature Lab
구현 가능한 기능 둘러보기
웹사이트와 웹앱에 적용할 수 있는 인터랙션을 작은 실험실처럼 공개합니다.
마우스를 올려 미리보기
24 FEATURES3DINTERACTION재생 미리보기
Orbit 3D CodeLune
3DSCROLL스크롤하여 그리기
Scroll draw CodeLune스크롤에 따라 윤곽선이 채워지는 3D 드로잉
3DPOINTER마우스를 움직여보고 클릭해보세요
Kinetic hierarchy마우스 이동과 클릭으로 변하는 계층형 장면
3DPARTICLES움직이고 눌러보세요
Rainbow particle cloud포인터 속도와 누르기에 반응하는 파티클 클라우드
3DIMAGE눌러서 이미지 바꾸기
Portfolio particle globe포트폴리오 썸네일이 파티클 구체로 변환됩니다
웹사이트를 만드는
CodeLune
Scramble headline브랜드 문구가 자연스럽게 전환되는 효과
Interactive 3D atlasCarlow Dental 3D atlas칼로우 덴탈 임플란트의 실제 3D 메인 화면
IMAGEGESTURE스크롤하거나 드래그하기
Heritage image surf휠과 드래그로 넘기는 3D 이미지 플레인
IMAGETRANSITION화살표로 넘기기
Image transition방향에 따라 들어오고 나가는 이미지 전환
IMAGESCROLL스크롤하여 확인
Scroll hide header스크롤 방향에 따라 헤더가 숨겨지고 나타나는 효과
IMAGEAUTOPLAY자동 재생
Autoplay image carousel진행 표시와 함께 자동 재생되는 이미지 캐러셀
IMAGETHUMBNAILS썸네일 선택
Thumbnail image viewer썸네일로 이미지를 선택하는 뷰어
IMAGEDRAG이미지를 밀어 넘기기
Swipe image stack맨 앞 이미지를 밀어 넘기는 카드 스택
BASE UIINTERACTIONAuth stack · 열기
Auth stack이메일 인증과 확인 코드 전환
BASE UIINTERACTIONConditional field · 열기
Conditional field조건에 따라 나타나는 입력 필드
BASE UIINTERACTIONScroll reveal · 열기
Scroll reveal스크롤 위치에 맞춰 텍스트를 표시
BASE UIINTERACTIONScramble · 열기
Scramble문구가 자연스럽게 전환되는 효과
BASE UIINTERACTIONCommand palette · 열기
Command palette검색과 단축키를 결합한 명령 팔레트
BASE UIINTERACTIONCopy button · 열기
Copy button복사 완료 상태를 보여주는 버튼
BASE UIINTERACTIONConfetti · 열기
Confetti완료 순간을 강조하는 축하 효과
BASE UIINTERACTIONRadial menu · 열기
Radial menu중심 버튼에서 펼쳐지는 방사형 메뉴
BASE UIINTERACTIONCreate grid · 열기
Create grid새 항목을 선택하는 생성 그리드
BASE UIINTERACTIONAnimate number · 열기
Animate number변경된 숫자를 자연스럽게 전환
BASE UIINTERACTIONMega menu · 열기
Mega menu서비스 탐색을 위한 확장 메뉴