8 sposobów używania ręcznie rysowanych ikon i elementów
Podczas gdy często skupia się na elementach idealnych w pikselach, nie są one odpowiednie do wszystkiego. Czasami chcesz czegoś więcej… kaprysu. Coś trochę bardziej autentycznego!
Ręcznie rysowane ikony lub elementy mogą być właściwą techniką projektowania, aby dodać coś wyjątkowego do projektu. Podczas gdy większość projektantów nie zwariuje na punkcie elementów, które wyglądają na ręcznie rysowane, kilka dotknięć może dodać osobisty charakter, który przyciąga użytkowników.
To również trend w projektowaniu stron internetowych. Ręcznie rysowane elementy są popularną opcją projektowania, od kłębka na ikonie do pełnego doświadczenia, które jest równe użyteczności i sztuce. Oto osiem świeżych sposobów wykorzystania tego trendu!
Utwórz separację
Ręcznie rysowane elementy projektu można łączyć i łączyć z niemal każdym rodzajem wyświetlaczy wizualnych. Mogą pracować obok zdjęć lub filmów, w morzu białych znaków lub w pobliżu elementów tekstowych. Nie eliminuj koncepcji używania tego typu elementu, ponieważ boisz się, jak może on pasować do ogólnego wzorca projektowego.
Spróbuj; nigdy nie wiesz.
Digital Visitor używa tych elementów w całym projekcie, aby stworzyć separację między elementami a bitami treści. Podczas gdy elementy na stronie głównej są jedynie kropkami, istnieją przykłady w wielu miejscach poniżej zwoju, a nawet favicon ma ten ręcznie rysowany talent.
Umieszczenie każdego elementu ma na celu zapewnienie, że użytkownik patrzy na odpowiedni fragment treści. W powyższym przykładzie element znajduje się na środku ekranu i służy do utworzenia separacji między dwoma obszarami zawartości. Niżej w projekcie podobne elementy są używane w stylu ikon o małych polach tekstowych, aby pokazać, co robi firma.
Interaktywne gryzmoły
Ręcznie rysowane elementy mogą tworzyć zabawne elementy interaktywne w projekcie. Od ładowania animacji - wiele przykładów stron internetowych w tym poście wykorzystuje ten styl - po w pełni interaktywne wrażenia, ta technika projektowania jest wystarczająco interesująca, aby wzbudzić zainteresowanie użytkowników.
Witraż w nieruchomości to piękny przykład interaktywnej gry, która łączy w sobie zarówno trend projektowania stron internetowych, jak i element kreatywny, umożliwiając użytkownikom kolorowanie rysunków na ekranie. To, co łączy to ze sobą, polega na tym, że wygląd jest rysowany ręcznie, elementy są precyzyjne i działają płynnie. Kolorowanie działa tak, jak powinno - i nie piszesz poza liniami - zapewniając wrażenia, które utrzymają użytkowników w pasji.
Prawie narysowana typografia
Czasami najlepsze ręcznie rysowane elementy nie są tak naprawdę wyceniane. Style typografii, które naśladują pismo ręczne, są szczególnie popularne, zwłaszcza do celów wyświetlania.
Ten styl pisma ma lżejszy i bardziej przyjazny charakter, z którym użytkownicy mogą się odnosić. (Sztuka polega na tym, aby litery były dobrze czytelne).
Hotel Tradewinds wykonuje świetną robotę dzięki prostemu krojowi pisma w stylu kursywy, który jest zarówno wystarczająco duży, jak i czytelny, aby można go było przeczytać na pierwszy rzut oka. Obsługa typografii odbywa się w prostym stylu bezszeryfowym, co pomaga podkreślić czcionkę wyświetlaną, a także ułatwia użytkownikowi przyswojenie.
Projektowanie działów
Niektóre ręcznie rysowane elementy służą celom czysto wizualnym. Istnieją po to, aby stworzyć projekt lub wyczuć projekt, który może być trudny do ustalenia w inny sposób. Te przegrody mogą być szczególnie zabawne, gdy są używane w małych miejscach w całym projekcie.
Mother's Brewing właśnie to robi. Na stronie głównej jest wielkie serce - to oczywiste. Ale są też małe elementy na prawie każdej innej stronie - niektóre oczywiste, niektóre całkiem ukryte. Każdy przycisk ma ręcznie rysowane akcenty z projektem wstążki, elementy pojawiają się w tle i nakładają się na elementy przesuwne, aby wypełnić martwą przestrzeń w projekcie. Ogólny efekt jest sprytny i interesujący wizualnie.
Aby ustawić nastrój
Ręcznie rysowane elementy często przybierają jaśniejszy, bardziej zabawny ton. Mogą nadać tego rodzaju klimat niemal każdemu projektowi, a im więcej ręcznie rysowanych elementów, tym jaśniejszy będzie projekt.
Znaki dla nauki to świetny przykład, jak spakować projekt ręcznie rysowanymi elementami, aby uzyskać przyjemną, niemal dziecinną estetykę (kolor również się przyczynia). Cała koncepcja ma bardzo specyficzny nastrój - od typografii po ikony i podkreślenia. Jest kreatywny, lekki i zachęca użytkownika do interakcji.
Zaprezentuj kreatywność
Ręcznie rysowana koncepcja projektowania może być świetną okazją do zaprojektowania portfolio witryny, ponieważ może kłaść nacisk na kreatywność. Elementy te kładą większy nacisk na proces projektowania oraz sposób myślenia i pracy, które mogą zostać wykorzystane w projekcie.
(Plus, to świetny sposób na rozciągnięcie tych kreatywnych mięśni.)
Feebles używa ręcznie rysowanych elementów zarówno dla głównego obrazu w powyższy sposób, jak i łączy się z ręcznie rysowanym logo w lewym górnym rogu. (Możesz go przegapić, jeśli nie przyjrzysz się uważnie.)
Dla ikon lub logo
Ponieważ jest to jedno z najpopularniejszych zastosowań ręcznie rysowanych elementów, nie było go na szczycie listy. (Głównie, aby pomóc ci pomyśleć o innych pomysłach, zanim przejdziesz do czegoś bardziej powszechnego).
Ręcznie rysowane akcenty mogą być doskonałym dodatkiem do ikony lub logo. Od squiggles po niecentralne kształty lub koła, które nie są całkiem okrągłe, niedoskonałość dodaje charakteru i uroku tam, gdzie nie potrafią tego idealne style kształtów komputerowych.
Higher Ground używa squiggle do oddzielania liter w logo w stylu ikony. Minimalistyczny styl jest uderzający i skuteczny, a ręcznie rysowany element nadaje mu pewnej osobowości, której prosta linia nie oddałaby.
Jako efekty animowane
Ożyw ręcznie rysowany element dzięki animacji.
Obrazy rysowane na ekranie mogą sprawiać przyjemność oglądanie i oglądanie. Chociaż oczywistą korzyścią dla użytkownika jest rozrywka, gdy ogląda, jak coś ożywa, istnieją również korzyści dla właściciela witryny: dłuższy czas spędzony na stronie i możliwość większej liczby konwersji.
Long Story Short wykorzystuje tę koncepcję na stronie głównej. Najpierw narysuj logo, które wykorzystuje ręcznie rysowany styl typografii. A następnie animowanie go w pakiet projektów, które poruszają się szybko i uwzględniają w tym procesie wiele rysunków ręcznych. Cała pętla trwa tylko kilka sekund.
Wniosek
Nawet jeśli nie możesz rysować, symulowanie ręcznie rysowanych elementów w projektach może nadać osobisty charakter, który docenią użytkownicy. Od typografii po gry i ładowanie animacji - elementy te mogą pokazać kreatywność i osobowość.
Chociaż ręcznie rysowany element nie jest przeznaczony dla każdego projektu, pomyśl o tym następnym razem, gdy musisz poprawić nastrój lub dodać coś, co zatrzyma użytkowników. Uprość ten pomysł i połącz go z motywem, który przenosi się przez cały projekt. I baw się dobrze! O to właśnie chodzi w tych elementach.
