인터페이스 애니메이션
HyperOS 공식 사이트 UI 모션 1
재질 클로즈업에서 휴대폰 UI로 들어간 뒤 같은 모서리와 투명 레이어를 아이콘, 위젯, 여러 기기로 확장한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Bolt Forge｜제품 출시
두 차례의 구체적인 요구로 제작 범위를 보여 준다. 프롬프트를 온전히 표시한 뒤 스크롤 가능한 웹 결과로 들어가고 마지막에는 여러 작품을 공간 퍼즐처럼 펼친다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Cyera Research Labs
로고, 색상, 글자 구조에서 브랜드 적용으로 이동하고 같은 부유 구체로 웹페이지와 메시지를 연결한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
그래픽 애니메이션
Universe 2023｜콘퍼런스 그래픽 공개
어둠 속 가는 윤곽에서 다채로운 기하 세계를 순간적으로 펼쳤다가 모든 요소를 중앙 로고로 모은다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
그래픽 애니메이션
Parallel Index — AI가 콘텐츠를 사용할 때 수익 받기
노드 구성으로 네트워크 변화를 설명한다. 열린 연결에서 새 방문자로, 단일 방문에서 대규모 트래픽으로 확장한 뒤 인덱스 로고로 모은다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
그래픽 애니메이션
행사 사전 홍보｜10만 달러 Make-a-thon
두 브랜드를 중앙에 놓고 참가자 말풍선을 주변에서 등장시킨다；참가자들의 응답으로 행사 예고를 이어 간다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Figma｜캔버스 안의 Agent
같은 제품에 제안, 스타일 적용, 콘텐츠 확장을 연속해서 수행한다. 각 결과를 서로 무관한 작품처럼 다루지 않는다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
텍스트 애니메이션
행사 공개｜Config Makeathon
도입부의 패턴과 글자로 행사 정체성을 알리고, 중간에는 작품들을 빠르게 보여 참가 결과물을 제시하며, 마지막에는 공개되었음을 알린다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Linear Diffs — Linear 안에서 코드 검토
변경 사항을 선택한 뒤 차이를 확인하고 댓글을 코드 행에 연결하며, 마지막에는 검토 제출을 명확히 표시한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Lovable · Slack에서 제작 시작
서로 다른 발신자의 메시지가 같은 스레드로 들어오고, 요청 뒤에 어시스턴트가 응답한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
→
처음에는 의문으로 정보의 간극을 만들고 웹사이트로 전환해 직접 확인한 뒤 원래 게시물로 돌아가 응답한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Notion Skills — 팀의 업무 방식을 에이전트에 가르치기
팀 공유와 로컬 내보내기를 두 배포 경로로 다루며 각각 팝업으로 설명한 뒤 사용 단계로 합친다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Higgsfield — 모션 디자이너를 위한 Cursor
캔버스와 하단 타임라인, 명령 영역을 항상 함께 표시해 제작 관계를 보여 준다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Higgsfield — 이제 ChatGPT 앱에서 플러그인 사용
플러그인과 스킬을 선택한 뒤 여러 도구를 활용하는 작업을 입력하고 실행 단계를 순서대로 표시한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Higgsfield API｜다중 모델 인터페이스
하나의 진입점에서 여러 모델에 연결한 뒤 다양한 제품 결과물로 이어 간다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Wide Research｜폭넓은 조사
하나의 입력을 여러 작업 패널로 나누고 가로와 깊이 방향으로 펼쳐 병렬 실행을 표현한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Manus Agents — 나만의 Manus, 이제 … 안에서도
어시스턴트는 원래 채팅 컨테이너 안에 있으며 소재를 보내면 결과 카드를 반환한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
실사 영상 편집
Sonnet 5.5 · 매크로 편집
곡선, 고리, 바늘처럼 비슷한 기하 형태를 장면 사이에서 맞춘다；이들은 서로 다른 소재이므로 같은 물체의 궤적으로 연결하지 않는다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Claude — Cowork와 Claude Code의 컴퓨터 사용
각 작업을 휴대폰 요청→데스크톱 실행→휴대폰 확인의 순환으로 구성한다. 같은 구성을 세 번 반복하되 내용을 발전시킨다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Gmail × Gemini
각 장은 이메일 맥락→조작→결과 순서로 진행하며 제목과 수신자의 연속성을 유지한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
텍스트 애니메이션
Gemini｜브랜드 워드마크 공개
기존 글자를 입자로 분해하고 방향성을 가진 흐름으로 이동시킨 뒤 새 이름으로 재구성한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Grok Build｜프로젝트 메모리
기록→탐색→나중에 읽기의 세 상태로 세션 간 메모리를 설명한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Emergent｜휴대폰에서 앱 만들기
성장 수치로 맥락을 만든 뒤 제작 진입점을 컴퓨터에서 휴대폰으로 옮긴다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
컴퓨터를 조작하는 Cursor
왼쪽 에이전트와 오른쪽 시뮬레이터를 한 화면에 놓고 제어 대상 앱 안에서 조작 결과를 보여 준다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Cursor Cloud Agents
각 기능은 검은 배경의 한 문장 메시지 뒤에 흰 배경의 짧은 조작을 붙여 규칙적 리듬을 유지한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Cursor · 휴대폰으로 컴퓨터 에이전트 제어
먼저 페어링을 승인하고 같은 메시지와 결과를 양쪽에 표시한다
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Perplexity Computer — 클라우드·로컬 하이브리드 컴퓨팅
민감 정보를 먼저 확인한 뒤 로컬 또는 클라우드 경로를 결정하며 두 실행 위치의 역할을 명확히 한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Apple｜기기 간 클립보드
휴대폰 텍스트는 입력 출처이고 컴퓨터 문서는 대상이다；주요 변화는 텍스트 선택과 붙여넣기에 있으며 기기 외곽은 거의 고정한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
이번 주 업데이트: Notes 이미지 지원
목록 전체를 읽을 수 있게 한 뒤 바탕 화면 오른쪽의 이미지를 메모 아래로 드래그한다. 파일은 커서를 따라가고 놓으면 이미지가 펼쳐지며 내용에 맞춰 메모 창 높이가 늘어난다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Bolt Template Marketplace｜템플릿 마켓
선택 가능한 템플릿 범위를 먼저 보여 준 뒤 탐색 가능한 전체 웹사이트 하나를 확대하고 마지막에 프롬프트로 다른 사업에 맞게 바꾼다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
그래픽 애니메이션
Creative Cloud｜주황 손그림 변형
주황·노랑을 주축으로 손그림, 액체, 튜브, 평면 꽃 사이를 빠르게 전환한다；곡선 윤곽으로 서로 다른 재질을 계속 연결한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
AI Labs｜인터페이스 요소
여러 조작 가능한 화면으로 맞춤 기능을 보여 주고 각 예시는 명확한 피드백으로 마무리한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Supabase 탐색기와 노트북
성장 차트로 제품을 소개한 뒤 조회, 저장, 자연어, 로컬 워크플로를 하나씩 입증하며 짧은 문구를 시연 중인 기능 옆에 둔다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Supabase — Gemini Enterprise 커넥터
한 번의 활성화로 데이터 소스를 대화에 연결한다. 메뉴 열기, 커넥터 켜기, 해당 데이터 소스 질문 입력 후 두 브랜드 조합으로 마무리한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.
인터페이스 애니메이션
Supabase Pipelines — 거의 실시간으로 분석 동기화
트래픽 부담을 먼저 시각화하고 대상 설정과 지속 동기화로 역할 분담을 설명해 제품 효과의 원인과 결과를 명확히 한다.
참고 영상만 제공되며, 편집 가능한 프로젝트는 포함되어 있지 않습니다.