COPYRIGHT © SK PLANET CO.Framer Interactions목록이 없습니다.
최조 진입 시 설정중인 영상 재생
활용영역 : 동영상 자동 재생, 메인페이지 스크롤
https://framer.cloud/gsHkO재생 버튼을 탭하면 플레이어가 실행 플레이어에서 접기 버튼을 눌러 FAB 형태의 미니 플레이어로 전환
활용영역 : FAB, 재생리스트 플레이어간 전환
https://framer.cloud/ArHoR스크롤시 이름과 상단 버튼은 고정되고 탭은 자연스럽게 스크롤 되다가 상단에 고정. 하단 메모를 탭하여 메모 리스트로 이동 또는 메모하기를 눌러 새로운 메모 페이지로 전환
활용영역 : 연락처, 메모화면, 헤더네비게이션
https://framer.cloud/RRRhM스크롤 시 검색바가 올라가고 BIZ연락처 보기와 편집 할 수 있는 영역과 인덱스 영역이 고정. 하단 네비게이션을 통해 최상단으로 이동
활용영역 : 연락처, 검색바 배치, FAB, 하단 알림영역
https://framer.cloud/Uqbmu스위치 토글로 업무 연락처 on/off 애니메이션 되고 탭 영역 상단에 고정. 탭 이용하여 하단 페이지 전환. 메모하기 버튼을 눌러 페이지 이동
활용영역 : 연락처, 모드변환, 헤더/탭메뉴 고정화면
https://framer.cloud/uDPcsFAB를 탭하면 바 알림 형태로 애니메이션 되고 알림 숫자가 있는 경우 탭을 하면 상세 화면으로 전환
활용영역 : 메인 페이지, FAB, 알림창
https://framer.cloud/UQYSW진입시 FAB등장 애니메이션. FAB버튼 액션을 통해 리스트 필터링 인터랙션
활용영역 : 연락처, FAB, 상태알림 토스트
https://framer.cloud/XFCyT하단 네비게이션을 통해 연락처, 최근통화, 다이얼, 설정 페이지로 이동. 특정화면(다이얼)을 제외한 다른화면은 T ARS FAB 배치
활용영역 : 네비게이션, 하단메뉴, FAB
https://framer.cloud/tQYrACustom Module(StickyHeaders)을 활용하여 스크롤시 특정 높이값에 반응하여 탭영역이 상단에 고정
활용영역 : 메인 페이지
https://framer.cloud/dYWKT페이지 스크롤시 배경 이미지의 사이즈 애니메이션을 통한 연결성있는 애니메이션을 구현하여 사용자에게 명확한 피드백을 제공한다
활용영역 : 컨텐츠 피드 리스트
https://framer.cloud/ErvaT카드 탭시 하위 댑스가 현재 위치에서 확장 후에 스크롤 기능 추가
활용영역 : 컨텐츠 피드 리스트 / 메인 페이지
https://framer.cloud/XOpyf개별카드 선택후 페이지로 확장되고 스크롤 가능
활용영역 : 컨텐츠 피드 리스트 / 메인 페이지 / 상세페이지
https://framer.cloud/HIApg여러개의 카드리스트중 개별 카드선택후 페이지로 확장
활용영역 : 컨텐츠 피드 리스트 / 메인 페이지
https://framer.cloud/reGRi하단 끝까지 스크롤시 배경 이미지를 다르게 노출
활용영역 : Footer / 브랜딩 영역
https://framer.cloud/xWgjp5초 간격으로 하단 카드 노티 애니메이션 / 스크롤하여 카드 내용 확인후에는 애니메이션 정지
활용영역 : 메인페이지 / 노티피케이션
https://framer.cloud/hwQUM페이지 스와이핑 인터랙션과 페이지별 스크롤 적용
활용영역 : 메인페이지 / 컨텐츠 피드 리스트 / 페이징
https://framer.cloud/QUzQz페이지 변환시 백그라운드 이미지 트렌지션 / 앨범 이미지 탭시 페이징
활용영역 : 뮤직 플레이어 / 이미지 갤러리 / 배너 페이징
https://framer.cloud/qbPOm페이지 변환시 백그라운드 컬러 트렌지션
활용영역 : 메인비주얼 배너 / 이미지 갤러리 / 페이징
https://framer.cloud/QVcLQ더보기 버튼 선택 후 Scrollable Drawer 메뉴 노출
활용영역 : 메인페이지 / 드로어메뉴 / 설정 / 필터UI
https://framer.cloud/sSOlv스크롤 시 FAB버튼 축소 / 최상단으로 스크롤시 FAB버튼 확장 / 스테이터스바 탭시 최상단으로 스크롤 이동
활용영역 : FAB / 탭버튼
https://framer.cloud/dXxgLBackdrop UI 인터랙션 / 메뉴 버튼 탭시 해당영역이 확장되면서 메뉴 노출 / 필터 버튼 탭시 필터 메뉴로 변경
활용영역 : Backdrop UI / 컨텐츠 피드 리스트
https://framer.cloud/FabAWBackdrop UI 인터랙션 / 메뉴 버튼 탭시 해당영역이 확장되면서 메뉴 노출 / 컨텐츠 가로 스크롤
활용영역 : Backdrop UI / 컨텐츠 피드 리스트
https://framer.cloud/jcfSK매터리얼 2.0 UI중 Backdrop UI형태에서 피드 컨텐츠의 가로스크롤
활용영역 : 컨텐츠 피드 리스트 / 가로 스크롤
https://framer.cloud/UMeoI화면 진입시 순차적인 2x2 컨텐츠 생성을 애니메이션으로 구현
활용영역 : 컨텐츠 피드 리스트 / 메인화면 컨텐츠 구성
https://framer.cloud/CeiIs화면 진입시 리스트를 배열로 생성하고 시차적용된 애니메이션으로 구현
활용영역 : 컨텐츠 피드 리스트 / 연락처
https://framer.cloud/RpTfr마이크 버튼 탭을 활용한 랜덤한 사이즈의 원형파동 애니메이션 시작/정지 컨트롤
활용영역 : 음성입력 피드백, 레코딩 피드백
https://framer.cloud/TAivsFlowComponent를 활용하여 간단하게 화면간 이동 구현 / Utils.modulate를 이용해 상단 텍스트, 이미지에 스크롤 Y값과 연동되는 애니메이션 적용
활용영역 : 메인페이지 / 상세페이지 / 메뉴이동 / 스크롤 인터랙션
https://framer.cloud/nRUYq버튼 탭을 활용하여 이퀄라이저 애니메이션 시작/정지 컨트롤
활용영역 : 이퀄라이저 / 음성재생
https://framer.cloud/TGDys스크롤에 따른 상, 하단 네비게이션바연동 이미지 패럴랙스 애니메이션 (modulate 사용) / Statusbar 영역 터치시 특정 위치로 스크롤 화면 이동
활용영역 : 메인페이지 / Bottom Navigation
https://framer.cloud/OdbKG메인화면 스크롤 패턴과 하단 바에 bottomSheet 모듈을 적용하여 스와이프하여 끌어올리기 가능
활용영역 : 컨텐츠 피드 리스트 / 메인페이지 / Bottom Sheet / Category List
https://framer.cloud/zetyq탭바 모듈을 활용하여 상단 메뉴바 네비게이션 구성. 탭선택에 따라 하단 화면의 스크롤이동
활용영역 : 서브탭메뉴 / 페이징 / UI Flow
https://framer.cloud/VKDBi메인 화면 컨텐츠 구성. 배너 영역 페이징과 검색창 고정 및 페이지 스크롤
활용영역 : 컨텐츠 피드 리스트 / 페이징 / 메인 페이지
https://framer.cloud/qPiZn패럴랙스 스크롤 패턴, 택스트와 배경을 분리하여 시간차를 두고 움직임. 상단바 탭시 최상단으로 이동
활용영역 : 컨텐츠 피드 리스트 / 메인 페이지
https://framer.cloud/bDrNm음악 리스트에서 뮤직플레이어 화면으로 이동. 뮤직 플레이어의 컨트롤 기능 포함(슬라이더, 이전, 다음 등)
활용영역 : 뮤직서비스, 플레이어
https://framer.cloud/BnZeL진입 시 음악 재생 이전곡/다음곡 가능 뮤직 리스트 탭시 해당 노래 재생
활용영역 : 뮤직서비스, 플레이어
https://framer.cloud/rgdGR스크롤시 스크롤 Y값에 따른 배경 이미지 애니메이션
활용영역 : 상세화면
https://framer.cloud/vvVaY스프라이트 이미지를 활용한 로딩 애니메이션, 로딩 후에 다음 페이지로 이동
활용영역 : Splash, Loading 화면
https://framer.cloud/Sgkso플로팅 액션 버튼(FAB) 탭시 메뉴 확장
활용영역 : FAB, 메인화면, 네비게이션
https://framer.cloud/lyFIZ스크롤시 배너 이미지 요소가 화면 밖에서 안으로 이동
활용영역 : 메인화면, 배너
https://framer.cloud/Isvzm이미지가 벗겨지는 트랜지션 적용. 페이지에 따라 하단 바 길이 애니메이션
활용영역 : 메인화면, 배너, 페이징
https://framer.cloud/eDKyR이미지와 배경을 분리하여 트랜지션 적용
활용영역 : FAB, 메인화면, 네비게이션
//codepen.io/ugen/embed/MRMZvW화면 영역 탭시 다음 스크린으로 이동. 뒤로가기 버튼 탭시 이전페이지로 이동
활용영역 : 화면단위 Flow 확인
https://framer.cloud/wkZiYAppbar+기본 화면 스크린 구현
활용영역 : 메인화면, 서브화면, 컨텐츠 피드 리스트
https://framer.cloud/oDSkN페이지 스와이프와 탭메뉴 항목 터치로 컨텐츠 영역 이동
활용영역 : 메인화면, 서브화면, 탭메뉴
https://framer.cloud/GsTEt하트 탭시 피드백 애니메이션 적용
활용영역 : 좋아요, 하트 버튼 터치피드백
https://framer.cloud/wocaT스플래시 배경 렌덤으로 노출. 5초간 배경 애니메이션 진행후, 홈화면 진입
활용영역 : 스플래시 화면
https://framer.cloud/dVLZa북마크 탭시 피드백 애니메이션 적용. 토글버튼 형태의 컨텐츠 저장 인터랙션
활용영역 : 북마크 저장, 찜하기
https://framer.cloud/MLuOdFramerX Interactions목록이 없습니다.
Lottie Interactions목록이 없습니다.
탭을 시작하면 지문인식 형태의 애니메이션 시작, 엔드하면 애니메이션 정지 / 애니메이션이 모두 완료되면 다음 페이지로 이동
활용영역 : 인증관련 화면 / 결제화면
https://framer.cloud/HgyUQ햄버거 메뉴에서 뒤로가기로 트랜지션 구간 애니메이션 / 전체화면 메뉴 노출
활용영역 : 햄버거 메뉴 / 카테고리 메뉴
https://framer.cloud/uaTem일러스트 파일을 에프터이펙트에서 Shape 레이어로 변경 / Shape레이어를 스케일 애니메이션 적용
활용영역 : 스플래시 / 일러스트 Shape 활용
https://framer.cloud/qecgA라인 애니메이션을 활용한 스플래시 / 하단 버튼 탭시 Pause/Stop 컨트롤
활용영역 : 스플래시 / 플레이어
https://framer.cloud/phpva에프터이펙트로 만든 애니메이션 Lottie json파일을 모듈을 활용하여 프레이머에서 테스트 가능하게 제작
활용영역 : 스플래시 / 애니메이션
https://framer.cloud/vvVaY