Ürün videosundaki eskimiş arayüz ekran görüntüsü nasıl değiştirilir?
Ekran görüntüsü yeni. İmleç hâlâ eski düğmenin olduğu yere tıklıyor.
Videodaki ekran görüntüsünü değiştirirken bu tanıdık bir başarısızlıktır: görüntü dosyasını değiştirmek sınırları belli bakım işi gibi gelir. Kaynakta tek satır kod veya tek malzeme değişimi olabilir. Açıklamada ise o görüntü kamera kadrajlarına, işaretçi hareketlerine, etiketlere, anlatıma ve sonra gösterilen sonuca bağlıdır.
Dolayısıyla ekran görüntüsü kompozisyon içindeki resimden fazlasıdır. Koordinat sistemi ve ürün davranışı kaydıdır. İkisinden biri değiştiğinde etrafına kurulmuş animasyon dikkat gerektirir.
Ürün demosu ekran görüntüsünü güncellemenin verimli yolu, malzemeye dokunmadan önce bu bağımlılıkları belirlemektir. Bazı güncellemeler gerçekten basit değişimlerdir. Diğerleri yeni sahne gerektirir. Fark, arayüzün görünüşünün ne kadar köklü değiştiği değil, eski açıklamanın yeni ürüne hâlâ karşılık gelip gelmediğidir.
Değişikliği neyi bozduğuna göre sınıflandırın
Üç soruyla başlayın. Görsel düzen değişti mi? Kelimeler değişti mi? Görev değişti mi? Her birinin sonuçları farklıdır.
Tamamen dekoratif güncelleme, kontrol konumlarıyla davranışı korurken arka planı veya simge stilini değiştirebilir. Metin güncellemesi düğmeyi taşımadan “Publish”i “Share” olarak yeniden adlandırabilir ama anlatımla altyazılar artık değişmelidir. İş akışı güncellemesi, ekranın çoğu tanıdık görünse bile eski eylem-sonuç dizisini yanlış kılan onay adımı ekleyebilir.
Kategoriler örtüşebilir. Yeniden tasarlanan yan çubuk görevi taşıyabilir, yeniden adlandırabilir ve iletişim kutusu ekleyebilir. En önemli değişikliği başlangıç noktası alın. Senaryo hâlâ eski davranışı vaat ederken yeni kadrajı kusursuzlaştırmanın pek değeri yoktur.
Tek cümlelik değişiklik açıklaması yazın: “Export kontrolü sağ üst menüye taşındı; dışa aktarma davranışı aynı.” Bu cümle, ana gösterimi korurken işaretçi yoluna ve kadraja dönmenizi söyler. “Yayımlama artık izin seçimi gerektiriyor” sahnenin mantığını ve süresini yeniden düşünmenizi söyler.
İş akışı eşdeğerliğini yalnızca ekran görüntülerinden çıkarmayın. Görevi güncel üründe kaydedin veya yapın. Gerekli duruma erişemiyorsanız sınırı kaydedin ve yeniden kurulmuş arayüzü gerçek kayıt olarak sunmayın. İnandırıcı yedek ekran, videoyu güncel gösterirken talimatlarını daha az güvenilir yapabilir.
Sahnenin gerçekten ihtiyaç duyduğu durumu kaydedin
Ürünün ana sayfasından alınan ekran görüntüsü, görev atama sahnesine kendiliğinden uygun değildir. İlgili durumu yeniden üretin: seçili nesne, açık menü, girilmiş veri, izinler ve görünür sonuç. Görüntü, o anda söylenen veya gösterilen cümleyi desteklemelidir.
Konu başka dil gerektirmiyorsa İngilizce makale yazarken temsil edici İngilizce içerik kullanın. Kayıttan önce normal ürün kullanımıyla özel veriyi güvenli gösterim kaydıyla değiştirin. Önemli arayüz ayrıntılarının üstünü boyayıp sonra görüntüyü dokunulmamış ürün ekran görüntüsü diye adlandırmayın.
Yararlı çevre bağlamını koruyun. Görüntü kontrole yakınlaşacaksa kontrolün nerede olduğunu gösterecek kadar özgün arayüz kaydedin. İzleyicinin eylemi anlamak için gezinme yoluna veya seçili satıra ihtiyaç duyduğunu sonradan keşfettiğinizde, yalıtılmış düğme az seçenek verir.
Kayıt boyutlarını ve gösterim ölçeğini kaydedin. Yüksek yoğunluklu ekranda 1440 piksellik tarayıcı görüntü alanı, farklı piksel boyutlarında bitmap üretebilir. Yerleşim koordinatlarıyla görüntünün piksel koordinatları ilişkilidir ama kendiliğinden aynı değildir. Karıştırılmaları, animasyon hatası gibi görünebilen işaretçi kaymaları üretir.
Geçici yüklenme durumlarını, istemediğiniz araç ipuçlarını veya canlandırmayı planladığınız kontrolün üstünde duran sistem imlecini dahil etmeyin. Görünür imleç gerekiyorsa kayıtlı imleci veya animasyonun imlecini bilinçli kullanın. Bağımsız hareket eden iki işaretçi gösterimi izlemeyi zorlaştırır.
Ürün demosu ekran görüntüsüne neyin bağlı olduğunu inceleyin
Bir şey değiştirmeden önce projede eski malzeme adını arayın ve kullanan sahneyi inceleyin. O ekrana gönderme yapan kamera dönüşümünü, kadrajı, vurguları, okları, işaretçi koordinatlarını ve metni listeleyin. Malzeme üç sahnede kullanılıyorsa üçünü de denetleyin.
Kod tabanlı kompozisyonda bu, doğrudan bağımlılık izleme olabilir. Görüntü kaynağı, cursorTarget nesnesinden, kırpma dikdörtgeninden ve altyazı metninden ayrı olabilir. Katman tabanlı düzenleyicide bağlantılı üst katmanlarla anahtar kareleri denetlemek anlamına gelir. İlke aynıdır: malzeme güncellenince bağımlıları zorunlu olarak güncellenmez.
Basit eşleme tablosu eski hedefi, yeni hedefi ve amaçlanan eylemi içerebilir. Örneğin: “Eski: araç çubuğundaki Export düğmesi. Yeni: More menüsü, sonra Export öğesi. Amaçlanan eylem: mevcut tasarımı indirmek.” Bu, tek tıklamanın iki tıklamaya dönüştüğünü gösterir. Eski imleç animasyonunu yeniden kullanmak güncel görevi gösteremez.
Sonraki planları da inceleyin. Yeni dışa aktarma kutusu mevcut dosya seçeneklerini veya dosya adını değiştirebilir. Sonraki sahne artık bulunmayan seçeneği hâlâ gösteriyorsa ilk yeni ekran doğru olsa bile güncelleme eksiktir.
Bu inceleme çoğu zaman tam görüntü oluşturma işleminden sonra sorun düzeltmekten hızlıdır. Görevin küçük malzeme bakım işi mi, yerel animasyon değişikliği mi, yoksa başka onay gerektiren senaryo değişikliği mi olduğunu söyler. Bu sınıflandırma işi dürüstçe tahmin etmeyi kolaylaştırır.
Eşit boyutların neden yetmediğini anlayın
Eski ve yeni ekran görüntülerinin ikisinin de 1600 × 1000 piksel olduğunu varsayın. İlk hedef düğme görüntü koordinatı (1320, 160) noktasındaydı. Yeni yerleşim onu (1430, 210) noktasına taşıyor. Dosya değişimi görüntünün dış sınırlarını koruyor ama eylemi yüz pikselden fazla taşıyor.
Ekran görüntüsü yarı boyutta gösteriliyorsa kamera dönüşümü öncesinde bile bu fark yatayda yaklaşık 55, dikeyde 25 piksel olur. Sıkı yakınlaştırma hatayı büyütebilir. İmleç boş alana inandırıcı biçimde inebilir; bu, açıkça bozuk malzemeden kötüdür, çünkü izleyici yanlış bölgeyi kontrol sanabilir.
Döndürülmemiş basit görüntü için yararlı zihinsel model screen position = image origin + image coordinate × display scale biçimindedir. Kamera ötelemesi ve ölçeği bunun çevresine başka dönüşüm ekler. Bu formülü döndürülmüş veya iç içe sahnelere körlemesine uygulamayın; gerçek dönüşüm zincirini inceleyin.
Normalize edilmiş koordinatlar, bitmap çözünürlüğüne kazara bağımlılığı azaltabilir. Hedefi görüntü genişliğinin ve yüksekliğinin kesri olarak tutmak, yalnız çözünürlük değişiminde aynı görsel konumu korur. Arayüz yerleşimi değiştiği için taşınan hedefi korumaz. Normalize koordinat hâlâ koordinattır, düğmeyi anlamak değildir.
Mümkünse hedefleri animasyona dağılmış adsız sayılar yerine adlandırılmış veri olarak tutun. exportMenuTarget, birbiriyle ilgisiz beş koordinat çiftinden daha kolay denetlenir. Ad arayüz öğesini anlatmalı, kayıt notları o koordinatların ait olduğu ekran görüntüsünü belirtmelidir.
Aşağıdaki koordinat örneği görüntü boyutunu hedef konumundan ayırır. Yarı ölçekte düğmenin taşınması yatayda 55, dikeyde 25 piksellik hata üretir. Sonraki iki kat kamera yakınlaştırması iki hatayı da ikiye katlar. Bu yüzden imleci yalnızca açılış görünümünde denetlemek kötü yakın planı kaçırabilir. Tıklamayı son görüntü dönüşümünden sonra, kamera eylemin olduğu noktadayken inceleyin.
Kamerayı yeni bilgi etrafında yeniden kurun
Eski arayüzde çalışan kadraj, yenisinde temel bağlamı gizleyebilir. Seçili öğenin kimliğini, kontrol etiketini ve sonuç bölgesini birlikte denetleyin. Yakın plan işlemi anlamayı kolaylaştırmalıdır; yeni ekranı eski dikdörtgene doldurmakla yetinmemelidir.
Yeni kontrol menüdeyse konumunu kurmak için menünün açılmasını yeterince gösterin. Doğrudan son seçeneğe atlamak diziyi kopuk hissettirebilir. Tersine, makalenin amacı her tıklamayı öğretmek değil sonuç göstermekse uzun gezinme yolunu yeniden oynatmak gerekmez. Planı vaade göre seçin.
Kadrajı değiştirdikten sonra hareket yollarını yeniden denetleyin. Görüntü koordinatlarında doğru kalan işaretçi, kamera kaydırmasında görünür karenin dışına çıkabilir. Açıklama, tanımladığı kontrolün üstünü örtebilir. Eski yerleşimde akıcı görünen yakınlaştırma, yeni hedefe ulaşmadan geniş boş alan boyunca hızlanabilir.
Her kadraj sorununu ekran görüntüsünü büyüterek çözmeyin. Sonuç yön bulma pahasına okunur olabilir. Alternatifler arasında kısa genel görünüm, belirli bölgeyi gösteren küçük pencere, basit açıklama veya eylemi iki plana bölmek vardır. Her biri açıklamayı farklı değiştirir.
Yararlı test, eylemden hemen önce duraklayıp yeni izleyicinin sırada ne olacağını saptayıp saptayamayacağını sormaktır. Sonra sonuçtan sonra duraklayıp aynı izleyicinin neyin değiştiğini saptayıp saptayamayacağını sorun. İki kare de eski arayüz bilgisini gerektiriyorsa kamera uygulaması kozmetik ayardan fazlasına ihtiyaç duyar.
Kaynak yüklemesini güvenilir tutun
Ekran görüntüsü değiştirmek teknik başarısızlığı da ortaya çıkarabilir: önizleme önbellekteki görüntüyü kullanırken görüntü oluşturucu eksik veya eski dosyayı yükler. İncelemede yeni malzemeye ayrı ad verin ve oluşturmanın gerçekten kullandığı yolu doğrulayın.
Remotion’ın kaynak belgeleri açık yaklaşımı gösterir: malzemeleri projenin public dizinine koyun ve staticFile() ile referans verin. Tarayıcının erişebildiği proje dışındaki malzemelerin neden basitçe yerel masaüstü dosyası sayılamayacağını da açıklar. Proje makineler arasında taşındığında bu ayrıntılar önemlidir. Remotion kaynak belgeleri
Görüntü referansı malzemeyi günceller. İmleç hedefleri, kamera kadrajları ve anlatım yeni ekrana göre ayrı denetlenmelidir.
Malzemeyi değiştirdikten sonra önizlemeyi yeniden yükleyin ve ayırt edici yeni ayrıntıyı inceleyin. Bu, başarılı dosya kopyasının görüntüyü yenilediğini varsaymaktan güçlü denetimdir. Yeni ekran görüntüsü yeniden adlandırılmış kontrol içeriyorsa tam o etiketi önizlemede ve dışa aktarımdan çıkarılmış karede doğrulayın.
Dışarıda barındırılan görüntülerde URL’nin kalıcı olup olmadığını ve görüntü oluşturma ortamının erişip erişemediğini düşünün. Yarın süresi dolan imzalı URL, düzenlenebilir proje için kötü uzun vadeli bağımlılıktır. Mevcut tarayıcı oturumunuza güvenmek yerine izinli yerel kopyayı paketleyin veya güvenilir edinme sürecini belgeleyin.
Tarihsel karşılaştırmayı eskimiş demodan ayırın
Bazen eski ekran görüntüsü kalmalıdır. Yeniden tasarımı anlatan makale, önceki arayüzü tam olarak güncelden farklı olduğu için göstermelidir. O görüntüyü en yeni ekranla değiştirmek karşılaştırmayı yok eder.
Güncellemeden önce her kaydın rolünü etiketleyin. Güncel nasıl yapılır sahnesi güncel iş akışını öğretmelidir. Tarihsel öncesi-sonrası sahnesi uygun sürümü korumalı ve ayrımı açık yapmalıdır. Kavramsal illüstrasyon ilişkiyi sadeleştirebilir ama yayımdaki arayüzle karıştırılmamalıdır.
Bu ayrım müşteri hikâyelerini de korur. Video önceki ürün sürümünde tamamlanmış projeyi belgeliyorsa her ekranı güncellemek, müşterinin o zaman var olmayan arayüzü kullandığını ima edebilir. Tarihsel örneğin yanında güncel anlatım oluşturabilirsiniz ama bu yeni editoryal kurgu olur ve dürüst sunulmalıdır.
Sıradan bakım güncellemesinde eski ve yeni kayıtları geçici inceleme görünümünde karşılaştırın. Hareketi yeniden oluşturmadan önce değişen kontrolleri, etiketleri ve sonuç bölgelerini belirleyin. Makaleye hizmet etmiyorsa karşılaştırmayı yayımlamayın; o anki değeri kurgucunun bağımlılıkları keşfetmesine yardım etmektir.
Yeni sürüm kabul edilene kadar eski malzemeyi erişilebilir tutun. Mevcut animasyonun neye göre kurulduğuna referans sağlar ve yeni kayıt eksikse güvenli geri dönüşü destekler. Sonra yerine yenisi geçtiğini işaretleyin; kazara gelecekteki kaynak olmasın.
Pratik soru yalnızca ekran görüntüsünün eski olup olmadığı değildir. Yaşının sahnenin iddiasıyla çatışıp çatışmadığıdır. Bu soru hem eskimiş eğitimi ihmal etmekten hem doğru tarihsel örneği gereksiz yeniden yazmaktan kaçınır.
Yalnızca pikselleri değil, cümleyi yeniden denetleyin
Arayüz güncellemeleri çoğu zaman ürünün dilini değiştirir. Ekran görüntüsünü değiştirip eski anlatımı bırakmak bölünmüş açıklama yaratır: ses “Workspace”, ekran “Project”, altyazı “Board” der. Yeni kullanıcı bunları haklı olarak üç farklı nesne sanabilir.
Sahnenin başlığını, altyazılarını, anlatımını, etiketlerini ve alternatif metnini birlikte inceleyin. Güncel ürün terimlerini tutarlı kullanın. Eski terimi yalnızca geçişi açıklarken veya sürümleri açıkça karşılaştırırken koruyun. İzleyiciyi göreviyle ilgisiz iç adlandırma geçmişini uzlaştırmaya zorlamayın.
Sonra iddiayı denetleyin. Güncellenmiş ekran hâlâ vaat edilen davranışı gösteriyor mu? Yetenek kaldırılmış veya kısıtlanmışsa görsel olarak yenilenmiş video daha dar vaat gerektirebilir. Bu, sıkı kadrajla gizlenecek tasarım güçlüğü değil, içerik düzeltmesidir.
Eklenen her adımdan sonra zamanlamayı inceleyin. İki tıklamalı menü dizisi, eski doğrudan düğmeden fazla zaman gerektirebilir. Bu zamanın tamamını sonuç gösteriminden almak, yeni işlemi görünür yaparken sonucunu okunamaz kılabilir. Yeni görevi otomatik olarak eski anahtar karelere sıkıştırmak yerine sahne içindeki bilgi bütçesini ayarlayın.
Son olarak dışa aktarımı ve hedefi denetleyin. Yenilenen sahneyi gerçek gösterim boyutunda izleyin, sonra komşu kesmeleri inceleyin. İncelenen dosyanın yeni kaydı içerdiğini doğrulayın. Yeni sürüm kabul edilene kadar önceki onaylı sürümü erişilebilir tutun ama kimsenin kazara yayımlamaması için durumunu açık yapın.
Başarılı ekran görüntüsü güncellemesi, izleyicide güncel ürüne dair doğru anlayış bırakır. Görüntü, işaretçi, kamera, kelimeler ve sonuç aynı iş akışına gönderme yapar. Bu doğru olduğunda dosyayı değiştirmek ilk başta göründüğü kolay parçaya dönüşür.