라이브러리로 돌아가기

INSTAGRAM

Video by ab.workss

AB Babaei

Hightouch 홈페이지의 기존 디자인 언어를 유지하면서, AI 기반 마케팅 제작 과정을 여러 캠페인 결과물과 입력 인터페이스의 모션 시퀀스로 확장해 보여주는 웹 모션 쇼케이스다.

공개 지표

조회수
13,669정확한 값업데이트 지연
좋아요
975정확한 값업데이트 지연
댓글수
37정확한 값업데이트 지연

분석 메모

고정된 Hightouch 내비게이션과 ‘Marketing looks different here’라는 히어로 문구 아래에서 콘텐츠 제작 상태와 작은 이미지 타일들이 등장한다. 이어 여행 가방 광고와 투자 광고가 중앙의 완성형 크리에이티브로 확대되며, 마지막에는 분홍빛 배경 위 콘텐츠 전략 입력창으로 전환되어 데이터와 브랜드 지식을 캠페인 결과물로 바꾸는 흐름을 시각화한다.

원본 설명

Hightouch already uses motion in the hero to show what comes out of the product. We took those animations and expanded them into full 10-second sequences, showing more of what happens before you get to the result. We kept the existing design language and built on what was already there. And this isn’t just a concept video. We built it into a working version of the homepage so you can actually see the sequences where they were designed to live. Go check out the live version yourself. Link in bio 🔗 Music: @sem0r 👑 Sfx: @amir_rostami_musicallife 🔥

웹 모션 디자인AI 마케팅크리에이티브 생성 과정파스텔 그라데이션

영상 기법 메모

  • 고정 프레임 안의 상태 전환: 로고, 내비게이션, 헤드라인과 CTA를 고정해 브랜드 문맥을 유지하고, 하단 작업 영역의 콘텐츠만 교체하여 제품 내부의 연속적인 제작 과정처럼 보이게 한다. (00:00–00:36)
  • 타일 군집에서 완성 광고로의 확대: 작은 이미지 타일과 진행 상태를 먼저 보여준 뒤 선택된 여행 광고를 큰 중앙 카드로 확대해, 탐색·생성·결과의 인과관계를 한 화면에서 전달한다. (00:00–00:18)
  • 가로 이동과 색상 변화로 시퀀스 연결: 중앙 광고를 투자 소재로 교체하고 주변 카드를 화면 가장자리로 밀어낸 다음, 배경을 민트 계열에서 분홍 계열로 바꾸며 콘텐츠 전략 입력창 장면으로 자연스럽게 이어간다. (00:18–00:36)
원본 공개일
2026년 8월 18일
분석 기준일
2026년 8월 26일
리비전
1
러닝타임
00:36
원본 페이지 열기