Potrzebujemy stylowego projektu w płaskim stylu. Proste czcionki w stylu projektowania

Dziś skupimy naszą uwagę na jednym z najpopularniejszych obszarów współczesnego projektowania graficznego, jakim jest flat design.

Słynny artysta Edgar Degas powiedział kiedyś: „Sztuka to nie to, co widzisz, ale to, co pozwalasz zobaczyć innym”. Dotyczy to również projektowania graficznego, które również można określić jako sztukę, która decyduje Szczególnym zadaniem. Projekt graficzny ma możliwość zmiany nastroju i przekazu poprzez najmniejsze zmiany kształtów i odcieni, liter i odstępów. Trendy w tym obszarze, które stały się integralną częścią Życie codzienne, gdyż wpływają na proces decyzyjny i rozwiązują problemy prezentacji nowoczesnego produktu, a także kształtują gusta użytkowników.

Dziś terminu „płaska konstrukcja” używa się w grafice do wielu celów i zadań, które mają wspólne cechy stylistyczne. Płaski design to trend, który znalazł wiele przejawów w obszarze produktów cyfrowych, dzięki lakonicznemu zastosowaniu wizualnych środków wyrazu.

Obecnie termin ten jest powszechnie używany jako przeciwieństwo „bogatego designu” ze względu na harmonijną prostotę, która stanowi podstawę tego podejścia. Najbardziej zauważalną cechą, która dała nazwę temu ruchowi, jest użycie płaskich, dwuwymiarowych szczegółów wizualnych w przeciwieństwie do wysoce realistycznych i szczegółowych obrazów skeuomorficznych. Płaska konstrukcja na przestrzeni ostatnich lat aktywnie się rozwija, obejmując coraz większe obszary projektowania graficznego, które znajdują szerokie i różnorodne zastosowania w dziedzinie projektowania cyfrowego na potrzeby Internetu i Internetu. interfejsy mobilne. Podejście to można postrzegać jako styl promujący użyteczność i harmonię wizualną interfejsów użytkownika.

Historia płaskiej konstrukcji

Oczywiście płaska konstrukcja nie pojawiła się z powietrza. Za jego pochodzenie uważa się zwykle styl szwajcarski. Styl szwajcarski, znany również jako Międzynarodowy Styl Typograficzny lub w skrócie styl międzynarodowy, to ruch, który powstał w latach dwudziestych XX wieku, ale spotkał się z wielką krytyką, a następnie w latach czterdziestych i pięćdziesiątych XX wieku przeżył dramatyczne odrodzenie w projektowaniu graficznym w Szwajcarii. mocny fundament projektowania graficznego połowy XX wieku na całym świecie. Założycielami tego ruchu twórczego byli Joseph Müller-Brockmann i Armin Hofmann.

Według strony internetowej Design Is History: krótki opis kluczowe cechy tego stylu przedstawia się następująco: „...styl nastawiony na prostotę, czytelność i obiektywizm. Spuścizną tego stylu jest użycie czcionek bezszeryfowych, siatek i układów asymetrycznych. Zdjęcia wyróżniają się także jako środek komunikacji wizualnej. Główne wpływowe dzieła zostały zaprojektowane w formie plakatów, które były najbardziej uważane Skuteczne środki dostarczanie informacji."

Z plakatów przedstawionych jako przykłady widać, że przypadły do ​​gustu zwolennikom tego stylu proste kształty, pogrubione i rygorystyczne czcionki z wysoki stopień czytelność, geometryczne zestawienia detali, płaskie ilustracje i przejrzystość hierarchia wizualna. Szwajcarskie wzornictwo szybko stało się coraz bardziej popularne w różne kraje i otrzymał nowe życie w sztuce początku XXI wieku.

Chociaż ten styl otrzymał wiele wyrażeń w tej dziedzinie projekt wizualny do druku: plakatów, znaczków, kartek, okładek książek, czasopism itp., w epoce projektowania cyfrowego znacznie poszerzył swoje horyzonty, szczególnie w zakresie projektowania interfejsu użytkownika.

Strony internetowe i aplikacje mobilne otworzyły niesamowitą i owocną perspektywę dla tego minimalistycznego i funkcjonalnego podejścia do rozwiązań projektowych. Styl ten nazwano „płaskim designem”, który natychmiast stał się popularny i zapoczątkował nowy kierunek w projektowaniu graficznym.

Pierwszym krokiem w kierunku zwiększenia popularności płaskiego interfejsu użytkownika w produkty cyfrowe został stworzony przez firmę Microsoft, ruch ten rozpoczął się na początku XXI wieku i szeroko rozwinął się w produktach z 2010 roku, szczególnie w zakresie rozwoju mobilnych interfejsów dla telefon Windows 7. Podstawowe cechy płaskiego projektu, takie jak intuicyjne proste kształty, odważna, wyraźna typografia, jasne kontrastujące kolory, długie cienie oraz brak skomplikowanych szczegółów i tekstur, dobrze się przyjęły. Kolejny wzrost popularności płaskiego designu nastąpił w 2013 roku, kiedy Apple wypuściło iOS 7 wykorzystujący zasady płaskiej grafiki jako podstawę wygodnych, intuicyjnych interfejsów. Można też powiedzieć, że niektórzy kluczowe zasady Płaska konstrukcja znalazła swój wyraz w Wygląd materiału z Google'a.

Zatem głównymi cechami płaskiej konstrukcji są:

• prostota form i elementów;
• minimalizm;
• funkcjonalność;
• odważna i czytelna typografia;
• jasna i ścisła hierarchia wizualna;
• połączenie kontrastujących kolorów, które zapewnia szybką percepcję wzrokową;
• unikanie tekstur, gradientów i skomplikowanych kształtów;
• zastosowanie zasad siatki, podejście geometryczne i równowaga wizualna.

Korzyści z płaskiej konstrukcji

Projekt Fdat ma szereg zalet, które decydują o jego popularności i różnorodności w projektowaniu cyfrowym. Wśród najważniejszych:

• czytelność;
• przejrzysta hierarchia wizualna za pomocą kształtów, kolorów i czcionek;
• efektywna organizacja szybkiej i intuicyjnej nawigacji w interfejsach webowych i mobilnych;
• łatwa skalowalność dla responsywnego projektowania;
• znikome obciążenie dla systemu cyfrowego.

Podsumowując, płaska konstrukcja zapewnia szerokie pole do twórczych poszukiwań i koncepcji stylistycznych.

Płaska konstrukcja - zastosowanie w praktyce

Różnorodność stylów projektowania dostępnych i rozwijających się obecnie dobrze nadaje się do projektowania płaskiego ze względu na jego elastyczność i swobodę artystyczną.

Nawet na etap początkowy Planując ogólny układ, logikę i przejścia, można zastosować zasady projektowania płaskiego. Narzędzia i oprogramowanie cyfrowe narzędzia projektowe wykorzystywane na tym kluczowym etapie pozwalają projektantom prezentować klientom i zespołom spójny układ wszystkich ekranów aplikacji lub stron internetowych, a nawet to podstawowy schemat ma już kluczowe funkcje wizualizacyjne typowe dla płaskiej konstrukcji. Na tym etapie idealnie nadaje się do szybkiego i sprawnego wyeksponowania rozwiązań projektowych w prostym, monochromatycznym układzie.

Projekt interfejsu użytkownika

Interfejsy użytkownika zdecydowanie stały się szeroką i sprzyjającą dziedziną płaskiego projektowania. Znalazł swój rozwój zarówno w abstrakcyjnych koncepcjach interakcji użytkownika, jak i w różnorodnych oryginalnych interfejsach, ikonach, elementach interfejsu i ilustracjach.

Takie ilustracje zapewniają dodatkowe wsparcie produkty cyfrowe i są zazwyczaj bardziej złożone pod względem szczegółowości i zaspokajania potrzeb estetycznych użytkowników, a jednocześnie błyskawicznie nawiązują do konkretnego tematu.

Drukowane ilustracje

Różnorodność celów nowoczesnego projektowania płaskiego i jego rosnąca popularność w produktach cyfrowych wpłynęły również na inne obszary projektowania, w szczególności na projekty produktów drukowanych, takich jak plakaty i okładki książek, z których wywodzi się to podejście.

Marka

Obecnie w projektowaniu marek z powodzeniem zastosowano zasady projektowania płaskiego ze względu na swoją elastyczność, a wiele produktów jest prezentowanych na urządzeniach lub otrzymuje cyfrowe wsparcie online. Płaski design w brandingu jest często przedstawiany w logo i ikonach aplikacji.

Wszystkie fakty i korzyści wspomniane na temat płaskiego designu zdecydowanie nie oznaczają, że ten styl zwyciężył z innymi podejściami do projektowania. Każdy styl i kierunek projektowania ma swoje zalety i wady. Płaska konstrukcja otworzyła jednak nowe perspektywy, zwłaszcza w zakresie niestandardowych rozwiązań, które zapewniają harmonijną równowagę piękna i funkcjonalności.

Napisał:

Ekspert w zakresie projektowania, rozwoju i analityki internetowej

Słowo „płaskie” przetłumaczone z języka angielskiego oznacza „płaskie”. Od momentu powstania tzw. Flat design utrzymuje swoją pozycję już od kilku lat, zajmując wiodącą pozycję na rynku.

Gdzie to wszystko się zaczęło

Projektowanie stron internetowych zmieniło się od momentu jego powstania duża liczba raz. Przebyła długą drogę od prostych i nudnych elementów do trójwymiarowych, wypukłych i niemal materialnych. Można to łatwo zaobserwować na przykładzie zmiany wyglądu systemu operacyjnego Windows. Komponent wizualny rozwija się równolegle z rozwojem technologii. Jednak nowe trendy wskazują raczej na powrót do minimalizmu i prostoty.

Od skeuomorfizmu do płaskiego designu

Styl poprzedzający mieszkanie był skeuomorfizmem. On jest bardzo przez długi czas był głównym trendem w projektowaniu. Skeuomorfizm to styl pseudo-wolumetryczny, którego wszystkie elementy naśladują wygląd prawdziwe przedmioty ( Zeszyt, budzik), używając cieni, naturalnych tekstur i nie tylko. Jego żywe przykłady można było znaleźć we wczesnych interfejsach smartfonów. Zaczęła tracić na swojej pozycji po 2010 roku, kiedy projektanci dużych firm zaczęli zwracać uwagę na uproszczenia i opracowując interfejsy użytkownika, zaczęli pozbywać się głównej cechy skeuomorfizmu - trójwymiarowości.

Doskonały wyraźny przykład różnice w stylach, poniższe zdjęcie może służyć jako wskazówka. Obraz po lewej stronie jest projektem płaskim, natomiast ten po prawej stronie to skeuomorfizm.

Charakterystyka stylu płaskiego

Mieszkanie to styl dwuwymiarowy. Absolutnie nie efekty wizualne, Jak na przykład płynne przejścia kolory, cienie, tekstury wolumetryczne. Jednym słowem wszystko co sprawia, że ​​obraz jest trójwymiarowy.

Główna treść informacji zawarta jest w ikonach (ikona Płaska konstrukcja). Powinny być jak najbardziej przejrzyste dla użytkownika, jeśli chodzi o aplikacje na smartfony. W przypadku witryn internetowych ikony są głównymi elementami oddającymi ich specyfikę i przekaz informacyjny. Z reguły są one przedstawiane w formie prostej figury geometryczne, okrąg lub kwadrat, z charakterystycznym konwencjonalnym obrazem.

Przy opracowywaniu płaskiego projektu zwraca się uwagę schemat kolorów. Powinno być monotonne, nie nachalne i nie rozpraszać użytkownika. Najczęściej stosuje się jeden czysty kolor i kilka kontrastujących odcieni. Nawiasem mówiąc, istnieje wiele usług internetowych oferujących zestawy kolorów typu Flat design, z których można korzystać, kopiując kody szesnastkowe kolorów, które lubisz.

Nie mniej ważne jest coś takiego jak typografia (tekst). Ze względu na ogólną prostotę, komponent tekstowy szczególnie wyróżnia się. Oznacza to, że powinien być czytelny i nie zaprzeczać ogólnemu stylowi. Będzie to zależeć od pomyślnego wyboru czcionki i jej koloru.

Przykłady płaskich projektów

Zacznijmy od tego, że ikony wielu znanych zasobów Internetu i sieci społecznościowych zmieniły się w bardziej płaski sposób. Nie tak dawno Giganci Google’a i YouTube również zmieniły swój projekt na płaski. system operacyjny Windows, począwszy od Windows 8, całkowicie porzucił wszelkie oznaki głośności ikon, które cieszyły oczy niektórych użytkowników w poprzednie wersje i zaczął stosować się do płaskiego projektu. Deweloperzy poszli w ich ślady aplikacje mobilne dla iOS i Androida.

Szeroko korzystaj z zalet Płaska konstrukcja ale witryny jednostronicowe (strony docelowe), dla których decydującą rolę odgrywa nie pretensjonalny wygląd, ale funkcjonalność i czytelność.

Ewolucja płaskiej konstrukcji

Początkowo Flat Design był rzeczywiście całkowicie płaski, co stwarzało pewne trudności użytkownikom przyzwyczajonym do wypukłych przycisków. Jeśli w skeuomorfizmie klikalność przycisków była natychmiast zauważalna, to w pierwszych odmianach płaskiej konstrukcji nie zawsze było możliwe określenie interaktywności elementów za pierwszym razem.

Po wydaniu przez Microsoft systemu Windows 8, zaprojektowanego w płaskim stylu, nie wszyscy użytkownicy byli w stanie od razu zorientować się w nowym interfejsie i ikonach, na które mogą kliknąć. Wygląd elementów nie wskazywał w żaden sposób na możliwą interakcję z nimi. Ten projekt był wygodniejszy dla aplikacji mobilnych, które podchwyciły ten pomysł. I oni zrobili to jako pierwsi Firma Apple w projekcie iOS 7.

Jednak płaska konstrukcja nie stoi w miejscu i ewoluuje w kierunku większej złożoności. Dziś coraz częściej przypomina konstrukcję półpłaską lub, jak to się nazywa, Flat 2.0. Zaczęły pojawiać się w nim efekty głębi, cienie i gradienty. Głębokość płaskiej konstrukcji osiąga się poprzez ułożenie elementów na różnych poziomach lub pod kątem.

Tak czy inaczej, styl ten jest u szczytu popularności i cieszy się dużym zainteresowaniem. Jeśli więc planujesz zaprojektować swoją stronę internetową, możesz bezpiecznie zdecydować się na projekt płaski. A jeśli potrzebujesz brakujących elementów do swojej witryny, w Internecie możesz znaleźć ogromną liczbę bezpłatnych elementów interfejsu użytkownika o płaskiej konstrukcji (do pobrania bezpłatnie), takich jak ikony, czcionki, szablony i inne niezbędne elementy interfejsu użytkownika.

Plusy i minusy stylu

Bez wątpienia w dzisiejszym szybkim życiu taki dyskretny, informacyjny styl jest wygodniejszy niż jego poprzednik. Płaska konstrukcja ma wiele niezaprzeczalnych zalet.

Być może najważniejszą rzeczą jest szybkie ładowanie stron internetowych. Strony internetowe korzystające z płaskiej konstrukcji otwierają się znacznie szybciej niż te, które są przeładowane animacjami i innymi ciężkimi obiektami. Czas ładowania jest szczególnie ważny dla optymalizacji SEO i promocji witryny na górę.

Uproszczony wygląd ułatwia czytanie tekstu i pozwala skupić się na głównej treści.

Projekt wygląda harmonijnie i całościowo, co stwarza ogólnie przyjemne wrażenie.

Nic nie może być idealne, a płaska konstrukcja nie jest wyjątkiem. Mimo całej pozornej prostoty opracowanie naprawdę udanego projektu płaskiej sieci nie jest takie łatwe. Istnieje możliwość uczynienia go nudnym i nieatrakcyjnym. Albo wręcz przeciwnie, przesadź z projektem i zapomnij o funkcjonalności. główne zadanie przy opracowywaniu płaskiej konstrukcji należy to wytrzymać idealna równowaga pomiędzy pięknem a łatwością obsługi.

Rewolucja „płaskiego projektu” nabiera tempa od czasu jej wprowadzenia Platforma Windows Telefon z 2010 roku. Nietrudno zrozumieć dlaczego: interfejs o tym projekcie wydaje się bardziej intuicyjny, dobrze pasuje do elementów adaptacyjnych, nowoczesnych frameworków i wygląda atrakcyjnie, gdy jest poprawnie wykonany.
Płaskie projektowanie zaczęło się jako przeciwwaga dla wszechobecnego stylu skeuomorficznego, ale od tego czasu stało się czymś więcej niż tylko „opcją B”.

Początkowo mieszkanie było wyłącznie dwuwymiarowe z całkowitym naciskiem na minimalizm. Nowoczesne mieszkanie 2.o wykorzystuje cienie, gradienty i inne elementy, aby wyglądało „prawie płasko”.

5 charakterystycznych elementów nowoczesnego płaskiego designu:

1. Długie cienie
Długie cienie dodają głębi i wymiaru obrazom bez konieczności poświęcania minimalistycznych szczegółów ikon, które czynią interfejs atrakcyjnym.

2. Dynamiczne kolory
Uzupełnienie rzadkich elementów wizualnych jest łatwe dzięki energicznym kolorom, zwłaszcza jasnym odcieniom.
Różne kolory tła kontrastujące z bazowym kolorem elementów ożywiają stronę z menu kafelkowym.
Witryna Flat UI Colors zawiera najskuteczniejsze wzorce kolorów dla mieszkań.

3. Prosta typografia
Wybór czcionki w wersji płaskiej opiera się na jednym kryterium: czytelności. Zwykle używane są czcionki bezszeryfowe o stałej szerokości obrysu.

4. Przezroczysty przycisk
Jeden z najmodniejszych elementów w nowoczesny projekt strony internetowej. Dzieje się tak dlatego, że nie przyciąga on zbyt wiele uwagi, ale jest wyraźnie rozpoznawalny jako przycisk.

5. Minimalizm
Płaskość i minimalizm idą w parze, kierując się tymi samymi zasadami: prostotą i skupieniem na treści.
Może się wydawać, że zastosowanie płaskiej konstrukcji jest rozwiązaniem uniwersalnym, jednak minimalizm jest trudny do wdrożenia: im mniej elementów roboczych, tym więcej uwagi wymagają.

Niezależnie od tego, jak wspaniały może wydawać się płaski projekt, nie ma gwarancji, że będzie on działał w przypadku Twojej witryny. Sprawdź jego główne zalety i przekonaj się, czy warto planować globalny redesign.

Zalety:
używany w responsywnym interfejsie;
upraszcza nawigację dla użytkownika;
przejrzysta struktura i schemat wizualizacje podkreślać wewnętrzną logikę strony;
szybkie ładowanie stron dzięki prostocie grafiki;
Znana typografia poprawia czytelność.

Płaski design stawia na prostotę i minimalizm, co z drugiej strony utrudnia przekazywanie skomplikowanych wizualnie komunikatów. Dlatego zanim zaczniesz spieszyć się z upraszczaniem interfejsu, powinieneś dokładnie rozważyć interakcję pomiędzy witryną a użytkownikiem.

Na podstawie księgi trendów w projektowaniu stron internetowych.

Strony internetowe w stylu flat design wyglądają jak prosta geometryczna przestrzeń blokowa z kolorowymi akcentami (ikony, podkreślenia tekstu, infografiki) z minimalną ilością szczegółów graficznych i bez nadmiaru informacje tekstowe. Jak to mówią „minimalizm” i nic zbędnego.

Jak nie rysować płaskich ikon

„Płaskie” projektowanie stron internetowych stało się modne wraz z interfejsami nowy Windows. Rosnącej popularności tego stylu w Rosji sprzyja wzrost liczby projektantów stron internetowych-samouków, którzy nie wiedzą, że interfejs strony internetowej i interfejs „palcowy” (smartfony) to nie to samo (łatwo przewijać w dół strony palcem - a wręcz przeciwnie, będziesz potrzebować dużo cierpliwości i prawdziwego zainteresowania, aby obrócić kółko myszy o 3-4 ekrany w dół). Na rosyjskich płaskich stronach często można znaleźć następujące ikony:

Przykładem są po prostu jaskrawe kolory, które do siebie nie pasują + ikony kiepskiej jakości (wziąłem przykład z płatnego zestawu, ale prawie zawsze freelancerzy korzystają z swobodnie pobranych ikon z różnych zestawów, które również do siebie nie pasują).

Ze względu na niemożność rysowania wysokiej jakości grafiki początkujący projektanci z łatwością korzystają z okazji, aby wszystko uprościć. Jednocześnie pomija się fakt, że projektowanie w stylu „minimalizmu” polega na precyzyjnym, wysokiej jakości opracowaniu szczegółów interfejsu, a nie tylko umieszczaniu ikon pobranych z Internetu na kolorowych kwadratach w Styl Windowsa 8 (które można obecnie znaleźć na wielu rzekomo „nowoczesnych stronach docelowych”).

Przykład dobrych płaskich ikon:

Kolory i ikony powinny nie tylko łączyć się ze sobą, ale także tworzyć jedną całość.

Problemy niskiej jakości płaskiej konstrukcji

1. Nawigacja i użyteczność

Sieć NIE jest prawdziwą przestrzenią, więc aby stworzyć poczucie rzeczywistości i zrozumieć Twoją lokalizację, witryny używają „ bułka tarta", a obrazy ikon są blisko prawdziwe obiekty dla szybkiego zrozumienia i łatwości nawigacji. Tak więc z ikony domu od razu widać, że to „dom”, z ikony słuchawka- że to telefon, wózek - że to koszyk (jak w supermarkecie - wszystko jasne i proste), ikona ze zdjęciem prezentu - prezentu itp.

Jednak nowi projektanci mieszkań często nadmiernie upraszczają ikony. A im dalej projektanci odchodzą od intuicyjnych obrazów, tym trudniej jest je zinterpretować użytkownikowi. Nadmierne uproszczenie czasami utrudnia nawigację. Gdy tylko wszyscy rzucili się do tworzenia modnego, płaskiego projektu strony internetowej, próbując naśladować europejskich projektantów, zapomnieli proste zasady użyteczność.

2. Długie, płaskie owijki na stopy

Strony rozciągają się na 3-4 ekrany, a przestrzeń jest nie tylko oszczędnie wykorzystywana, ale wręcz przeciwnie, dodaje się nadmierną ilość „powietrza”. Jednocześnie nie ma wizualnej motywacji do przewijania - żadnych żetonów, żadnej animacji. Nie jest jasne, w jaki sposób twórcy planowali zainteresować Odwiedzających przewijaniem strony w dół. W końcu w porównaniu do witryn, w których wszystko jest zwarte, witryny z footclothami wymagają dużo energii, aby poruszać myszą po całym ekranie i przewijać.

3. Mylące przyciski

Na płaskich terenach aktywne elementy nie są już oczywiste. Wraz z pojawieniem się płaskiej konstrukcji przyciski również stały się płaskie. Ale wizualny obraz przycisku pochodzi z prawdziwego fizycznego przycisku, a cienie i gradienty po prostu pokazują, że „zdecydowanie możesz tutaj kliknąć”.

4. Źle narysowane ikony

Przez tandetną pracę projektantów ikony na stronach internetowych (jest to szczególnie widoczne na stronach o płaskim stylu) utraciły swoje przewidywalne obrazy. Albo z powodu ograniczone budżety na projektowaniu, być może z powodu niekompetencji samych projektantów stron internetowych, ale elementy nawigacyjne na stronach często nie odpowiadają pierwotnym skojarzeniom i są „naciągane”.

Zakładam, że praca nad stworzeniem ikon przebiega mniej więcej tak: zgodnie ze specyfikacją techniczną potrzebna jest ikona „Indywidualne podejście do klienta”. Osobiście mam obraz menadżera i dwóch klientów, z których każdy jest prowadzony strzałką w innym kolorze (niebieska strzałka prowadzi do niebieskiego klienta, czerwona strzałka prowadzi do czerwonego klienta). Jeśli projektant nie umie rysować, będzie szukał ikony w gotowych zestawach (w najlepszym wypadku kupi ją w banku zdjęć, w najgorszym pobierze z Internetu) i użyj tego, które ma najbardziej odpowiednie znaczenie. Najprawdopodobniej będzie to ikona mężczyzny z krawatem lub walizką. Ogólnie nie posunąłem się zbyt daleko, ale nadal w projekcie strony będzie jasne, że walizka jest „ Indywidualne podejście dla wszystkich” i Zegarek „10 lat na rynku” (swoją drogą, naprawdę to widziałem!) – projektant oszukał.

5. Fałszywe skupienie na treści

Płaski projekt strony internetowej zakłada skupienie się na treści. No jasne – jeśli nacisk nie jest położony na grafikę, to na informację. Ale jeśli uważnie przyjrzysz się „nowoczesnym” stronom docelowym w stylu flat oferowanym przez rosyjskie studia internetowe, niewiele uwagi poświęca się treści. Mianowicie:

• Tekst jest prezentowany przypadkowo. Nie jest jasne, jak rozmieszczone są w nim akcenty, czego się trzymać, a co jest wtórne.
• Nie ma projektu jako takiego. Tabele, listy punktowane, nagłówki, ogłoszenia często nie są w ogóle opracowane.
• Często goły tekst. Nie ma obrazów ani ikon, które wizualnie wspierałyby bloki tekstowe. W rezultacie nacisk nie jest kładziony ani na grafikę, ani na tekst, ale na sam „styl”. Jednocześnie traci się firmę i jej oferty.

Czy zatem płaskie projektowanie stron internetowych jest w ogóle potrzebne?

W projektowaniu interfejsów dla smartfonów wszystko jest jasne - lekkie, nieobciążone, łatwe w obsłudze. Ale przy projektowaniu stron internetowych w stylu flat, osobiście mam duże pytanie: czy to w ogóle jest skuteczne?

Większość Klientów nie rozumie jakości grafiki i zatwierdzając projekt strony kieruje się osobistym gustem (lubię/nie lubię). I tutaj moda odgrywa rolę.

Płaski projekt strony internetowej może być fajny. ALE! Fajny projekt wymaga naprawdę wysokiej jakości użyteczności i elementy graficzne oraz obecność kreatywnych funkcji i efektów. A jeśli ich nie ma w projekcie, jeśli stronom brakuje oryginalności, wyglądają monotonnie, pusto i nudno. Ogólnie rzecz biorąc, jest to obecnie dostępne na większości rosyjskich witryn.

Przykład wysokiej jakości płaskiej konstrukcji:

Moda na płaskie projektowanie stron internetowych jest chwilowa, jak każda inna moda. Niektórzy tworzą oryginalne, kreatywne projekty, inni kopiują je i stylowo naśladują, bo nie wiedzą, jak sami je wymyślić. A tanie portale „modowe” rosną jak grzyby po deszczu…

Nie wiemy, czy zauważyłeś, czy nie, ale Ostatnio(szczególnie w zeszłym roku) w projektowaniu stron internetowych na całym świecie można zaobserwować wyraźny trend w kierunku uproszczeń, surowego minimalizmu i wizualnego rozjaśnienia tego, z czym my, użytkownicy, mamy do czynienia na co dzień. Mówiąc najprościej, projekt stał się „płaski”: w przeciwieństwie do wypukłych ikon z czasów szybkiego rozwoju sieci społecznościowych i Web 2.0, teraz coraz częściej witają nas proste ikony nowych usług. Wszystko to ma swoją nazwę - płaska konstrukcja. Nie mieszkanie, ale mieszkanie.

Wczorajszą prezentacją nowego mobilnego systemu operacyjnego iOS 7 Apple ostatecznie potwierdził szybki wzrost popularności tego trendu, tradycyjnie zachwycając część swoich fanów, ale spotykając się także ze znacznym niezadowoleniem wśród doświadczonych użytkowników i projektanci. O co chodzi? Jaki jest pożytek z tej płaskiej konstrukcji i czy świat naprawdę jej potrzebuje? Postanowiliśmy zwrócić się do ekspertów z Ukrainy i zagranicy.

Poprosiliśmy ich o odpowiedź na trzy główne pytania:

• dlaczego świat zaczął zmierzać w stronę flat designu w internecie i mobile i co to jest;
• co to da Apple i iOS 7;
• jak wpłynie to na projektantów z jednej strony i użytkowników z drugiej.

Denis Sudilkovsky, Kijów
Specjalista ds. projektowania interakcji, producent Prodesign.in.ua

„Efekt wahadła” w przewidywaniu przyszłości objawia się tym, że jeśli w jakiejś kwestii pojawią się dwie skrajności, ludzkość przechyli się z jednej strony na drugą. Dotyczy to niewątpliwie projektowania systemów interaktywnych. Płaska i nieciekawie prymitywna sieć zmieniła się kiedyś w obszerne przyciski internetowe. Wizualizacje interfejsu osiągnęły szczyt realizmu i wahadło leci w jego kierunku Odwrotna strona- płaskie i proste.

Co Apple na tym zyska? Zachowa swoje miejsce w trendzie i setkach tysięcy komentarzy mówiących, że ich iOS staje się bardzo podobny do Androida.

Projektanci będą musieli ewoluować (i nie żartujcie, kiedy płaskie projektowanie przyjdzie do inżynierii mechanicznej i da nam płaskie samochody :). Gdy nie ma dekoracji, cała praca polega na stworzeniu nastroju z treścią na konkretny scenariusz z użytkownikiem. Zawód ten będzie miał coraz więcej wspólnego z Reżyserem niż z Artystą. Przeciwnie, użytkownicy otrzymują nowe doświadczenie i nowe wrażenia. Osobiście jestem zwolenniczką iPhone'a od 4 lat, ale tej wiosny zmieniłem telefon na Androida z jednego powodu - znudziła mi się monotonna idealność interfejsu Apple.

Daniela Bruce’a w Sztokholmie
Starszy specjalista ds. kreacji cyfrowych, danielbruce.se

Na początek chciałbym zaznaczyć, że nie podoba mi się określenie „płaska konstrukcja”. Większość projektów graficznych od wieków była „płaska”. Myślę też, że ogranicza to twoje możliwości wyjątkowy design, gdy wybór jest pomiędzy mieszkaniem a czymś innym. Design może oznaczać znacznie więcej. Wesoły, jasny, mroczny, pozytywny, minimalistyczny – możesz to nazwać jak chcesz. Ale dzisiaj rzadko słyszę, żeby ktoś uważał projekt za coś więcej niż płaski lub skleromorficzny. To trochę smutne.

Dlaczego internet i urządzenia mobilne powoli przechodzą w stronę płaskiego projektu? Z mojego punktu widzenia jest to po prostu trend. Nigdy nie widziałem artykułu o zaletach płaskiej konstrukcji interfejsy użytkownika i nadal nie jestem co do tego przekonany. Prosty i przejrzysty design – tak, ale to nie to samo, co „płaski”. Spójrz na przykład na Google. Nie robią całkowicie płaskich projektów, oni – i ja to podzielam – nadal widzą potrzebę pewnej głębi i różnorodności.

Bardzo się zdziwiłem, gdy kilka lat temu Microsoft wybrał dla siebie ten kierunek, prezentując słynny styl Metro. Faktycznie, korzystali projekt graficzny do dużych znaków, na które ludzie patrzą z pewnej odległości i nigdy nie wchodzą w interakcję z małymi ekranami zawierającymi znaczną liczbę elementów. Ładnie wyglądają, ale czy mają dobrą użyteczność?

To, co wczoraj wieczorem widziałem u Apple, było tylko złą kopią kilku ciekawe projekty, które pojawiały się na stronach takich jak Dribbble i Behance ostatni rok. Nie widziałem nic nowego – poza tym, że daleko mu do tego samego” stare jabłko»Steve’a Jobsa. Firma pokazała, że ​​nie jest w czołówce projektowania interfejsów mobilnych. Oczywiście w ciągu najbliższych kilku miesięcy zobaczymy, jak fani przyjmą te wszystkie białe projekty i kreatywne gradienty, ale nie sądzę, że ten aspekt będzie miał tak duży wpływ, jak niedawne przestoje Google. Ale z drugiej strony, tak czy inaczej, Apple zawsze wyznaczał trendy i inspirował wielu ludzi, w tym mnie.

Dotyczący zwykli użytkownicy, to lubią jasne kolory.

Iwana Klimenko, Kijów
projektant interfejsu mobilnego, 5tak.com

W dużej mierze podchodzę trochę filozoficznie do tej sytuacji fascynacji stylizacją na płasko. To nie pierwszy raz, kiedy projektanci interesują się minimalizmem i sztucznymi materiałami. Wszystko przemija.

Epoka Bauhausu lat 20-30 wniosła ogromny wkład do designu, jednak szczelność tonalna i sztuczność nie były w stanie oprzeć się pragnieniu i wewnętrznemu pragnieniu ludzi do istnienia w otoczeniu bardziej naturalnych rzeczy.

Potem, w latach 60., wszyscy zaczęli podziwiać plastik.

Meble, naczynia, a nawet ubrania są wykonane z plastiku. Wydawało się, że to Nowa nadzieja ludzkości, ale znowu nie - ludzie bardzo szybko powrócili do form naturalnych lub do kopii naturalnych materiałów.

Ostry kontrast form i minimalistyczna grafika zawsze wyrażały narastanie wewnętrznych konfliktów w społeczeństwie. Design to tylko lustro, które pokazuje nasz wewnętrzny świat. Dzieje się za dużo. Życie bardzo przyspiesza, a my po prostu nie mamy czasu na myślenie i rozważanie czegokolwiek. Często nie mamy czasu po prostu żyć.

Minimalizm i cały ten sprzęt elektroniczny to tylko krok na drodze do czegoś bardziej naturalnego i ludzkiego. Więcej niż tylko kolejny komputer. Nawet mi smutno, że Apple, które umiało patrzeć głęboko, już nie istnieje.

Olesia Grichina, Kijów
Projektant interfejsu użytkownika w Componentix, twitter: elendiel

Myślę, że duży wpływ na projektantów miała duża liczba gadżetów z nimi związanych różne rozmiary ekran i rozdzielczość - dla całej tej różnorodności łatwiej jest stworzyć projekt bez tekstur, skomplikowanych cieni, które prawidłowo uwzględniają oświetlenie itp. Zaczęli myśleć bardziej w kierunku „jak uczynić to wygodniejszym dla użytkownika” niż „jak pięknie rysować”. Treść jest najważniejsza, a w naszej pracy ważne jest, aby przedstawić ją w jak najlepszy sposób.

Wydaje mi się, że zmiany zewnętrzne(płaski interfejs użytkownika, ikony) szczególnie nie zauważyliśmy żadnych poważnych zmian w łatwości obsługi i tym, jak ludzie przeklinają ten temat. Kiedy sprawdzą, czy to działa, zacznie mówić: „Och, jakie to wygodne i dlaczego nie zrobili tego wcześniej?” Mam nadzieję, że wpłynie to na projektantów w taki sposób, że będą zwracać większą uwagę na użyteczność interfejsu, a nie na tekstury i cienie. W końcu będzie można wytłumaczyć klientom, że taki jest trend :)

Myślę, że flat design nie wpłynie szczególnie na użytkowników – jeśli będzie im wygodnie tworzyć i konsumować treści, to zadowolonych osób będzie mnóstwo. Ale ikony włączone ekran główny nadal kwaśny :)

Paweł Grozyan, Kijów
Projektant produktu w MacPaw, grozyan

"Jabłko! A-ha-ha, przestań! – krzyczą projektanci. - Hurra, stało się łatwiej. - użytkownicy skandują." Rozumiem oba punkty widzenia. Dziś po prezentacji z WWDC2013 wielu moich kolegów wstało i powiedziało: „Pieprzyć ten zawód! Ktoś teraz może rysować takie głupoty. A te ikony za 30 dolarów?!”. I na pierwszy rzut oka mają rację.Ale jeśli pogrzebiecie głębiej, zorientujecie się, że istnieją tysiące przedmiotów, które przez długi czas różniły się od siebie jedynie scenariuszem użytkowania, potem kształtem, potem kolorem i dopiero wtedy w szczegółach artystycznych. Pamiętam czasy, kiedy ci wszyscy goście na swoich profilach LinkedIn dzisiaj, którzy mówią UX, UI Designer, nerwowo kopiowali efekt białego cienia liter. Jak Apple. Potem lekkie i lekkie strony internetowe. Jak Apple. Potem bogate interfejsy w teksturach i realizmie. Podobnie jak Apple. Cała ich praca polegała na kopiowaniu, ponieważ nie było oryginalnej, ujednoliconej i wygodnej koncepcji rozwoju dla wszystkich. To właśnie to zadanie rozwiązuje dziś flat design. Choć wydaje mi się niewłaściwe nazywanie tego w ten sposób. Dobrze, że Microsoft tego nie wymyślił, a powstał ponad dziesięć lat przed erą cyfrową, w dziedzinie wydawniczej.

Mieszkanie - to nie jest dla kliknięć, tylko dla kliknięć, kranów, kranów. Nie można tego nazwać płaskim – brak „grubych” tekstur i cieni na przyciskach sprawia, że ​​jest to raczej uproszczenie i pozbawione wizualnej agresji. I nie można obejść się bez gradientów dla przycisków. Popieram ten trend. Jeśli nie wpłynie to na jakość doświadczenia użytkownika, wszystkim będzie łatwiej z tym żyć. Przede wszystkim dla użytkownika. Po drugie dla twórcy: będzie łatwiej realizacja techniczna, wygodniejszy w klikaniu (podkreślenie linków - cześć) i wieloplatformowy - łączący web, mobile i desktop w jedno jednolite doświadczenie. Bez wątpienia jest to odważny ruch ze strony Apple. I tylko oni mogą o tym decydować. Ich historia ma dziesiątki potwierdzeń, więc mają większe szanse na sukces niż odwrotnie.