Trendy w projektowaniu witryn internetowych 2016, które należy wziąć pod uwagę przed utworzeniem witryny

dk new media strona 1

Widzieliśmy wiele firm zmierzających w kierunku czystszego i prostszego środowiska dla użytkowników witryn. Niezależnie od tego, czy jesteś projektantem, programistą, czy po prostu kochasz strony internetowe, możesz się czegoś nauczyć, przyglądając się, jak to robią. Przygotuj się na inspirację!

  1. Animacja

Pozostawiając za sobą wczesne, krzykliwe dni internetu, które były pełne migających gifów, animowanych pasków, przycisków, ikon i tańczących chomików, animacja oznacza dziś tworzenie interaktywnych, responsywnych działań, które poprawiają opowiadanie historii i zapewniają bogate wrażenia użytkownika.

Przykłady bogatej animacji obejmują ładowanie animacji, nawigację i menu, animacje po najechaniu kursorem, galerie i pokazy slajdów, animację ruchu, przewijanie oraz animacje i filmy w tle. Sprawdź tę witrynę firmy Beagle, platformy do zarządzania propozycjami:

Animowana witryna internetowa Beagle

Kliknij, aby zobaczyć niesamowitą animację JavaScript i CSS firmy Beagle podczas przewijania strony.

Bogatą animację można również zobaczyć w mikro-interakcji. Na przykład na LinkedIn użytkownik może najechać kursorem na kartę, aby wyświetlić subtelne menu podręczne z opcjami, a następnie wybrać opcję pominięcia historii lub wykonania innych czynności.

Animacje GIF (radośnie?) Powróciły i mogą być używane do wielu różnych celów, w tym do komedii, demonstracji, a nawet do dekoracji.

  1. Materiał Projektowanie

Materiał Projektowanie, język projektowania opracowany przez Google, opiera się na elementach projektowania opartego na druku - typografii, siatkach, przestrzeni, skali, kolorze i wykorzystaniu obrazów - wraz z responsywnymi animacjami i przejściami, wypełnieniem i efektami głębi, takimi jak oświetlenie i cienie do zapewniają bardziej realistyczne, angażujące i interaktywne wrażenia użytkownika.

Material Design wykorzystuje cień, ruch i głębię, aby zapewnić czystą, nowoczesną estetykę z naciskiem na optymalizację UX bez zbyt wielu dzwonków i gwizdów.

Inne przykłady projektowania materiałów obejmują obrazy od krawędzi do krawędzi, typografię na dużą skalę i celowe białe znaki.

Koncepcja przeprojektowania YouTube Android Material Design

  1. Projekt płaski

Podczas gdy Material Design oferuje jedno podejście do koncepcji minimalizmu, płaska konstrukcja pozostaje klasycznym wyborem dla miłośników czystych linii. Oznacza to, że płaska konstrukcja jest często postrzegana jako bardziej realistyczny, autentyczny i wygodny wygląd cyfrowy.

Space Needle

Opierając się na zasadach białej przestrzeni, określonych krawędzi, żywych kolorów i ilustracjach 2D - lub „płaskich” - płaska konstrukcja oferuje wszechstronny styl, który często wykorzystuje techniki takie jak ikonografia linii i długie cienie.

Lądownik

  1. Podzielone ekrany

Najlepiej sprawdza się, gdy masz dwa równie ważne obszary do promowania lub chcesz oferować treści obok zdjęć lub multimediów, podzielone ekrany to nowy wspaniały sposób na zapewnienie zabawnego i odważnego doświadczenia użytkownika.

split-screen

Pozwalając użytkownikom na wybór treści i doświadczenia, możesz stworzyć portal, który zachęci odwiedzających do wejścia.

ocean na podzielonym ekranie

  1. Upuszczanie Chrome

Nawiązując do chromowanych zderzaków i ozdób w klasycznych samochodach, „chrom” odnosi się do kontenerów witryny - menu, nagłówków, stopek i obramowań - które obejmują główną zawartość.

czas chromu

Może to rozpraszać uwagę, a wiele firm decyduje się na oderwanie się od kontenerów i stworzenie czystych, pełnych krawędzi układów bez obramowań, nagłówków ani stopek.

chrome-forward

 

  1. Zapomnij o fałdzie

„Powyżej zakładki” to żargon prasowy na pierwszej połowie pierwszej strony gazety. Ponieważ gazety są często składane i umieszczane w pudełkach i ekspozytorach, najbardziej przekonująca treść znajduje się powyżej strony strony zakładki, aby dać im największą szansę na złapanie potencjalnego czytelnika (i jego portfela).

Projekt strony internetowej od dawna opiera się na założeniu zakładki, zgodnie z którą przewijanie jest uciążliwe. Ale ostatnio pełnoekranowe obrazy i treści witają użytkownika i zachęcają do przewijania, aby odsłonić dodatkowe, bardziej szczegółowe treści.

plamistość nasion

  1. Wideo na pełnym ekranie

Wideo może być świetnym sposobem na przyciągnięcie uwagi odwiedzających, a często jest nawet skuteczniejsze niż materiały wizualne lub tekst. Zapętlone filmy, takie jak te używane przez Apple dla Apple Watch, to wyjątkowy sposób na nadanie tonowi i przyciągnięcie odwiedzających.

DK New Media

Kliknij, aby zobaczyć DK New Mediawideo na ich stronie głównej

Jeśli chodzi o projektowanie stron internetowych, wiele konkretnych elementów będzie podyktowanych przez branżę, niszę, rynek docelowy i zawartość. Twój układ będzie zależał od tego, na co zareagują użytkownicy i co jest najbardziej sensowne dla Twojej wiadomości. Ale mając pod ręką te trendy, będziesz mieć wszystko, czego potrzebujesz, aby stworzyć atrakcyjną stronę internetową, która robi to, czego potrzebujesz, i pokazuje, że wiesz, jak nadążać za duchem czasu.

Co o tym myślisz?

Ta strona używa Akismet do redukcji spamu. Dowiedz się, jak przetwarzane są dane komentarza.