Articles

21 wielokrotnie nagradzane projekty stron internetowych i co zrobili dobrze

internet jest pełen niesamowitych i inspirujących stron internetowych.

te specjalne płatki śniegu to te, które znajdują innowacyjne sposoby wykorzystania wszystkich możliwych granic projektowych i technologicznych na swoją korzyść, aby stworzyć doświadczenia, które wiele organizacji chciałaby mieć.

znalezienie tych diamentów w trudnych warunkach może być niesamowitym wyzwaniem, zwłaszcza jeśli planujesz przeprojektowanie strony internetowej i nie wiesz, od czego zacząć.,

na szczęście strony takie jak CSS Awards, Awwwards, Webby Awards itp. istnieją, aby pomóc wyróżnić miejsca, które powinniśmy popchnąć nasze własne do refleksji.

aby pomóc zaprezentować niektóre z tych nagradzanych witryn, zanurzyłem się w każdej z tych nagradzanych witryn i wyciągnąłem te, które są nie tylko pięknymi przykładami nowoczesnego designu, ale także ćwiczyłem UX, UI, architekturę informacji, optymalizację współczynnika konwersji, marketing wideo, taktykę do ich pełnego potencjału.

patrząc na każdą witrynę, ważne jest, aby zrozumieć, że nie powinny one być postrzegane jako szablony, które należy próbować skopiować., Zamiast tego przeanalizuj je i znajdź ich części, które wykorzystują strategie projektowania / marketingu / treści, które można zmienić i zmienić w coś, co pasuje do odbiorców.

mając to na uwadze, ciesz się tymi zabójczymi przykładami 17 nagradzanych projektów stron internetowych wykonanych dobrze.

raczej oglądać? Oto 5 moich ulubionych!,

programowanie sportowe ESPN

wyróżniony na awwwards

ESPN przenosi swoją zawartość sportową i programowanie na wyższy poziom dzięki tej dynamicznej i przyciągającej wzrok witrynie wypełnionej dużymi obrazami i wideo o wysokiej rozdzielczości. Strona wykorzystuje wideo w tle, aby nadążyć za energią i sekcjami sieci sportowej z subtelnymi efektami zawisu i przejścia oraz aby zapewnić płynne wrażenia użytkownika., Suwak „polecane sporty” zachwyca i doskonale prezentuje każdą dyscyplinę sportową wraz z interesującymi statystykami i informacjami na temat dostępnych programów.

montaż

opisywany na Awwwards

montaż przenosi swój produkt na wyższy poziom dzięki tej łatwej do manewrowania stronie głównej, która wyraźnie określa, czym jest jego produkt, jak wygląda, jakość produktu i referencje., Witryna jest doskonałym przykładem jednego podejścia, którego możesz użyć, aby wyróżnić swój produkt i najważniejsze punkty, na które użytkownicy będą zainteresowani znalezieniem odpowiedzi. Lepka pod-nawigacja pozwala użytkownikom łatwo poruszać się po stronie, aby znaleźć dokładnie to, czego szukają.

Zillow

wyróżnione na Webby Awards

znalezienie idealnego domu polega na tym, że możesz wygodnie wyszukać dokładnie to, czego szukasz, zapisać i przechowywać to, co lubisz, i ułatwić znalezienie tego wszystkiego później., Zillow uderza w gwoździe dla wszystkich trzech z tych punktów dzięki intuicyjnej stronie Nieruchomości. Obszar wyszukiwania w obszarze bohatera ułatwia nowym użytkownikom szybkie wybieranie i wyszukiwanie ofert bez konieczności szukania ukrytej strony wyszukiwania.

Revols

wyróżniony na CSS Design Awards

Revols odważnie prezentuje swoją stronę internetową, powiększając swoje małe, wyrafinowane słuchawki za pomocą fotografii makro i wideo., Fotografia i wideo sprawiają, że strona jest niesamowicie skoncentrowana na produkcie, więc jej użytkownicy powoli stają się coraz bardziej zanurzeni w doświadczeniu, jakie mogą dać ci te słuchawki. Zabieg dużej czcionki na tej stronie jest również miłym akcentem i dodaje większej niż życie fotografii dousznej.

Ołówek Fiftythree

dostępny na stronie SiteInspire

Fiftythree rejestruje wszystkie funkcje i zalety rysika na tej samodzielnej stronie produktu., Tym cechom i zaletom towarzyszą obrazy ilustrujące działanie produktu, dzięki czemu użytkownik ma łatwiejszą wizualizację i sposób zastosowania produktu. Układ i wizualne traktowanie sekcji anatomii produktu są również bardzo unikalne i działają jako dynamiczny sposób, aby skłonić użytkowników do przeczytania więcej o produkcie, w przeciwieństwie do sekcji statycznych jeden po drugim.,

Morgan Stanley

wyróżnione na Webby Awards

W przeciwieństwie do tradycyjnych witryn skupiających się na produktach, Morgan Stanley nagłówki swojej strony głównej z artykułem, mają nadzieję, że przyciągną znaczną ilość ruchu (zwłaszcza, że łączy się z wakacyjnymi spotkaniami rodzinnymi, w których spodziewamy się uczestniczyć). Reszta układu poza stroną główną bohater gra z układem skupionym na siatce, aby uporządkować asortyment ostatnio opublikowanych artykułów.

7., Boosted

wyróżniony na Awwwards

Boosted wzniósł to, co mogło być postrzegane jako Przeciętna deskorolka na wyższy poziom, wprowadzając zadziwiająco szczegółowe zdjęcia swojego produktu wraz ze szczegółowymi opisami na swojej stronie. Szare odcienie i białe tło strony pomagają skupić się na pomarańczowych przyciskach call-to-action i jaskrawo kolorowej deskorolce, której używają jako przykładu produktu., Uwielbiam również fakt, że mają blog, który wydaje się podkreślać problemy, które mają/dotyczą produktu, dodając wspaniały poziom przejrzystości do firmy.

8. Wozber

wyróżniony na SiteInspire

Wozber wykonał zabójczą pracę, przerywając krok po kroku proces, którego potrzeba, aby upewnić się, że Twoje CV jest idealne do tej wymarzonej pracy, której szukasz. Jego Strona główna wyraźnie przedstawia kroki z przodu, które są następnie wyjaśnione w poszczególnych sekcjach poniżej.,

strona zawiera nawet przykłady niektórych CV, które stworzyli, dzięki czemu łatwo możesz zobaczyć dokładnie, jak może wyglądać gotowy produkt, zanim zdecydujesz się na rejestrację.

Opus rośnie

wyróżnione na stronie CSS Winner

Opus napędza do domu ekologiczne, naturalne i zdrowotne korzyści swojej gleby, dodając obfite ilości zieleni na całej stronie. Przy tak wielu różnych opcjach gleb doniczkowych może być trudno zdecydować, która z nich jest najzdrowsza dla twoich roślin lub ogrodu., Opus udowadnia, że jego produkt jest najlepszy, zwracając uwagę na składniki i właściwości fizyczne, które oferują jego gleby, które odróżniają go od tradycyjnej marki. Byłem również bardzo zadowolony, widząc, że blogują i od czasu do czasu mieszają się w bardziej zachwycających postach, aby dotrzeć do szerszej publiczności, takiej jak ta.

Zero Financial

wyróżnione na Awwwards

zdecydowanie zbyt często firmy programistyczne mają bardzo piękne strony internetowe, które zupełnie nie mają żadnych obrazów swoich produktów., Jeśli jesteś obecnie na tym stanowisku i szukasz inspiracji, Zero to fantastyczna strona dla inspiracji. Wykorzystanie obrazów wraz z opisowym tekstem, który wyjaśnia każdy, sprawia, że produkt jest o wiele bardziej realny i relatable dla osób zainteresowanych.

Cap HPI

opisywany na Awwwards

Cap HPI pomaga dostarczyć szeroką gamę danych motoryzacyjnych do różnych osób. Mając to na uwadze, Cap HPI stworzyło swoją stronę internetową, aby osoby te miały łatwy czas na znalezienie rozwiązania, którego szukają., Aby to ułatwić, zoptymalizowano nawigację, abyś mógł szybko zrozumieć, czy CAP HPI może Ci pomóc.
poza tym, projekt strony, subtelne animacje i unikalna paleta kolorów sprawiają, że witryna jest zachwycającym i odświeżającym doświadczeniem wizualnym na rynku, który w przeciwnym razie mógłby mieć bardzo mdły, korporacyjny układ.

Kołczan

wyróżniony na Awwwards

mimo, że strona jest mniejsza od innych, Kołczan wciąż potrafi zabłysnąć wśród reszty.,
uwielbiam fakt, że wykorzystują emocje natychmiast po przybyciu na stronę główną z tłem i kopią. Udało im się nawet uzyskać tam formularz rejestracji, a nie tylko włączyć przycisk, który wysyła odwiedzających do osobnej strony rejestracji.
strony produktów i funkcji Quiver wykonują piękną pracę, wyświetlając wygląd oprogramowania wraz z małymi interaktywnymi elementami, które pomagają pokazać, jak działa produkt.,

Wordstack

wyróżniony w CSS Winner

Wordstack wykonał świetną robotę, utrzymując małą, skondensowaną i uporządkowaną stronę, jednocześnie dostarczając całą wartość, jaką oferuje produkt. Duże, pełnowymiarowe obrazy oraz spójna paleta kolorów i stylizacja na wszystkich stronach sprawiają, że projekt jest niezwykle jednolity, który bardzo dobrze łączy się z paletą kolorów oprogramowania.,

Campos Coffee

wyróżnione na CSS Design Awards

Niektórzy klienci uwielbiają oferować produkty, o których wiedzą, że są tworzone i tworzone przez firmy, które chcą dostarczać swoim klientom wysokiej jakości produkty. A firmy takie jak Campos Coffee wiedzą dokładnie, jak zaspokoić tych nabywców.

Campos wykorzystuje swoją stronę internetową jako sposób na podkreślenie czasu i wysiłku, jaki zespół wkłada w kawę, jak przynosi to korzyści społeczności i dlaczego poczujesz się dobrze, kupując ją., Wszystkie te punkty są owinięte w wspaniałą historię, którą wyświetlają na stronie głównej i na każdej innej stronie witryny.

Kin

wyróżnione na SiteInspire

zamiast wyróżniać tylko funkcje, Kin przechodzi do następnego kroku i wykorzystuje swoją stronę główną, aby zaprezentować zalety swoich produktów, dzięki czemu ludzie wiedzą dokładnie, do czego produkt może być używany przed wyruszeniem do innych obszarów na stronie.,

jeśli chodzi o design, użycie przez Kin większej czcionki serif w całej witrynie wraz z prawdziwą fotografią biurową pomaga dodać ogromnej wiarygodności marce. Pozwala również klientowi wiedzieć, że za niesamowitym produktem stoją prawdziwi, sympatyczni ludzie, zamiast pozostawiać to domysłom.

SeaStreak

wyróżniony na Webby Awards

szukasz podróży promem, ale nie wiesz, dokąd się udać? SeaStreak ma cię w dobrych rękach. Interfejs użytkownika witryny jest zorganizowany, dzięki czemu możesz szybko zbudować harmonogram promów, który działa dla Ciebie., Uważam również, że nawigacja jest niezwykle interesująca. Menu trasy i harmonogramy spada, aby pokazać wszystkie dostępne opcje, a menu jednodniowe wycieczki i wypady jest już segmentowane dla użytkowników, którzy są na stronie, szukając dokładnie tego. Elementy te pomagają stworzyć wygodę dla użytkownika i szybkość, więc nie pozostają w ciemnej dziurze witryny, próbując dowiedzieć się, jak szukać tego, czego chcą.,

s Bottle

elegancki produkt S Bottle jest specjalnie traktowany podczas projektowania strony, aby podkreślić jej innowacyjne piękno i zalety. Wykorzystanie butelki w różnych animacjach sprawiło, że strona jest bardziej angażująca i zwiększa zainteresowanie poznaniem więcej o produkcie.

Ocean Health Index

wyróżniony na W3 Awards

Ocean Health Index pomaga wnieść piękno oceanu do sieci dzięki oszałamiającemu układowi, wizualnym obrazom i chłodnej palecie kolorów., Duże użycie czcionki w całej witrynie pomaga również zachować łatwość czytania i profesjonalizm.

19. WealthSimple

wyróżnione na Awwwards

wykorzystanie przestrzeni w Wealthsimple sprawia, że niezwykle łatwo jest podzielić każdą sekcję swoich stron. Piękne gify na całej stronie również stanowią ekscytujące doświadczenie, zwłaszcza, że nie odnoszą się bezpośrednio do inwestowania.
strona sprawia, że inwestowanie wydaje się o wiele przyjemniejsze., Zamiast prezentować arkusze kalkulacyjne, stosy gotówki i tandetny język, upewniają się, że wyróżniają markę WealthSimple, więc nie wydaje się, aby każdy inny program inwestycyjny lub usługa

Toggl

prezentowana na CSSDesignAwards

dziwaczna Animacja na stronie głównej Toggl natychmiast zwraca uwagę użytkownika w dniu przyjazdu. Ten styl obrazów jest przenoszony przez pozostałe sekcje z prostymi grupami pól zawartości bezpośrednio obok każdego z nich.
Toggl zwraca również szczególną uwagę na to, jak rzeczy ożywiają się podczas ładowania strony., Na przykład strona cen Toggl zanika w hero, a następnie każdy obszar cen od lewej do prawej. Dbałość o te szczegóły sprawia, że wrażenia z witryny są znacznie bardziej dopracowane.

Shademaster

opisywany na CSSDesignAwards

patrząc na pokrycia dachowe może nie brzmi przyjemnie dla przeciętnego właściciela domu, ale Shademaster dba o to, aby tak było.

strategicznie podzielili rodzaj wykonanej pracy na projekty dachów w nav, które wysyłają użytkownika na poszczególne strony, gdzie mogą zaplanować i zaprojektować idealny dach i otrzymać wycenę., Takie podejście sprawia, że proces zakupu dachu jest o wiele bardziej autonomiczny dla użytkowników; nie ma potrzeby, aby ktoś odwiedzał twój dom, tylko po to, aby coś zacząć.

szukasz własnej strony internetowej?

Twoja strona ma być twarzą twojej obecności w Internecie i sposobem na wirtualną reprezentację Twojej marki. Jeśli Twoja strona nie utrzymuje projektu, który pasuje do sposobu, w jaki chcesz być postrzegany, ostatecznie nie będzie działać optymalnie., IMPACT uwielbia współpracować z innymi firmami, aby zrozumieć, jak chcesz, aby Twoja strona internetowa naprawdę wyglądała, abyśmy mogli pomóc ci w realizacji strategii.

myślisz, że nadszedł czas, aby Twoja strona internetowa przeszła lifting, na który zasługuje, aby lepiej reprezentować Twoją markę i ostatecznie zwiększyć jej wydajność? Porozmawiaj z nami i opowiedz o celach i aspiracjach Twojej witryny.