Strona główna » Wzorce projektowe

Google dostrzega design

26 lipca 2011 napisała Iga [ 5 odpowiedzi ] Drukuj wpis

Zawsze byłam fanką Google – zarówno jego projektów, jak i samej marki. Mogły się do tego przyczynić wieści o 20% wolnego czasu dla pracowników oraz zdjęcia kolorowych wnętrz biurowców, a może po prostu nadzwyczajna przydatność ich produktów. Nigdy jednak nie śmiałabym powiedzieć, że Google ma dobry design. A przynajmniej nie miał.

Ręka do góry każdy, kto choć raz usłyszał od klienta/szefa – „Google tak ma”. Na jednym ze spotkań, jako dowód słuszności pewnego rozwiązania, klient pokazał nam produkt Google. Problem w tym, że w międzyczasie Google zmieniło projekt i usunęło omawiane rozwiązanie, nie było więc czego pokazywać ;) Bo to, za co z całą pewnością można pochwalić giganta internetu, to testowanie i ciągłe zmienianie swoich projektów. Dodawane są nowe funkcjonalności, usuwane stare, tylko design jakoś zawsze był bagatelizowany. Aż przyszła fala zmian i mówiąc krótko, jestem nimi zachwycona.

Co takiego podoba mi się w (pozornie) kosmetycznych zmianach?

Dużo światła i spore odstępy

Nowy design nie upycha tak mocno treści na stronie. Pojawiły się większe odstępy między kolejnymi elementami interfejsu oraz powiększono marginesy dla wierszy tabeli. Dzięki temu interfejs wydaje się bardziej lekki, przejrzysty i poukładany.

Gmail - światło, odstępy i marginesy - nowy, lekki interfejs

Gmail - światło, odstępy i marginesy - nowy, lekki interfejs

Duże przyciski akcji

Powiększono obszary klikane, dzięki czemu łatwiej jest trafić w poszczególne opcje i funkcjonalności. Trudniej też się pomylić i na przykład kliknąć strzałkę w prawo zamiast w lewo.

Gmail - powiększone obszary klikalne w nowym interfejsie
Gmail – powiększone obszary klikalne w nowym interfejsie

Przyciski pierwszo i drugorzędne

Wprowadzono kilka wariantów przycisków – kolorem wyróżniono przyciski pierwszorzędne, a więc najważniejsze i najczęściej wykonywane akcje (np. Zapisz). Kolor szary pozostał dla przycisków mniej istotnych. Poprawiło to gradację ważności elementów na stronie i pozwala lepiej kierować uwagą użytkownika.

Google Calendar - przyciski pierwszorzędne Zapisz i Lupka w wyszukiwarce

Google Calendar - przyciski pierwszorzędne Zapisz i Lupka w wyszukiwarce

Ikony zamiast popularnych etykiet

Część etykiet zastąpiono ikonami, np. odśwież w Gmailu lub edytuj w Bloggerze. Jest to dość ryzykowne rozwiązanie – badania pokazują, że użytkownicy różnie interpretują nawet pozornie jednoznaczne ikony. Z drugiej strony ma to największe znaczenie w przypadku nowych użytkowników, a większość aplikacji Google jest używana przez zaawansowanych użytkowników, którzy szybko nauczą się nowego interfejsu. Dla „heavy userów” ikony mogą okazać się efektywnym i użytecznym rozwiązaniem.

Blogger - ikony w nowym interfejsie

Blogger - ikony w nowym interfejsie

Czysty, nowoczesny design (żegnajcie gradienty!)

Lekko wypukłe przyciski zastąpiono jednolitym tłem, zmniejszono kontrasty i zrezygnowano z kolorów na rzecz bieli i szarości. Momentami kontrast może być zbyt mały, jednak ogólnie nadało to stronie lekkości i pozwoliło na wyróżnienie najistotniejszych elementów (np. kolorowych przycisków pierwszorzędnych).

Google translate - brak gradientów i bardziej stonowana paleta kolorów nowego interfejsu

Google translate - brak gradientów i bardziej stonowana paleta kolorów nowego interfejsu

Porównanie interfejsu przed i po redesignie

Gmail

Gmail - przed redesignem
Gmail – przed redesignem
Gmail - po redesignie
Gmail – po redesignie

Google translate

Google Translate - przed redesignem
Google Translate – przed redesignem
Google Translate - po redesignie
Google Translate – po redesignie

Google Calendar

Google Calendar - przed redesignem

Google Calendar - przed redesignem

Google Calendar - po redesignie

Google Calendar - po redesignie

Google Calendar - przed redesignem

Google Calendar - przed redesignem

Google Calendar - po redesignie

Google Calendar - po redesignie

Blogger

Blogger - przed redesignem

Blogger - przed redesignem

Blogger - po redesignie

Blogger - po redesignie

Redesign, jak to z redesignami bywa, nie wszystkim się podoba. Najczęstszym zarzutem, z jakim spotkałam się w komentarzach internautów, jest zbyt duże rozstrzelenie interfejsu. Gdybym była złośliwa, powiedziałabym – kupcie większy monitor, ale że nie jestem… to polecam wybranie skondensowanej wersji redesingu z listy motywów Gmaila :)

A jak Wam podobają się nowe interfejsy Google?

Źródła:

http://gmailblog.blogspot.com/2011/06/preview-of-gmails-new-look.html

http://thenextweb.com/google/2011/03/14/google-teases-slick-new-blogger-interface-mobile-themes-and-content-discovery-tool/

Autorka

Iga Mościchowska

www: http://witflow.com
Managing Partner i UX Director w firmie WitFlow. Z zamiłowania projektant interakcji i badacz użyteczności, z wykształcenia socjolog. Szkoli, wykłada na AGH, występuje na konferencjach branżowych. Pracowała m.in. dla marek: Amica, Agora, eBay Classifieds, Egmont, Maspex Wadowice, MSZ, Polskapresse, PWN.pl, Vattenfall, a także dla licznych startupów. Czytaj więcej
Tagi: , , , , , ,
  • Nowy

    Mnie się dosyć podoba;) Jednak nowy design interfejsu Google bardzo przypomina zaprezentowane wcześniej przez Microsoft Metro UI. Wydaje mi się że największy postęp w kontekście UI robi właśnie M$. I czuję, że jeszcze nas niejednym zaskoczą.

  • Krzysiek

    Design całkiem fajny, lekki, czysty i przejrzysty. Rzeczywiście łatwiejszy w obsłudze pod względem klikalności itd.

    Niestety muszę się także zgodzić z nadmiernym rozstrzeleniem. Niestety większy monitor nie zawsze jest rozwiązaniem – patrz netbook, na którym nowy design nie pozwala zobaczyć prawie nic…

  • http://witflow.com Iga

    @Nowy – też sądzę, że Microsoft może nam pokazać coś ciekawego. Choćby case wstążki w Office (opisywałam w artykule http://uxbite.com/2010/10/droga-do-wstazki-office-2007/) pokazuje, że wiele dobrego dzieje się tam w temacie UX.

    @Krzysiek – dlatego można zmienić motyw na mniej rozstrzelony :)

  • Nowy

    @Iga: Rozwiązania w UI aplikacji desktopowych i webowych to jedna kwestia – tam się już sporo dzieje odkąd M$ postawił na WPF i trochę z mniejszym sukcesem na Silverlight;) Myślę, że prawdziwa rewolucja (która już powoli ma miejsce) to naturalne interfejsy, w ich kwestii M$ wychodzi na lidera.

  • Zuza

    Hmm.. Biorąc pod uwagę ile Google wydaje na research ich projekty nie powalaja. Mnie najbardziej denerwuje wersja gmail na ipada. Notorycznie mylę przyciski save i send.