Kare kare görün.

Tweenshot bir elemanın animasyonunu kare kare yakalar. Hatalı kareyi işaretleyin ve AI'a verin.

Chrome'a ekle
Open
DesignDue Nov 6

Homepage hero

New headline, product shot and motion for the first fold.

JKAM72%

Kartın üzerine gelin

article.stream-card14 kare, 0 ile 433 ms arası

Değerlerini görmek için bir kare seçin.

Bir hover'dan hata kaydına dört adımda.

  1. Bir eleman seçin

    Sayfadaki herhangi bir şeye tıklayın ya da CSS seçiciyle bulun. Ok tuşları üst, alt ve kardeş elemanlara geçer.

    Bir proje panosunun üzerinde açık Tweenshot yakalama paneli; bir kart için Hover tetikleyicisi seçili.

  2. Her kareyi yakalayın

    Hover, odak, basılı tutma ve tıklamayı Tweenshot uygular. CSS, Web Animations ve GSAP tam zamanlarına ilerletilir; canvas ve sürükleme canlı kaydedilir.

    Kartın hover ve çıkış animasyonunun numaralı, zaman damgalı 27 karelik tablosu.

  3. Hatalı kareyi işaretleyin

    Kareler arasında gezinin, onion skin ya da fark görünümüyle karşılaştırın ve neyin yanlış olduğunu not alın.

    Editörde 100 ms'deki 3. kare; not eklenmiş, işaretli ve o karedeki CSS değerleri görünüyor.

  4. AI için kopyalayın

    Tablo bir Markdown spec ile birlikte gider: seçici, keyframe'ler, zamanlama ve her karenin CSS'i.

    AI için not ve kopyalanmaya hazır Markdown spec'in bulunduğu Spec sekmesi.

AI sohbetinize giden metin.

İşaretli kare, değerleriyle birlikte en başta gelir; düzeltme sorunun olduğu yerden başlar.

contact-sheet.png 
# Animation capture: `article.stream-card` 27 frames from 0 to 840 ms, hover by Tweenshot.The attached sheet shows every frame in reading order. ## Flagged frames- Frame #3 at 100 ms (enter): Shadow is already full  while the card has barely lifted.  transform: translate(0px, -1.84px)  box-shadow: 0 24px 40px -16px rgba(28, 27, 25, 0.32) ## Transitions  transform   360ms cubic-bezier(0.4, 0, 0.2, 1)  box-shadow  100ms ease-out
Bir panonun yakalanmış bölgesi; ok, numaralı adımlar, fosforlu kalem ve pikselleştirilmiş e-posta adresiyle işaretlenmiş.

Ekran görüntüleri de.

Görünen alanı, tam sayfayı, bir bölgeyi ya da tek bir elemanı yakalayın; paylaşmadan önce üzerine işaretleyin.

  • BölgeAltShiftR
  • Tam sayfaAltShiftF
  • Görünen alanKısayol atayın
  • ElemanKısayol atayın

Kalem, fosforlu kalem, ok, şekiller, metin, numaralı adımlar ve pikselleştirme. İşaretler orijinalden ayrı tutulur.

Hiçbir şey cihazınızdan çıkmaz.

  • Hesap yok, analiz yok, ağ isteği yok.
  • Yalnızca yakaladığınız sekmede ve yalnızca siz başlattıktan sonra çalışır.
  • Dışa aktarımlarda sayfa adresinin sorgu kısmı yer almaz. Spec'lerde form değerleri ve gizli bilgi gibi görünen öznitelikler maskelenir.
Gizlilik politikasını okuyun

Chrome'dan istedikleri

activeTab
Yalnızca yakalamayı başlattığınız sekmeyi yakalamak
scripting
Seçiciyi ve yakalama panelini o sekmeye yüklemek
tabCapture offscreen
O sekmenin görüntüsünü yerel olarak kare kare okumak
downloads
Dışa aktarımları İndirilenler klasörüne kaydetmek
storage unlimitedStorage
Ayarları ve son yakalamaları bu cihazda tutmak

Hatalı kareyi yakalayın.

Chrome'a ekle

Ücretsiz. Chrome, Edge, Brave, Arc ve Opera'da, 116 ve üzeri sürümlerde çalışır.