flat design - jak oceniacie?

2

Czym jest flat i jego mutacja: material pewnie nie muszę tłumaczyć, więc od razu przejdę do rzeczy.

Osobiście choruję przez flata. Strony i interfejsy robione gdzieś tak do 2012 postrzegałam przeważnie jako czytelne. Przede wszystkim widziałam strukturę i hierarchię strony. Natomiast witryny flatowe sprawiają na mnie wrażenie, jakby ktoś wszystkie cegły budowli zwalił na jedną kupę i zafundował mi monolityczny bloczek.

Apostołowie flata, twierdzą, że jest on czytelny, bo odrzuca wszystko, co zbędne i zostawia samą treść. Trochę w tym racji jest bo w minionej dekadzie zaliczyliśmy modę na wszechobecne szklane połyski, ale razem z nimi wywalono też głębię, światłocień i kolory. Istnieją badania UX, które mówią wyraźnie, że poruszanie się po płaskich stronach i interfejsach zawiera więcej czasu, a modne obecnie czcionki są mniej czytelne, ale te głosy jakoś się nie przebijają.

Osobiście mogę wymienić tylko jedną zaletę flata: kiedyś zaprojektowanie wyglądu strony internetowej wymagało czasu i pomyślunku. Teraz można raz, raz zrobić prostacki layout, który nie będzie jednak w niczym odstawał od średniej.

Mam wrażenie, jakby większości odbiorców nie robiło to w sumie większej różnicy, albo i nawet i akceptowali ten stan. Ciekawi mnie jednak, jak oceniają tę sprawę ludzie o bardziej informatycznym myśleniu? Czy może to tylko ja(i niewielka mniejszość) mam jakieś skrzywienie i płaskiego/materialnego nie lubi?

1

Istnieją badania UX, które mówią wyraźnie, że poruszanie się po płaskich stronach i interfejsach zawiera więcej czasu, a modne obecnie czcionki są mniej czytelne, ale te głosy jakoś się nie przebijają.

Pokaż te badania.

1

jak strona jest źle zaprojektowana to żaden styl jej nie pomoże, dodatkowo wiele też zależy od grupy docelowej

0

Ja uwielbiam materiala i uwierz, niezaleznie jaki styl jak ktoś nie zna ux to w każdym tak samo spartocze sprawe, a jak zna to w każdym ogarnie bez problemu.

1

jak dla mnie większy problem to długie ładowanie, chyba zmora większości stron, dwie sekundy to max w obecnych czasach powinno być

1
czysteskarpety napisał(a):

jak dla mnie większy problem to długie ładowanie, chyba zmora większości stron, dwie sekundy to max w obecnych czasach powinno być
To głównie problem faktu, że ma być szybko zrobione, więc wali się nadmiarowe szablony i biblioteki skryptów, z których używa czasem tylko jednego, ale flata też da się w tym kontekście przyczepić.

Wytyczne flat mówią: graficzne ikony to zło, wrzucimy ikony do fontów, żeby zaoszczędzić kilkadziesiąt KB (albo i nie, jeśli podepniemy nieokrojonego gotowca czcionki z setkami różnych zbędny symboli), a później wrzucimy... graficzne tło strony głównej albo i kilka teł do wymiany albo i wideo nawet.

0

no bo ikony w foncie sa szybsze:

  • pobierasz jeden plik
  • woff2 takiego font-awesoma waży zaledwie 76kB czyli tyle co nic.
0

font-awesome chyba jeszcze mniej ładuje, a material ma właśnie to czego nie ma flat, czyli pseudo 3D- cieniowanie elementów, w ten sposób można je wyróżnić i na mobile wygląda schludnie

0

O ile uwielbiałem "Metro"/MDL, o tyle niezbyt lubię Material.

MDL oczywiście też miał swoje bardzo kontrowersyjne cechy (np. te "ucięte napisy"), ale jakoś był dla mnie o wiele bardziej czytelny niż wszystko, co było wcześniej (w szczególności na Windows Phone). Przeniesienie tego na ekrany komputerów powiodło się o wiele gorzej, a próby dołożenia elementów z Androida w ogóle; na szczęście teraz jakoś poszli po rozum do głowy i "Fluent" jest skrzyżowaniem stylów, które może mieć sens.

0
mr_jaro napisał(a):

no bo ikony w foncie sa szybsze:

  • pobierasz jeden plik
  • woff2 takiego font-awesoma waży zaledwie 76kB czyli tyle co nic.

Wiesz, taki np:
https://www.google.pl/images/nav_logo242.png
to też jeden plik do obsługi wszystkich ikon, waży 16 KB, a da się spokojnie odchudzić do 9 KB.

0

No a powiedz mi co zrobisz z wielkością tych ikon? A co gdy klient będzie chciał by przy powiększaniu nic się nie rozpływało?

0

@Freja Draco: ale każda opcja kolorystyczna danej ikony musi zostać uwzględniona osobno, to samo dotyczy rozmiarów. Więc w ogólnym rozrachunku na bardziej rozbudowanej wizualnie stronie internetowej niż strona główna Google może być to trochę bardziej problematyczne.

0

@Freja Draco: od czasu wprowadzenia HTTP 2 nie ma potrzeby tworzenia sprite-css, założmy, że ktoś wchodzi na stronę /kontakt - nie musi pobierać wszystkich ikonek tylko te które dot. samego kontaktu. Dodatkowo w ikonach fontowych łatwo dostosować wygląd, kolor itp. co w przypadku zwykłych obrazków jest nie do zrobienia (chyba, że jakaś magią canvas + js). Ciekawe, że Google nadal używa sprites - być może dlatego, że chce mieć support na wszystkich przeglądarkach i systemach - a te starsze nie obsłużą svg/fontów prawidłowo.

Flat jest modny, za jakiś czas modne będzie coś innego - wystarczy poczekać nie ma się co spinać tym bardziej, że nie mamy na to wpływu jako jednostki :)

0

Osobiście preferuję jednak wygląd starego, dobrego pixel-art, bo te nierozmywające się przy skalowaniu wektorówki często robią na mnie właśnie wrażenie rozmytych i to niezależnie od wybranej skali. Niemniej rozumiem, że inni mogą mieć inaczej.

Ideałem byłaby pewnie możliwość odwoływania się do ikon PNG i/lub SVG w pliku ZIP.Ale że się póki co nie da, to można by zrobić w PHP generator zbioru ikon budowanego w oparciu o zawartość wskazanego katalogu, który mógłby przy okazji generować CSS, gdzie klasie o nazwie ikony przyporządkowano by współrzędne i rozmiar tła. Wtedy użytkownika interesuje tylko wrzucenie obrazka ikony do pliku i dodanie klasy do elementu, w którym ma wystąpić.

0
Freja Draco napisał(a):

Ideałem byłaby pewnie możliwość odwoływania się do ikon PNG i/lub SVG w pliku ZIP.Ale że się póki co nie da, to można by zrobić w PHP generator zbioru ikon budowanego w oparciu o zawartość wskazanego katalogu, który mógłby przy okazji generować CSS, gdzie klasie o nazwie ikony przyporządkowano by współrzędne i rozmiar tła.

jaki to ma sens? żeby zaoszczędzić te kilka kilo? kaman :)

0

Ideałem byłaby pewnie możliwość odwoływania się do ikon PNG i/lub SVG w pliku ZIP

Ale po co? Skoro można to robić bez ZIPa i uzyskać podobną wydajność?

generator zbioru ikon budowanego w oparciu o zawartość wskazanego katalogu, który mógłby przy okazji generować CSS, gdzie klasie o nazwie ikony przyporządkowano by współrzędne i rozmiar tła

To już było dawno temu w postaci Compass' sprites ale jakoś mimo wszystko się nie specjalnie przyjęło. Ja osobiście dalej wolę ikony wektorowe (czy to SVG czy WOFF), które mogę sobie dowolnie kolorować CSSem.

0

Ideałem byłaby pewnie możliwość odwoływania się do ikon PNG i/lub SVG w pliku ZIP

ale... przecież większość contentu w sieci jest gzipowana :P taki spritowy svg/png już jest skompresowany

0

Zero grafik, a jak już to maksymalnie skompresować i włączyć gzip. Kilka zredukowanych kilobajtów to zawsze zysk biorąc pod uwagę, że nie wszędzie może być dostępny szybki Internet. Ziarnko do ziarnka aż zbierze się miarka.

0
zjem ci psa napisał(a):

ale... przecież większość contentu w sieci jest gzipowana :P taki spritowy svg/png już jest skompresowany

Nie chodzi nawet o zipowanie jako takie, bo wystarczyłby dowolny plik kontenera dla wielu obrazów, tylko o to, żeby przeglądarka nie musiała pobierać każdego pliku osobno.

1

Co robisz gdy klient poprosi o większe ikonki a projekt zawierał powiedzmy 30 ikonek? Bo u mnie wystarczy zazwyczaj zmienić kilka linijek cssa robota ze sprawdzeniem każdej podstrony na jakieś 15-20 min.

0

W pełni to rozumiem. Z resztą już w pierwszym poście pisałam, że od strony wykonawcy przyjęte obecnie rozwiązania pozwalają na szybszą produkcję. Tyle, że z punktu widzenia odbiorcy to trochę jak przejście ze świata ręcznie iluminowanych miniatur, do epoki wczesnego druku z prostymi rycinami.

0
mr_jaro napisał(a):

Ja uwielbiam materiala i uwierz, niezaleznie jaki styl jak ktoś nie zna ux to w każdym tak samo spartocze sprawe, a jak zna to w każdym ogarnie bez problemu.

Ale Material to nie jest stuprocentowy flat design (taki jak Metro). Używa głębi i złudzenia fizyczności - cienie, elewacja elementów - tyle że robi to subtelnie.

1 użytkowników online, w tym zalogowanych: 0, gości: 1