Jak zaprojektować idealny obraz nagłówka na Twitterze
Twitter niedawno wdrożył zaktualizowany projekt stron profilowych, który pozwala wstawić nowe „zdjęcie nagłówka”, które znajduje się na górze Twojego kanału, podobnie jak zdjęcie na okładce Facebooka.
Dzisiaj zagłębimy się i zobaczymy przykłady dobrych zdjęć profilowych na Twitterze i omówimy, jak możesz zaprojektować własne. Wrzucę nawet darmowy szablon, abyś mógł zacząć od razu.
Poznaj elementy Envato
Darmowy szablon!
Zanim zagłębimy się w artykuł, oto przydatny darmowy szablon, którego możesz użyć do zaprojektowania własnego obrazu nagłówka na Twitterze. Dostarczony plik to PSD utworzony w Photoshop CS6.
Zdobądź bezpłatny PSD: kliknij tutaj, aby pobrać.
Jak tego użyć
Aby użyć tego szablonu, po prostu zastąp obraz tła. Grupa warstw interfejsu użytkownika ma pomóc ci zorientować się, jak będzie wyglądał obraz po zaimplementowaniu w witrynie. Ukryj zgrupowane warstwy przed zapisaniem.
Poznaj nowy profil na Twitterze
Dawno, dawno temu Twitter był usługą zorientowaną na tekst. Obecnie nieustannie starają się poprawić wrażenia wizualne poprzez integrację funkcji multimedialnych i wsparcia.
Najnowszy przeprojektowanie profilu popycha ten pomysł przez bardziej widoczne strumienie zdjęć i zupełnie nową funkcję: nagłówek profilu na Twitterze.
Jak widać, ten nowy obraz znajduje się na górze ostatnich tweetów i zawiera zdjęcie profilowe oraz krótki tekst o tobie. Aby pomóc w uruchomieniu nowych profili, Twitter wydaje się współpracować z NBC, więc wiele naszych przykładów będzie pochodziło z różnych kont (nie wszyscy użytkownicy dokonali jeszcze aktualizacji).
W ostatecznym rozrachunku nie oznacza to dodania tonu prac projektowych do profilu, to po prostu jedno dodatkowe zdjęcie. Jednak nawet jeden mały obraz może przynieść wiele pytań, dlatego jestem tutaj, aby odpowiedzieć na kilka pytań, które możesz mieć, przygotowując obraz nagłówka na Twitterze.
Jak ustawić nagłówek profilu?
Pierwszym pytaniem, które musisz zadać, jest to, jak to włączyć? Jeśli przejdziesz do swojego profilu, będzie wyglądać tak, jak zawsze. Obecnie użytkownicy, którzy nie skonfigurowali obrazu nagłówka, zachowają stary projekt.
Aby zaktualizować swój profil, kliknij koło zębate Ustawienia w prawym górnym rogu strony. Następnie kliknij kartę „Projekt” na pasku nawigacji po lewej stronie.
Po przejściu na stronę Projekt przewiń w dół do sekcji „Dostosuj własne”. Tutaj zobaczysz przycisk „Zmień nagłówek”. Po prostu kliknij i prześlij obraz, aby ustawić nagłówek.
To wszystko! Teraz musisz tylko zdecydować, co tam umieścić!
Jaki rozmiar?
Kolejnym ważnym pytaniem, jakie należy zadać przy projektowaniu nagłówka profilu, jest „Jaki rozmiar?” Jeśli spojrzymy na obrazy NBC, które Twitter bez wątpienia osobiście pomógł skonfigurować, widzimy, że rozmiar ma szerokość 520 pikseli na 260 pikseli wysokości.
Ostatecznie rozkłada się to na stosunek szerokości do wysokości 2: 1 przy maksymalnym rozmiarze wysyłania 5 MB lub 1252 na 626 pikseli.
Wskazówki i uwagi dotyczące projektowania
Rozmiar przesyłanego obrazu z pewnością nie jest jedyną kwestią, o której należy pamiętać. Zauważyłem kilka dziwactw, które zdecydowanie musisz wiedzieć, jeśli zamierzasz zrealizować udany projekt.
Obserwuj swoją czytelność
Aby poeksperymentować z miejscem na moim koncie osobistym, zrobiłem przypadkowe zdjęcie z cyfrowego wyświetlacza w Nowym Jorku. Wydawało się, że byłoby to idealne abstrakcyjne tło. Oto wynik:
Jak widać, jest to dość atrakcyjny wygląd. Problem polega jednak na tym, że trochę zakłóca tekst i jestem wariatem czytelności.
Oczywiście z białym tekstem potrzebujesz tła, które jest dość ciemne. Mój pasuje do tego opisu, ale światła służą jako jasne punkty, które zmniejszają kontrast między literami a tłem i powodują zbyt wiele rozproszeń.
Rozwiązanie tutaj jest dość proste, właśnie przyciemniłem tło, w którym leży tekst, aby światła nie przeszkadzały tak bardzo. Wynik nie jest tak fajny wizualnie, ale jest o wiele bardziej czytelny:
Twitter wkręca się z twoim wizerunkiem
Ludzie na Twitterze wiedzą, że sztuczka, którą zastosowałem powyżej, zaciemniając dolną część obrazu, jest czymś, co trzeba będzie zrobić na wielu obrazach. W rzeczywistości strona robi to automatycznie, niezależnie od tego, czy tego chcesz, czy nie.
W ramach testu złapałem ten obraz i przygotowałem go do nagłówka Design Shack. Oto, co widzę w Photoshopie:
Teraz, jeśli prześlę ten obraz tak, jak to widać powyżej, oto wynik, jaki pojawia się na naszej stronie profilu:
Zobacz różnicę? Automatycznie zastosowano gradient tła, co znacznie przyciemnia oryginalne kolory. Jest to subtelny efekt na większości zdjęć, ale gdy wpadniesz na coś z mniejszą ilością szczegółów, naprawdę się wyróżnia.
To z pewnością nie jest zła rzecz, naprawdę pomaga wyróżnić się w tekście, jest to po prostu coś, o czym należy pamiętać, przygotowując obraz. Pamiętaj też, że Twitter automatycznie stosuje zaokrąglone rogi zarówno do obrazu profilu, jak i nagłówka.
Wskazówki dotyczące projektowania
Teraz, gdy wiemy wszystko o tym, jak stworzyć i zastosować nasz obraz, rozejrzyjmy się i zobaczmy, co inni robią z tym obszarem, aby uzyskać inspirację.
Zintegruj swoje zdjęcie profilowe
Jednym z najlepszych, jakie do tej pory widziałem, jest Ryan Seacrest. Uwielbiam integrację zdjęcia profilowego z obrazem nagłówka. Znakomity. Możesz w pełni oczekiwać, że mnóstwo użytkowników spróbuje to zrobić na różne sposoby.
Pochwal się swoją pracą
Graham Smith, ulubiony projektant logo wszystkich, skorzystał z okazji, aby od razu zaktualizować swój profil. Jego pomysł jest prosty i skuteczny: pokazuje jego pracę w ładnej, subtelnej siatce logo.
Dopasuj swoje tło profilu
Podczas pracy nad obrazem nagłówka należy pamiętać, że jest on częścią większego projektu i powinien dobrze pasować do obrazu tła.
Widzimy to dobrze na poniższym koncie z aktualnościami. Obraz nagłówka to czerwona mapa świata złożona z pikseli.
W rzeczywistości jest to ten sam obraz, którego użyli na tle strony, tylko mniejszy i w innym kolorze. To zapewnia ładny spójny wygląd.
Uwielbiam to, jak duże tło jest subtelniejszą wersją, podczas gdy obraz nagłówka naprawdę przyciąga twoją uwagę odważnym kolorem.
Nie komplikuj
Jeśli masz problem ze znalezieniem dobrego obrazu nagłówka, pamiętaj o trzech mocnych słowach: zachowaj prostotę. Nawet poza obrazem wiele się dzieje w tej przestrzeni, a Twoim celem jest połączenie wszystkiego razem, a nie nadmierne komplikowanie.
W dużej rodzinie Twittera widzimy dobre i złe przykłady tego. Współzałożyciel Twittera, Evan Williams, zdecydowanie wybrał źle z grafiką, która jest zbyt zajęta dla tej przestrzeni.
Porównaj to z obrazem użytym przez twórcę Twittera Bootstrap, Marka Otto. Jego wybór jest znacznie lepszy:
To jest miłe, proste i rzeczywiście dość uderzające. Większość obrazu to białe znaki (w tym przypadku czarna przestrzeń), więc nie ma wiele do zakłócania w tekście. Treść stanowi jednak wydarzenie pełne emocji i cudów dla nas wszystkich, co zapewnia niezapomniane wrażenia.
Pokaż nam swoje!
Masz, wszystko, co musisz wiedzieć o tworzeniu idealnego obrazu nagłówka na Twitterze. Po przeczytaniu moich wskazówek i zobaczeniu świetnej inspiracji, stwórz własną dzięki naszemu darmowemu szablonowi!
Po przygotowaniu obrazu nagłówka na Twitterze pozostaw poniższy komentarz z linkiem, abyśmy mogli zobaczyć, co wymyśliłeś.
