Strona główna » Projektowanie interakcji

Droga do wstążki Office 2007

19 października 2010 napisała Iga [ 3 odpowiedzi ] Drukuj wpis

W dobrym tonie, szczególnie wśród projektantów interakcji, jest uwielbiać Apple i potępiać produkty Microsoftu. Przyznaję, mnie również zdarzyło się być uszczypliwą względem IE 9, gdy jedyną przekąską na InternetBeta 2010 były niebieskie ciasteczka w kształcie szóstki… znaczy się dziewiątki. Jednak Microsoft od czasu do czasu wprowadza zmiany w interfejsie, które odbijają się szerokim echem w branży. I nie mówię tutaj tylko o Clippy.

Wstążka Office 2007 czyli ribbon

Jedną z ciekawszych i odważniejszych zmian w Office było wprowadzenie w interfejsie wstążki, czyli rozbudowanego menu zakładkowego, z pogrupowanymi zestawami funkcji, przedstawionych głównie za pomocą ikon. Jensen Harris, opowiadając historię powstania wstążki na konferencji MIX08, przywołał 4 cele, jakie postawił przed sobą zespół UX Microsoftu, tworząc nowego Office’a:

-        uprościć obsługę programu,

-        zaoszczędzić czas użytkowników,

-        pomóc ludziom odkryć więcej możliwości programu,

-        oraz umożliwić im tworzenie atrakcyjnych, zaawansowanych dokumentów.

Wstążka z pakietu Office 2007

Wstążka z pakietu Office 2007

W tym celu opracowali zestaw kilku zasad, które były podstawą nowego interfejsu. Każdy pomysł, jaki powstawał w głowach zespołu, a było ich wiele, był weryfikowany pod kątem tej doktryny. Aby zasady nie obrosły kurzem tuż po ich opracowaniu, były dodawane do każdego tworzonego prototypu. W ten sposób, testując którekolwiek z rozwiązań, zespół miał zawsze przed oczami treść doktryny.

Geneza wstążki

Zanim powstała wstążka, każdy program z pakietu Office rozrastał się w kolejnych wersjach o nowe funkcjonalności. Z poniżej 50 pozycji w menu w Wordzie 1.0 osiągnięto 250 w Wordzie 2003. Dwa paski narzędziowe rozrosły się do 32, do czego doszło aż 19 okienek zadaniowych. Efekt daleki był od prostoty i łatwości obsługi.

Microsoft Office 2003

Microsoft Office 2003

Głównym problemem, z jakim borykał się zespół tworzący nowego Office’a, było zbytnie rozbudowanie aplikacji. Jak pokazać 250 funkcji, żeby każdy mógł do nich dotrzeć? W Wordzie 2000 postanowiono część funkcji po prostu… schować. Chyba najgorsza z możliwych opcji – zamiast uprościć interfejs, chowa się połowę jego funkcjonalności. A żeby ułatwić ich odnalezienie i nauczyć początkującego użytkownika zaawansowanych funkcji powstał asystent Office – ukochany przez wszystkich Clippy a.k.a. Pan Spinacz ;)

Microsoft Office 2000

Microsoft Office 2000

Opracowanie wstążki zostało poprzedzone stworzeniem olbrzymiej ilości prototypów o różnym poziomie szczegółowości, aby móc przetestować ciekawsze pomysły projektantów. Ich mnogość i różnorodność pokazują, jak dużą swobodę miał zespół w tworzeniu nowego interfejsu. Świadczy to moim zdaniem o dojrzałości kultury UX – kiedy projekty nie powstają na chybcika, na bazie „pierwszego lepszego” pomysłu, lecz są wynikiem przetestowania całej masy rozwiązań, w celu odnalezienia tego optymalnego. Ilu projektantów ma taki luksus? ;)

Projektowanie w oparciu o badania

Tworzeniu Office 2007 towarzyszyły niesamowite ilości badań i zbieranych danych: 10,000 godzin nagrań ludzi korzystających z oprogramowania, 352 miliony kliknięć zliczonych ciągu tylko 90 dni itd. Mnóstwo metod badawczych, od testów użyteczności, przez eyetracking i sortowanie kart, po badanie nazwane „Truman Show” (jeden użytkownik w codziennej swojej pracy monitorowany przez kilka kamer jednocześnie). Badania stanowiły zarówno podstawę pomysłów i projektów, jak i weryfikację prototypów.

Jednym z ciekawszych dla mnie wyników tych badań była częstotliwość użycia różnych komend w programach pakietu. Spróbujcie zgadnąć wyniki (rozwiązania na końcu artykułu):

  1. Co jest najpopularniejszą komendą w Excelu?
  2. Co jest częściej używane – ponad siedmiokrotnie – w Outlooku: wyślij czy usuń?
  3. W jaki sposób użytkownicy częściej zapisują dane w Wordzie: przez skrót ctrl+S czy klikając w ikonę dyskietki?
  4. A komenda wklej: przez skrót ctrl+V czy ikonę?

Takie dane stały się podstawą do określenia ważności funkcji na wstążce i wielu decyzji projektowych (np. zostawić ikonę dyskietki czy ją ukryć?).

Zespół Microsoftu prowadził także liczne badania prototypów i wersji beta oprogramowania. Na ich podstawie zdecydowano się na poziomą wstążkę (zamiast pionowego panelu), czy przeniesienie tytułów grup pod przyciski funkcji (początkowo były ponad przyciskami, tuż pod zakładkami).

Ograniczenia wstążki

  • Nauka od nowa - Jednym z najczęstszych zarzutów wobec wstążki jest nowa kategoryzacja funkcji świetnie znanych heavy userom. Do tej pory interfejs programów pakietu Office raczej się rozrastał, niż zmieniał, więc wieloletni, zaawansowani użytkownicy nie mieli większych problemów ze znalezieniem często używanych opcji. Wstążka wywróciła wszystko do góry nogami. Nagle trzeba było nauczyć się interfejsu od nowa. I faktycznie, choć wstążka okazała się być znacznie łatwiejsza do nauki dla nowych lub początkujących użytkowników, to na tych zaawansowanych nakładała konieczność nauki interfejsu od nowa.  Nowa kategoryzacja, mimo iż oparta na licznych badaniach sortowania kart, nie jest w stanie pokryć 100% preferencji użytkowników. Ja np. po dziś dzień wprowadzając przypis w Wordzie szukam w zakładce Wstawianie, zamiast Odwołania.
  • Brak dostosowania - Drugi zarzut stawiany nowemu interfejsowi to brak możliwości dostosowania jego wyglądu przez użytkownika (customisation), co także uderza głównie w heavy userów.
  • Zawłaszczenie obszaru edycji - Kolejny problem wstążki to zawłaszczenie dużego obszaru ekranu na przyciski. I choć przy moim ukochanym 24 calowym monitorze nie stanowi to żadnego problemu, o tyle pisanie artykułu na laptopie, bez wsparcia dodatkowego monitora, zaczyna już być irytujące. Jasne, wstążkę można zminimalizować (przyznam, że nie wiedziałam o tym przed oglądnięciem prezentacji Harrisa), ale wtedy traci ona trochę sens (znowu ukrywamy coś, co miało być odkryte).

Wstążka nie jest wcale świętym Graalem interfejsów softwarowych, posiada wiele ograniczeń. Zanim podejmie się decyzje o zastosowaniu podobnego rozwiązania w aplikacji, warto zadać sobie pytania:

- Czy naprawdę program posiada aż tyle funkcji? Wstążka nabiera sensu dopiero w bardzo, bardzo rozbudowanych aplikacjach. W mniejszych wizualizacje funkcji mogą nie zrekompensować wielkości zawłaszczonego obszaru.

- Czy da się sensownie pogrupować funkcje na porównywalne liczebnie grupy? Grupowanie ich na siłę będzie zgubne dla intuicyjności, a upychanie jednej zakładki przy pozostawieniu drugiej prawie pustej będzie po prostu nieefektywnym wykorzystaniem przestrzeni.

- Czy wiadomo, które funkcjonalności są faktycznie często używane i najbardziej potrzebne? Jeśli nie wiadomo, to warto najpierw przeprowadzić analizę.

- Czy do jednej treści potrzebne są różne narzędzia w różnych zakładkach? Wstążka znacznie lepiej sprawdzi się jako zestaw różnorodnych narzędzi do jednej treści, niż zestaw linków prowadzących do nowych stron w aplikacji webowej.

Być jak zespół Microsoft Office

To, czego przede wszystkim zazdroszczę zespołowi projektantów Office’a, to możliwość realizowania tak dużej ilości badań i dostępność takiej ilości czasu na rozwój koncepcji interfejsu. Gorąco polecam obejrzeć wystąpienie Harrisa, w którym prezentuje kilka ciekawych, choć niekoniecznie użytecznych prototypów, które poprzedziły wstążkę.

A na koniec – Microsoft miewa poczucie humoru i pamięta o Clippy:

Odpowiedzi:

Ad. 1. Najpopularniejsze jest Wklej. Kolejne wg popularności to: Kopiuj i Zapisz.

Ad. 2. Oczywiście najpopularniejsza komenda w Outlooku to usuń (SPAM FTW) – ponad 14 milionów użyć względem 1,8 miliona dla Wyślij.

Ad. 3. 80% używa do zapisywania dokumentu ikony, tylko 20% skrótu klawiszowego.

Ad. 4. Do wklejania w Wordzie użytkownicy korzystają w takim samym stopniu ze skrótu klawiszowego, co z ikony.

Warto zobaczyć:

http://videos.visitmix.com/MIX08/UX09

http://blogs.msdn.com/b/jensenh/archive/tags/why+the+new+ui_3f00_/default.aspx

http://www.adaptivepath.com/ideas/essays/archives/000977.php

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: , , ,
  • http://www.usersketch.com Dariusz

    Bardzo fajna, dokładna analiza.

    Brakuje mi tylko jednej informacji, którą zapamiętałem z wywiadu z autorami Wstążki (niestety było to dawno temu i nie potrafię znaleźć źródła). Otóż główną motywacją do jej powstania były przede wszystkim niezliczone ilości próśb do zespołu MS Office o stworzenie funkcji, które już istniały w programie – to był sygnał dla projektantów, że tzw. discoverability w programie kuleje.

    Druga ciekawostka to fakt, że projektanci, pomimo chęci tworzenia coraz bardziej innowacyjnych interfejsów, ciągle zostają przy ikonie dyskietki, jako metafory zapisania czegoś na dysk. Z dyskietek od praktycznie 10 lat już nikt nie korzysta, nowe pokolenia mogły nie widzieć takiej na oczy, a cały czas stanowi symbol zapamiętania danych.

    Pozdrawiam,
    D.

  • http://www.usersketch.com Dariusz

    I mam jeszcze jedno pytanko :)

    Dlaczego stosujecie słowo „funkcjonalności” w kontekście „funkcji”? Przecież to pochodzi od przymiotnika „funkcjonalny”, czyli taki, który dobrze spełnia swoją funkcję.

  • http://uxbite.com Iga

    Dzięki :)

    Tak, faktycznie jedną z głównych motywacji było zwiększenie „odkrywalności” istniejących już funkcji (dlatego jednym z celi redesignu, jaki podał Harris, było „pomóc ludziom odkryć więcej możliwości programu”), choć nie była to jedyna motywacja. Chodziło także o zwiększenie poczucia mistrzostwa w użyciu aplikacji, czyli świadomości, że rozumie się działanie aplikacji i potrafi się skorzystać z opcji, jakie daje. A także kilka innych powodów/celów :) Ale nie starczyłoby mi artykułu na omówienie ich wszystkich ;)

    Co do słowa funkcjonalność – o ile wiem, ma ono dwa znaczenia. Jest również używany w kontekście „funkcji” właśnie. Chyba przejęłam takie użycie terminu od programistów :) Osobiście jestem z nim bardziej związana, niż z funkcjonalnością, jako synonimem ergonomii (co moim zdaniem nie jest właściwą opcją). Nie tylko ja używam słowa w tym kontekście:
    http://applemania.pl/2010/08/29/nowe-funkcjonalnosci-w-listonic
    http://www.mbank.pl/przewodnik/funkcjonalnosci/
    http://www.ittechnology.us/narzedzia-dla-webmsterow-google-nowe-funkcjonalnosci/