Świeży artykuł poświęcony tematowi typografii interfejsu użytkownika: przeczytaj zbiór wskazówek na temat tworzenia funkcjonalnej i harmonicznej typografii w interfejsach użytkownika w Internecie i na urządzeniach mobilnych.

Typografia to sposób komunikacji z użytkownikami. Wydajność wizualna i czytelność kopiowania w produktach cyfrowych mają ogromny wpływ na komfort użytkowania. Jeden z grafików-guru, Hoon Kim, powiedział kiedyś: „Projektowanie typograficzne jest zarówno widoczne, jak i słyszalne. Jeśli masz świetny scenariusz, nadszedł czas, aby obsadzić dobrych aktorów. ”Typografia może stać się głosem designu. Odpowiednia typografia mówi sama za siebie, tworząc odpowiedni nastrój i przekazując określoną wiadomość użytkownikom. Dzisiejszy artykuł zawiera wskazówki, które pomogą Ci w tworzeniu skutecznej typografii.
Hierarchia typograficzna sprawia, że ​​wszystko działa

Aby stworzyć projekt przyjemny dla użytkowników, wszystkie jego elementy powinny być dobrze zorganizowane i przejrzyste w nawigacji. Projektanci ustalili odpowiednią strukturę, ustanawiając wizualną hierarchię. Organizuje wszystkie elementy wizualne, aby użytkownicy mogli łatwo dostrzec zawartość.

Hierarchię wizualną można podzielić na różne części. Jeden z nich związany tylko z elementami kopiującymi nazywa się hierarchią typograficzną. Ma on na celu uporządkowanie kopii treści poprzez podzielenie jej na różne typy, takie jak nagłówki, podtytuły, kopie treści, podpisy i inne. Różnice między rodzajami kopii są ustalane przez regulację rodziny, rozmiarów, szerokości i kolorów czcionek.

Przejrzysta hierarchia typograficzna sprawia, że ​​tekst jest czytelny i łatwy do skanowania. Co więcej, wyróżnienie kluczowych części tekstu jest proste, aby zwrócić uwagę użytkowników i przyciągnąć ich do oczekiwanych działań.

strona docelowa komunikatora nastroju

Strona docelowa Mood Messenger
Rozważ kontekst i odbiorców

Jeśli chodzi o wybór czcionek, należy wziąć pod uwagę kontekst kopii i potencjalnego odbiorcy. Każda czcionka wprowadza własny nastrój do układu. Istnieją przyjazne, zabawne, poważne, biznesowe i wiele innych czcionek, które pasują do określonego projektu.

Zanim wybierzesz czcionkę, musisz poznać cele swojego klienta, a także potrzeby i preferencje grupy docelowej. Wydajność wizualna czcionek wpływa na pierwsze wrażenie, jakie użytkownicy uzyskują z produktu. Jeśli rodzaj czcionki nie pasuje do nastroju, do którego dąży produkt, może wystąpić nieporozumienie z odbiorcami. Na przykład, jeśli projektant wybierze czcionkę, która wygląda zbyt zabawnie i głupio jak na stronę biznesową, użytkownicy wahają się, czy firma jest godna zaufania. Lub, jeśli produkt jest przeznaczony dla młodzieży, zbyt formalne czcionki mogą wydawać się nudne.

projektowanie stron internetowych kwiaciarnia sklep e-commerce

Witryna e-commerce kwiaciarni
Głęboka uwaga na typografię mobilną

Projektanci często eksperymentują z typografią, aby projekt był oryginalny. Jednak jeśli chodzi o projektowanie mobilnego interfejsu użytkownika, typografom dosłownie brakuje miejsca. Ekrany mobilne są dość małe, co stwarza nowe wyzwanie dla projektantów, aby sprostać ograniczeniom bez utraty sensu i funkcjonalności. Typografia mobilna wymaga głębokiej uwagi na szczegółach, od odpowiedniego rozmiaru czcionek po atrakcyjne śledzenie i długość linii.

http://sanrahpo1.pl/tworzenie-stron-internetowych
http://sanrahpo1.pl/tworzenie-stron-siedlce
http://sanrahpo1.pl/tworzenie-stron-warszawa
http://sanrahpo1.pl/strony-www-krakow
http://sanrahpo1.pl/strony-www-lodz
http://sanrahpo1.pl/strony-www-poznan
http://sanrahpo1.pl/strony-www-gdansk
http://sanrahpo1.pl/strony-www-szczecin
http://sanrahpo1.pl/strony-www-bydgoszcz
http://sanrahpo1.pl/strony-www-lublin
http://sanrahpo1.pl/strony-www-bialystok

W porównaniu z projektowaniem stron internetowych typografia mobilna jest trudniejsza do uzyskania dobrej czytelności. Rozmiar czcionki nie powinien być zbyt mały, ponieważ na małych ekranach będzie wyglądał jak nieczytelny bałagan. Co więcej, jeśli tekst jest zbyt duży, nie zmieści się również na małym ekranie. Ponadto projektanci muszą dbać o poziom kontrastu, ponieważ ekran z oświetleniem otoczenia i wysokim kontrastem może zaszkodzić oczom użytkowników.

Ponadto projektant powinien pomyśleć o funkcjonalności typografii. Interfejs smartfona zawiera klikalne części tekstowe, a projektanci muszą upewnić się, że użytkownicy zdołają ich użyć. Jeśli te części są zbyt małe, ludzie nie mogą nacisnąć palcem i jest to raczej denerwujące.

Biorąc pod uwagę wszystkie drobne szczegóły typografii mobilnej, projektanci mogą przynieść cenne produkty dla użytkowników.

Aplikacja do animacji wina UI

Aplikacja WineYard
Minimalizm nie może zaszkodzić

Czasami, gdy projektanci starają się pokazać wszystkie aspekty produktu cyfrowego, starają się używać wielu różnych stylów i czcionek w jednym projekcie. W rezultacie otrzymują projekt przepełniony niepotrzebnymi rozpraszającymi detalami i pozbawionymi odpowiedniego nastroju.

Eksperci zwykle starają się zachować liczbę czcionek w ciągu dwóch lub trzech dla tego samego układu. Pozwala na uzyskanie istotnego kontrastu między kopiowanymi elementami, a także na zachowanie równowagi i właściwego przekazu projektu. Stosowanie różnych stylów (pogrubienie, kursywa) również powinno być minimalne. Są dobre do podkreślania naprawdę ważnych części, ale ich nadużywanie może sprawić, że tekst będzie bałaganiarski.

Ponadto kopiowanie treści nie powinno przytłaczać użytkowników niepotrzebnymi informacjami. Oczywiście zadaniem pisarza jest tworzenie odpowiedniego tekstu, ale projektanci muszą z nim współpracować, aby upewnić się, że tekst będzie pasował do projektu.

studium przypadku projektowania interfejsu użytkownika górnej aplikacji

Upper App
Tekst musi oddychać

Poziom czytelności w dużej mierze zależy od ilości miejsca między literami, słowami i wierszami tekstu. Śledzenie, kerning i prowadzenie to procesy bieli regulacja przestrzeni między elementami typograficznymi. Biała przestrzeń to obszar między elementami w kompozycji projektu.

Brak białych znaków może kończyć się złą czytelnością treści kopii, ponieważ trudno jest odróżnić słowa, które są umieszczone zbyt blisko siebie. Odpowiednia biała przestrzeń zapewnia wizualną ulgę w oczach użytkowników i umożliwia łatwe przechodzenie od jednego słowa do drugiego, od jednej linii do następnej. Staraj się jednak nie nadużywać, ponieważ może to zniszczyć jedność tekstu.

interakcje na stronie

Strona docelowa Akademii tańca
Twórz typografię jak naukowiec, poprawiaj jak artysta

Typografia jest złożoną nauką składającą się z wielu zasad i przepisów. Ci, którzy je obejmowali, są w stanie stworzyć czystą działającą typografię. To jednak nie wystarczy. Klienci zawsze wymagają oryginalności i emocji, ale nie można tego zrobić tylko postępując zgodnie z pisemną instrukcją.

Projektanci nigdy nie powinni chować swoich artystycznych dusz. Wyobraźnia i poczucie piękna wprowadzają wyjątkowość do każdego projektu, nawet najbardziej swobodnego. Znajdź równowagę między surowymi zasadami a nietypowymi wyborami, a wyniki mogą zaskoczyć Ciebie i Twoich klientów.

projektowanie stron internetowych UI tubik studio

Witryna dla smakoszy
Kolorowa typografia wymaga namysłu

Temat jest aktywnie dyskutowany. Niektórzy uważają, że w typografii nie ma miejsca na kolory, a niektórzy twierdzą, że jest to niezbędny element dobrego wyglądu. Nie ma sensu szukać właściwej strony sporu, ponieważ nie ma uzasadnienia dla smaku. Niemniej jednak istnieje kolorowa typografia, a projektanci często ją stosują.

Wśród zalet kolorowej typografii wspomnijmy o elementach emocji dodawanych do dowolnego interfejsu użytkownika, a także o możliwości wyróżnienia interesujących użytkowników. Co więcej, każdy kolor może przekazać określoną wiadomość, ponieważ ma ona wpływ na umysł i zachowanie użytkowników.

Aby czerpać wszystkie korzyści, należy starannie i ostrożnie stosować kolorową typografię, ponieważ łatwo jest zmienić interfejs użytkownika w kolorowy chaos. Oto przydatna lista kontrolna dla tego przypadku:

Zrób to kontrast. Dużym problemem, jaki może przynieść kolorowa typografia, jest zła czytelność. Właściwy kontrast między czcionkami a tłem pomoże tego uniknąć. Upewnij się jednak, że kontrast wygląda przyjemnie i nie szkodzi oczom.

Nie używaj zbyt wielu kolorów. Ponownie staraj się nie zamieniać interfejsu użytkownika w bałagan. Zbyt wiele kolorów wygląda rozpraszająco i amatorsko.

Harmonia kolorów. Pamiętaj o podstawach lekcji sztuki. Wybierz odpowiednią paletę za pomocą koła kolorów i schematów.

Uważaj na efekty. Kolory fluorescencyjne, luminescencyjne, metaliczne i świecące mają swoje cechy szczególne i nie zawsze mogą dobrze wyglądać na ekranie cyfrowym.

projektowanie interakcji aplikacji wymiany książek

Book Swap App
Naucz się podstaw typografii

Może to zabrzmieć zbyt oczywisto, ale niektórzy projektanci ignorują podstawy nauki typografii. Opierają się na nowoczesnych narzędziach, które automatycznie wybierają czcionki lub po prostu mają nadzieję, że cechy estetyczne wybranych czcionek będą wystarczające. Takie podejście wydaje się być nauką czytania bez znajomości alfabetu.

Projektanci, którzy nie znają pojęć i anatomii krojów, nie mogą w pełni wykorzystać potencjału typografii. Każdy sam decyduje, czy musi uczyć się dogłębnie nauki, ale podstawy są podstawą każdego rzemiosła.

Eksperci pracujący nad problemem harmonicznego użycia czcionek chętnie dzielą się swoją wiedzą, dlatego jest tak wiele przydatnych książek o typografii dla projektantów.