Trend projektowania: tła z bąbelkami i kroplami
Czy zauważyłeś ostatnio wszystkie płynne, nieograniczone kształty w projektach projektowych? Stosowanie bąbelków i kropelek jest coraz bardziej popularne. Od prostych kółek do połączonych pętli, pełnoekranowych obiektów blob, które się poruszają i przesuwają, po proste animacje typu „blobby” - ten trend pojawia się wszędzie.
Zaletą jest to, że podczas gdy bąbelki i plamy są modnym elementem projektu, istnieje wiele różnych sposobów, aby to zrobić, i nie skończysz z projektem, który wygląda tak, jakbyś tylko próbował dodać modny element.
Tutaj mamy kolekcję mini case studies projektów stron internetowych z trendem projektowania bąbelków i kropel.
Tekstury tła
Wed'ze
Wed'ze wykorzystuje fajne kolorowe plamy - zdefiniowane przez nieco zaokrąglone elementy bez określonego kształtu - do wyróżnienia produktów. Kropelka skupia uwagę na każdym zestawie gogli narciarskich z wyraźną zmianą koloru, chociaż kształt pozostaje taki sam.
Zastosowanie ciekawego kształtu i koloru na czystym białym tle tworzy punkt centralny i sprawia, że produkt, który nie jest wcale taki wizualnie interesujący, jest czymś, z czym można się zaangażować.
Dzięki rozmiarowi każda kropelka tworzy również pewien przepływ kierunkowy od lewej do prawej na ekranie, zachęcając użytkownika do spojrzenia na kształt, okulary, a następnie opis przedmiotu.
Grupa Liber Finance
Liber Finance Group wykorzystuje serię animowanych bąbelków do stworzenia elementu sztuki. Pęcherzyki (zdefiniowane bardziej jako okrągły i sprężysty element projektu) zawierają pełne i wypełnione koła z nieruchomymi i ruchomymi częściami.
Pęcherzyki w tym projekcie służą jako wizualny wątek i łączą części witryny w całym projekcie. Kształt jest używany poniżej zwoju, aby pomóc zwrócić uwagę na tekst i klikalne elementy, a także stworzyć motyw dla projektu, który nie zawiera wielu innych wysoce wizualnych informacji.
Korzystanie z animacji to skuteczny sposób na wzbudzenie zainteresowania prostymi kształtami.
Drip Pop
Drop Pop używa kropli jako znaku logo na zbyt zajętym tle. (Strzeż się prędkości ruchu, jeśli klikniesz link).
Znak jest elementem pojemnika na znak słowny i działa z przedstawioną opcją projektową, ponieważ umożliwia wyświetlanie marki na ruchliwym i kolorowym projekcie.
Chociaż to leczenie logo jest tutaj interesujące, może być trudniejsze zastosowanie techniki takiej jak ta długoterminowa.
Josh Dring
Seria nakładających się obiektów blob tworzy wizualny kolaż dla strony internetowej portfolio Johna Dringa.
Dzięki zastosowaniu kolorów i ciekawych kształtów strona jest ciepła i zachęcająca. Chociaż możesz nie być w 100 procentach pewien, jaki rodzaj pracy wykonuje, abstrakcyjny projekt zachęca do klikania.
Korzystając z tła z kroplami, zastanów się nad warstwami elementów, aby uzyskać efekt głębi. Pomoże to przyciągnąć wzrok i sprawi, że projekt będzie bardziej wciągający.
Andy Patrick
Andy Patrick używa również obiektów blob na swojej stronie internetowej z portfolio, ale z zupełnie innym podejściem. Podczas gdy poprzedni przykład zawiera statyczne plamy, kształty w tym projekcie przesuwają się i poruszają z niewielkimi animacjami.
Każda kropelka ma również niemal trójwymiarowy charakter dzięki wyborowym kolorom gradientu, które podkreślają zaokrąglony charakter każdej kropelki. Wydaje się, że możesz wyciągnąć rękę i dotknąć tych elementów. (Wyobrażam sobie, że mają miękką, sprężystą teksturę dobrej piłki stresowej.)
Iqor
Iqor wykorzystuje wydłużone bąbelki jako część sceny nieba i pozwala użytkownikom patrzeć poza chmury i zobaczyć, co robi firma.
Podczas gdy te bąbelki mają charakter statyczny, zapewniają ruch kierunkowy dzięki skojarzeniu z czymś, co się porusza (chmury na niebie). Działają wyjątkowo dobrze dzięki zawartym w nich informacjom, służąc jako element artystyczny i informacyjny.
Studio Volbloed
Studio Volbloed używa kolejnej statycznej bańki do zdjęć w stopce strony Informacje, aby pokazać kobiety stojące za firmą.
Podczas gdy większość ludzi początkowo myśli o bąbelkach jako dekoracyjnych kształtach, mogą one również służyć jako elementy pojemnika na obrazy. To, co sprawia, że te bąbelki działają, to piękny sposób łączenia kształtów w celu utworzenia jednego obrazu.
Okrągły kształt jest również odzwierciedlony w innych miejscach w całym projekcie, aby uzyskać lekką bąbelkową obecność, która jest wizualnie harmonijna.
Unter Freiem Himmel
Unter Freiem Himmel używa dwóch animowanych bąbelków, które wyglądają jak bąbelki podczas ładowania ekranu. Animacja szybko się zatrzymuje, aby uzyskać niemal idealnie okrągłe kształty nad nazwą strony.
Kursor jest również prostą bańką.
Proste piękno animowanych bąbelków w tym projekcie jest imponujące i piękne. Ten przykład pokazuje, że nie trzeba dodawać wielu elementów i technik, aby uzyskać efektowny projekt. Jak pokazuje ta strona, wrodzone piękno tkwi w prostocie.
Hashworks
Ostatni przykład w tej kolekcji pochodzi z Hashworks. Na pierwszy rzut oka możesz nawet nie zobaczyć tak naprawdę plam; są połączoną jednostką, która służy jako logo firmy. Ale duża wersja logo po prawej stronie zawiera fajną i bardzo efektowną animację. (Kliknij, aby zobaczyć, jak działa.)
Animowana kropla zawiera kilka elementów, które działają jak krople oleju w wodzie o płynnym wyglądzie z wyraźnym rozdziałem. Poruszają się, składają i odbijają, aż każda pojedyncza kropelka w ruchu tworzy połączone logo pojedynczego kropelka.
Jest to jedna z tych prostych i genialnych animacji, które można oglądać w kółko, ponieważ jest tak dobrze zrobiona. Ten przykład - choć nie pełny projekt - jest najlepszym przykładem tego trendu w działaniu.
Każda bańka jest inna
Wspaniale jest, gdy trend w designie obejmuje technikę, którą możesz stworzyć własną. W przeciwieństwie do trendu kolorystycznego, w którym „wszyscy” używają jednego odcienia, trendów odstępów lub grupowania, które mają podobny charakter, użycie bąbelków i plam może być całkiem inne dla każdego projektu.
Niewiele przykładów z powyższych mini studiów przypadków wygląda podobnie, reprezentują różne rodzaje przemysłu i pochodzą z różnych lokalizacji na całym świecie. Wszystkie mają wspólne zastosowanie bąbelków i kropelek.
