Tekst za obrazem

Jak umieścić tekst za obrazem

Strona otwiera się z wczytanym już zdjęciem demo (nasz znajomy farmer z napisem "it ain't much" schowanym za czapką), żeby było dokładnie widać, jak wygląda efekt, zanim cokolwiek zmienisz. Gdy zechcesz, podmień je na własne zdjęcie:

1. Kliknij "Prześlij zdjęcie" i wybierz obraz z wyraźnym obiektem. Najlepiej sprawdza się osoba, ale pies, samochód czy kubek kawy też się nadadzą: wszystko, co odcina się od tła.
2. Wpisz tekst. Naciśnij Enter, jeśli chcesz drugą linię. Tekst automatycznie trafia za obiekt; bez masek, bez panelu warstw, bez ręcznego wycinania.
3. Przeciągnij go na miejsce bezpośrednio w podglądzie. Chwyć płótno i przesuń tekst tam, gdzie najlepiej się czyta, zwykle tak, by obiekt zasłaniał literę lub dwie. To właśnie to zachodzenie sprzedaje efekt głębi.
4. Nadaj styl. Wybierz czcionkę, dostosuj rozmiar i odstępy, dodaj obrys, obróć tekst, zmniejsz krycie albo nachyl go w udawanym 3D, jeśli masz ochotę na coś efektownego.
5. Pobierz PNG. Eksport ma oryginalną rozdzielczość zdjęcia, a nie podglądu, więc ze zdjęcia 4000px dostaniesz wynik 4000px.

Co naprawdę dzieje się pod maską

Gdy zdjęcie się wczytuje, mały model segmentacji AI działa bezpośrednio w przeglądarce i ustala, które piksele należą do obiektu, a które do tła. Następnie narzędzie odbudowuje obraz z trzech warstw: oryginalne zdjęcie na dole, tekst pośrodku i wycięty obiekt naklejony z powrotem na wierzch. Oko odczytuje taki stos jako głębię: tekst wygląda, jakby od zawsze stał w scenie.

Ponieważ wszystko dzieje się na Twoim urządzeniu, nie ma kolejki przesyłania ani czekania na serwer. Pierwsze zdjęcie trwa kilka sekund dłużej, bo pobiera się model; potem wszystko dzieje się niemal natychmiast. Podczas edycji zdjęcie nigdy nie opuszcza przeglądarki, więc sprawdza się też przy zdjęciach, których wolisz nie wysyłać na przypadkowy serwer.

Gdzie można już było zobaczyć ten efekt

Szczerze mówiąc, wszędzie. Miniatury na YouTube korzystają z niego bez przerwy: głowa twórcy wystająca przed gigantycznym "EXPOSED" albo "I TRIED IT" to dziś praktycznie firmowy styl platformy. Używają go plakaty z tekstami piosenek w stylu Spotify. Używają go okładki albumów. Fotografowie na Instagramie używają go w postach urodzinowych, podsumowaniach podróży i ogłoszeniach zaręczyn. Strony sportowe umieszczają numer zawodnika za jego sylwetką. Streamerzy umieszczają swój nick za awatarem.

Powód jest prosty: zachodzenie na siebie to jedna z najsilniejszych wskazówek głębi dla mózgu. Gdy ramię osoby zasłania część litery, tekst przestaje być płaskim podpisem naklejonym na wierzch i staje się częścią sceny. Płaski tekst konkuruje z obiektem o uwagę; tekst za obiektem go obramowuje. To samo zdjęcie, te same słowa, zupełnie inne wrażenie.

Jak wybrać zdjęcie, które współpracuje

Model segmentacji jest dobry, ale możesz mu ułatwić albo utrudnić zadanie. Zdjęcia, na których obiekt wyraźnie odcina się od tła (inne kolory, przyzwoite światło, trochę odległości), dają ostre wycięcia z czystymi krawędziami. Zdjęcia, na których ciemna kurtka zlewa się z ciemnymi drzwiami, dadzą miększe, rozmyte krawędzie w miejscu zachodzenia.

Kilka rzeczy, które zawsze pomagają:

• Kontrast między obiektem a tłem. Osoba w jasnej koszulce na tle drzew wypada lepiej niż osoba w zieleni na tle tych samych drzew.
• Jeden wyraźny obiekt. Zdjęcia grupowe też działają, ale efekt jest najmocniejszy, gdy w kadrze dominuje jedna osoba lub przedmiot.
• Trochę miejsca nad obiektem lub obok. Tekst musi gdzieś się zmieścić. Zdjęcia ciasno przycięte do twarzy nie zostawiają na niego miejsca.
• Ostry obiekt. Jeśli zdjęcie ma już naturalnie rozmyte tło, jeszcze lepiej: tekst przejmuje ten warstwowy, fotograficzny charakter.

Portrety zrobione telefonem przy dobrym świetle to ideał. Właśnie takie zdjęcia najczęściej trafiają do tego narzędzia i w nich model jest najlepiej wytrenowany.

Dobra typografia

Częściowo zasłonięty tekst musi przetrwać utratę 30-40% siebie, więc wygrywają grube czcionki. Anton jest tu domyślny nie bez powodu: jest gruby, wysoki i czytelny nawet wtedy, gdy zasłania go całe ramię. Bebas Neue i Archivo Black to bliscy krewni. Impact to klasyczny wybór do memów. Jeśli chcesz czegoś łagodniejszego, Pacifico i Caveat dają odręczny wygląd; po prostu je powiększ, aby zrównoważyć cieńsze linie.

Na początku jest dwanaście wybranych czcionek nagłówkowych, a za polem wyszukiwania kryje się katalog około stu kolejnych Google Fonts wczytywanych na żądanie. Praktyczna rada: wybierz czcionkę zanim dopracujesz położenie, bo zmiana z wąskiej czcionki na szeroką przesuwa wszystko.

Jeśli chodzi o kolor, biały to bezpieczny wybór dla większości zdjęć. Ale pobranie koloru, który już jest w scenie (niebo, koszulka, neon), to sztuczka, dzięki której efekt wygląda na zaprojektowany, a nie wygenerowany. Użyj próbnika koloru, wskaż coś w tle, a potem zmniejsz krycie do 85-90%, aby tekst wtopił się w światło zdjęcia.

Drobne poprawki, które sprawiają, że efekt przekonuje

Obrys ratuje sytuację, gdy tekst przechodzi przez jasne i ciemne fragmenty zdjęcia. Kilka pikseli ciemnego obrysu utrzymuje litery czytelne tam, gdzie przechodzą przez jasne niebo. Ustaw go na zero, gdy tło jest jednolite.

Obrót i pochylenie 3D łatwo przesadzić. Kilka stopni obrotu dodaje energii; czterdzieści pięć stopni dodaje chaosu. Suwaki pochylenia odkształcają płaszczyznę tekstu tak, że wydaje się cofać w głąb sceny; subtelne wartości (10–20) zaskakująco dobrze naśladują perspektywę zdjęcia.

Opcja odwrócenia odwraca cały trik: zamiast obiektu przed tekstem to tło jest przed nim, a tekst wydaje się przypięty do obiektu. To właściwy wybór może raz na dziesięć razy, ale gdy jest właściwy, to w pełni. Wypróbuj go, gdy automatyczne wycięcie złapie "złą" połowę sceny.

Dodaj znak wodny przed publikacją

Pod opcjami stylu jest osobne pole na znak wodny. Wpisz swoją nazwę użytkownika lub domenę, a potem ustaw ją za pomocą gotowych pozycji (rogi, krawędzie, środek) albo przeciągnij suwaki X/Y, aby wybrać dokładne miejsce. Możesz ustawić rozmiar w pikselach, wybrać kolor i włączyć kontrastowy obrys, aby napis był czytelny na każdym tle. Znak wodny jest wtopiony w pobrany plik PNG, więc gdy obraz zostanie udostępniony dalej (a dobre zawsze są), Twoja nazwa podróżuje razem z nim.

Udostępnij link, nie tylko plik

Przycisk Udostępnij tworzy link zawierający całą kompozycję: zdjęcie, tekst, styl i ustawienia znaku wodnego. Każdy, kto go otworzy, trafi na tę stronę z dokładnie Twoją konfiguracją, gotową do poprawek lub pobrania. Przydaje się, gdy chcesz poznać drugą opinię przed publikacją albo przekazać szablon komuś z zespołu: ustaw styl raz, udostępnij link i pozwól podmienić zdjęcie.

Najczęściej zadawane pytania

Czy potrzebuję do tego Photoshopa?

Nie. To, co w Photoshopie robi się zaznaczeniem obiektu, maskami warstw i warstwą tekstową, tutaj dzieje się w jednym kroku w przeglądarce. Photoshop nadal daje więcej kontroli przy precyzyjnych poprawkach, ale przy klasycznym efekcie tekstu za obiektem nie ma realnej różnicy w wyniku, tylko jakieś dziesięć minut różnicy w nakładzie pracy.

Czy to jest darmowe?

Kompozycję możesz stworzyć i podejrzeć bez konta. Pobranie pliku PNG w pełnej rozdzielczości wymaga zalogowania i w zależności od bieżącej promocji jest bezpłatne przez ograniczony czas albo wliczone w subskrypcję. Plakietka na górze narzędzia pokazuje, co obowiązuje w tej chwili.

Jakie typy plików mogę przesłać?

JPG, PNG, WebP, GIF, AVIF, BMP i HEIC/HEIF prosto z iPhone'a. Eksport to zawsze PNG w oryginalnej rozdzielczości zdjęcia.

Dlaczego wycięcie pominęło część obiektu?

Zwykle przez niski kontrast: krawędź obiektu zlewa się z tłem albo światło jest bardzo słabe. Spróbuj zdjęcia, na którym obiekt bardziej się wyróżnia, albo użyj opcji odwrócenia, która przy trudnych obrazach czasem daje czystszy podział. Najtrudniejsze są zatłoczone sceny z wieloma nachodzącymi na siebie osobami.

Czy mogę napisać kilka linijek?

Tak, naciśnij Enter w polu tekstowym. Linijki są wyśrodkowane jako blok, a suwak rozmiaru skaluje je razem. Dwie krótkie linijki zwykle sprawdzają się lepiej niż jedna długa, bo każda ma własną szansę nachodzić na obiekt.

Czy to działa na telefonie?

Tak. Segmentacja działa sprawnie na nowoczesnych telefonach, a przeciąganie tekstu kciukiem jest szczerze mówiąc bardziej naturalne niż myszką. Pobrane pliki trafiają do galerii lub aplikacji Pliki jak każdy inny obraz.