Wady i zalety minimalistycznego wzornictwa
Minimalizm to trend, który nigdy nie umrze. Bez względu na to, ile razy zachwyca nas imponująco skomplikowane projekty, zawsze znajdzie się coś w prostocie, która pozostawi nas tak samo schwytanych.
Dzisiaj przyjrzymy się niektórym kluczowym aspektom minimalizmu w projektowaniu stron internetowych oraz kilku przykładom projektantów, którzy dobrze to zrobili.
Przeglądaj zasoby projektowe
Co to nie jest
Prawie zawsze dobrym pomysłem jest zbadanie, czego nie ma w dyskusji na ten temat. Badanie przeciwieństw daje nam punktowy kontrast i pomaga kształtować definicję. Zasadniczo minimalizm jest odejściem od tego, co zbędne wizualnie. Bogato zróżnicowane palety kolorów i złożone elementy są pomijane na rzecz prostych jednolitych kolorów i podstawowych linii.
Rozważ dwa przykłady poniżej. Strony te stanowią wyraźną alternatywę dla minimalistycznego sposobu myślenia. Są wizualnie dość zajęci i ich eksploracja może zająć chwilę, zanim poczujesz, że masz przyzwoitą wiedzę o tym, co dzieje się na stronie.
Czy to czyni je złymi projektami? Absolutnie nie. Chociaż wielu projektantów wyraźnie preferuje określone style, przypisywanie deklaracji wartości do danej metody jest równie przydatne, jak stwierdzenie, że niebieski jest lepszy niż zielony, a lewy jest lepszy niż prawy; po prostu nie ma prawdy w tych stwierdzeniach i nic nie zyskuje się w dyskusji na temat takich możliwości.
Jeśli jesteś profesjonalnym projektantem, powinieneś być w stanie pobrać dowolną liczbę stylów projektowania, aby zadowolić wolę i osobowość swojego klienta. Odpowiedź na pytanie, czym nie jest minimalizm, polega na tym, że nie jest to z natury lepsze podejście do projektowania stron internetowych. Kluczem staje się zatem nie decydowanie, czy bardziej lubisz zajęty, minimalistyczny czy jakikolwiek inny styl projektowania, ale nauka efektywnego wdrażania każdej metody. Przeanalizujmy kilka obszarów, na których należy się skupić przy tworzeniu minimalistycznego projektu.
Typografia
Wybór typografii odgrywa ogromną rolę w skuteczności minimalistycznego projektu. Wybierz czyste, proste czcionki o wysokim stopniu czytelności. Cienkie czcionki są często używane do przekazywania minimalizmu, ale nie ograniczaj się do tego pomysłu, ponieważ gruba czcionka to świetny sposób na zaprezentowanie ważnego elementu, takiego jak nagłówek.
Z tego samego powodu możesz nawet uzyskać solidny, minimalistyczny design za pomocą skomplikowanej, skryptowej czcionki. Spróbuj maksymalnie uprościć stronę i inną typografię, używając skryptu, aby zwrócić uwagę na pojedynczy obszar na stronie.
Dodatkowe zasoby
40 darmowych minimalistycznych i wysokiej jakości czcionek
70 przykładów minimalistycznej typografii
Silne wyrównania siatki
Moją ulubioną implementacją minimalizmu jest osiągnięcie celu zwiększenia użyteczności. Dobry minimalistyczny projekt strony internetowej często koncentruje się na usuwaniu strony z minimalnej liczby oddzielnych sekcji, a elementy są w taki sposób, że nawigacja treści jest prawie pozbawiona jakiejkolwiek krzywej uczenia się lub zamieszania wizualnego.
To bardzo często skutkuje łatwo widocznymi dopasowaniami opartymi na siatce. Nasze oczy są bardzo zaznajomione z tym wzorem treści i zwykle nie mają problemu z jego uporządkowaniem w mgnieniu oka. Co więcej, w twoim mózgu jest coś, co po prostu chce, aby przedmioty ułożyły się odpowiednio i w przewidywalny sposób. Przyjemnie jest widzieć stronę z silnym wyrównaniem w pionie i poziomie. W przeciwieństwie do tego istnieje pewien dysonans wizualny i psychologiczny, kiedy nie możemy natychmiast zidentyfikować wyraźnego wzorca w rozmieszczeniu elementów na stronie.
Dodatkowe zasoby
Siatka CSS 1KB
ZURB CSS Grid Builder
Kontrast
Jeśli masz minimalistyczny projekt i wydaje się, że czegoś brakuje, szanse na dodanie kontrastu znacznie poprawią projekt. Gdy sprawowana jest przez wyćwiczoną rękę, kontrast jest kluczem do każdego dobrego projektu (bronię tego ogólnego stwierdzenia na śmierć). W minimalistycznym projektowaniu stron strony są tak rozebrane, że nie ma nic więcej do roboty niż jakiś sprytny kontrast.
Kontrast to koncepcja, którą wszyscy rozumiemy z natury, ale uświadomienie jej sobie może radykalnie ulepszyć twoje projekty. Sprawdź prosty projekt poniżej:
Naprawdę niewiele się tu dzieje, jeśli chodzi o kolorowe i ładne zdjęcia. Jednak konstrukcja jest dość atrakcyjna ze względu na silne użycie kontrastu. Nagłówek i obszar treści są wyraźnie oddzielone i natychmiast rozpoznawalne po tym, czym są (stopka używa tej samej sztuczki). Kopia na stronie różni się rozmiarem i śmiałością, aby zwrócić uwagę na te fragmenty wiadomości, które projektant uznał za ważne.
Powyższa strona używa odcieni szarości do różnicowania, ale równie łatwo możesz użyć różnych kolorów, aby osiągnąć to samo.
Pamiętaj tylko, że istnieje ogromna różnica między kontrastującymi i sprzecznymi kolorami. To, że dwa kolory są bardzo różne, nie oznacza, że twoje oczy będą postrzegać różnicę jako przyjemną. Upewnij się, że znasz swoją teorię kolorów, zanim podejmiesz drastyczne decyzje.
Najważniejszą rzeczą do zapamiętania z kontrastem jest najlepiej autor projektu Robin Williams: „Nie bądź mięczakiem!” Rozumiała przez to, że odrobina kontrastu nie idzie daleko. Jeśli zamierzasz zrobić coś większego, aby się wyróżniał, uczyń go znacznie większym. Jeśli chcesz, aby był odważniejszy, spraw, aby był naprawdę odważny! Powinieneś być w stanie natychmiast stwierdzić, czy istnieje kontrast. Widzimy to często, gdy tekst jest pogrubiony. Czasami różnica między pogrubionym tekstem a zwykłym tekstem jest tak niewielka, że trzeba naprawdę patrzeć, aby zobaczyć różnicę! W tym przypadku pogrubiony tekst nie ma żadnego celu i powinien być taki sam jak reszta, aby zapobiec pomyłkom wizualnym.
Biała przestrzeń
Wróć do zajętych przykładów na początku tego artykułu. Ci projektanci postanowili wypełnić prawie każdy cal ekranu czymś interesującym wizualnie. Minimalizm znów przyjmuje odwrotne podejście. Daje to głównym elementom strony wystarczająco dużo miejsca do oddychania, które je wyróżnia.
Białe znaki sprawiają, że widz czuje się komfortowo i jest mniej klaustrofobiczny. Pomaga także projektantowi kontrolować, gdzie ma patrzeć widz. Niektórzy projektanci nalegają, aby przeglądający czytali każdą stronę od lewej do prawej zgodnie ze wzorem Z. Nie jest to po prostu prawda we wszystkich przypadkach. Zauważ, jak powyższy projektant użył białych znaków i jasnego obrazu, aby przyciągnąć wzrok do obrazu na ekranie komputera. Twoje oczy zaczynają się w samym środku obrazu, a nie w lewym górnym rogu!
Ma to wszystko wspólnego z kontrastem, jak wspomniano powyżej, oraz ilością miejsca zajmowanego przez dany obiekt w porównaniu do otaczających go białych znaków. Aby poczuć odpowiednią ilość białych znaków do użycia podczas wstępnego układu, często przekształcam obiekty, które umieszczam na stronie, w niezwykle podstawowe kształty w programie Illustrator. Następnie mogę szybko przetasować i zmienić rozmiar obiektów bez rozpraszania ich zawartością. Takie rozmieszczenie zmusza Cię do zastanowienia się nad równowagą strony, zanim jeszcze podejdziesz do bardziej złożonych elementów estetycznych.
Jak widać, układ Jolicloud jest dość zrównoważony i atrakcyjny, gdy patrzy się w ten sposób. Jedną z rzeczy, które mnie wkurza, jest to, że łącza nawigacyjne nie są zgodne z prawą stroną treści. Przesadziłem trochę w wersji uproszczonej, aby było łatwiej zobaczyć, ale na pewno jest tak również na oryginalnym obrazie. Ponownie widzimy korzyść ze zredukowania strony do podstawowych kształtów, ponieważ natychmiast staje się oczywiste, że łącza nawigacyjne są nieco niezręcznie rozmieszczone (ani wyrównane do środka ani wyrównane do prawej, ale gdzieś pomiędzy).
Więcej artykułów na temat minimalizmu
Nie możesz uzyskać wystarczającego minimalizmu? Sprawdź świetne artykuły i witryny poniżej:
- 21 zasobów, szczególnie dla miłośników minimalizmu: Vandelay Design
- Prezentacja czystych i minimalistycznych wzorów: Smashing Magazine
- Minimalizm w sieci: Inspiracje projektowe i motywy WP: Samouczek 9
- 20 pięknych minimalistycznych motywów WordPress: sześć wersji
- 25 pięknych minimalistycznych projektów stron internetowych: Vandelay Design
Wniosek
To kończy naszą dyskusję na temat minimalizmu w projektowaniu stron internetowych. Daj nam znać, co myślisz o tym trendzie w komentarzach poniżej. Pamiętaj także o dołączeniu linków do ulubionych stron, które są przykładem minimalizmu w projektowaniu stron internetowych.