Przewodnik po stylu interfejsu dla dodatków do Google Workspace

Dodatki Google Workspace powinny być spójne ze stylem i układem aplikacji hosta, którą rozszerzają. Powinny rozszerzać interfejs użytkownika w naturalny sposób, wykorzystując znane elementy sterujące i zachowania. Wskazówki te opisują sposoby obsługi tekstu, obrazów, elementów sterujących i elementów marki, które zapewniają użytkownikom wysoką jakość.

Jeśli Twój dodatek otwiera osobne strony internetowe, które są integralną częścią jego działania (np. stronę ustawień), upewnij się, że te strony również są zgodne z tymi wytycznymi dotyczącymi stylu.

Tekst i obrazy

Z tej sekcji dowiesz się, jak prawidłowo używać tekstu i obrazów w swoim dodatku.

Nazwa dodatku

Nazwa dodatku musi zostać ustawiona w pliku manifestu projektu oraz podczas konfigurowania dodatku na potrzeby publikacji. Nazwa jest widoczna w wielu miejscach, np. w Google Workspace Marketplace i w menu. Podczas wybierania nazwy:

  • Stosuj wielkość liter jak w nazwach własnych.
  • Unikaj znaków interpunkcyjnych, zwłaszcza nawiasów, chyba że stanowią część nazwy marki.
  • Niech będzie krótki – najlepiej 15 znaków lub mniej. Długie nazwy mogą być automatycznie obcinane w informacjach o aplikacji w Google Workspace Marketplace i w innych miejscach.
  • Nie używaj w nazwie dodatku słów „Google”, „Gmail” ani innych nazw produktów Google.
  • Nie umieszczaj w nazwie dodatku słowa „add-on”.
  • Nie podawaj informacji o wersji.

Styl pisania

Nie musisz pisać dużo. Większość działań powinna być jasna dzięki ikonografii, układowi i krótkim etykietkom. Jeśli okaże się, że część Twojego dodatku wymaga bardziej obszernego wyjaśnienia niż krótkie etykiety, najlepiej utworzyć osobną stronę internetową z opisem dodatku i umieścić do niej link.

Podczas pisania tekstu interfejsu:

  • Używaj wielkości liter w zależności od kontekstu (zwłaszcza w przypadku przycisków, etykiet i działań kart).
  • Korzystaj z krótkich, prostych tekstów bez fachowych sformułowań ani skrótów.

Działania uniwersalne i działania na karcie

Jeśli w dodatku używasz działań uniwersalnych lub działań karty, pojawiają się one jako elementy menu w określonych przez Ciebie kartach. Możesz wybrać tekst używany w tych menu w przypadku tych działań. Podczas wybierania tekstu:

  • Unikaj tekstu menu, który po prostu powtarza nazwę dodatku.
  • Każdy element menu powinien zaczynać się od słowa określającego działanie, np. „Uruchom”, „Skonfiguruj” lub „Utwórz”.
  • Opisz zadanie, a nie element interfejsu użytkownika, który wyświetla działanie.
  • Jeśli działanie rozpoczyna przepływ pracy, a nie ma czasownika, który opisywałby, co ono robi, nazwij je „Start”.
  • Zmniejsz liczbę elementów menu, aby nie zmuszać użytkownika do przewijania długiej listy. Jeśli chcesz wdrożyć więcej działań, rozważ użycie kilku kart z różnymi działaniami.

Komunikaty o błędach

Gdy coś pójdzie nie tak, ważne jest, aby używać prostego języka. Wyjaśnij problem z perspektywy użytkownika i wskaż sposób jego rozwiązania.

  • Nie zezwalaj użytkownikowi na wyświetlanie wyjątków wywołanych przez Twój kod. Zamiast tego używaj instrukcji try...catch do przechwytywania wyjątków, a następnie wyświetlaj przyjazny dla użytkownika komunikat o błędzie.
  • Przed opublikowaniem sprawdź, czy w interfejsie dodatku nie wyświetlają się informacje debugowania.

Materiały edukacyjne

Możesz zaprojektować karty, które wyświetlają informacje pomocowe lub objaśniają użytkownikowi działanie dodatku. Jeśli tworzysz treści pomocy dotyczące dodatku, pamiętaj o tych kwestiach:

  • W miarę możliwości wyświetlaj instrukcje w postaci listy punktowanej lub numerowanej. Przeprowadź użytkowników do końcowego wyniku, wyraźnie odwołując się do nazwanych elementów interfejsu.
  • Upewnij się, że instrukcje jasno określają wymagania, np. sposób konfiguracji arkusza kalkulacyjnego.
  • Możesz dodać link do zewnętrznych materiałów pomocy, takich jak strony internetowe z informacjami.

Obrazy

Obrazy używane w dodatku to wbudowane typy ikon lub obrazy hostowane publicznie i wskazane za pomocą adresu URL. Jeśli używasz hostowanych obrazów, upewnij się, że są one dostępne dla wszystkich, którzy mogą korzystać z Twojego dodatku.

Elementy sterujące

W tej sekcji znajdziesz wskazówki dotyczące wygody użytkowników w przypadku widżetów interaktywnych.

Przyciski

Do sterowania głównymi działaniami interfejsu używaj przycisków, a nie innych widżetów.

  • Większość etykiet przycisków tekstowych powinna zaczynać się od czasownika.
  • W większości przypadków wiersze przycisków powinny zawierać maksymalnie 3 przyciski.

DecoratedText

Widgety z tekstem ozdobionym grafiką umożliwiają prezentowanie treści tekstowych z ikonami, przyciskami lub przełącznikami.

  • Stosuj wielkość liter jak w zdaniu.
  • Tekst widżetu DecoratedText jest obcinany, jeśli nie mieści się w dostępnej przestrzeni. Z tego powodu zawsze staraj się, aby tekst był jak najkrótszy.

Dane wejściowe wyboru

W dodatku możesz używać różnych widżetów z opcjami wyboru: menu, pola wyboru i przycisków opcji.

  • Używaj pól wyboru, gdy użytkownicy mogą wybrać kilka opcji lub żadną. Używaj przycisków opcji (lub menu wyboru), gdy musi być wybrana dokładnie 1 opcja. Korzystaj z list rozwijanych, aby wyświetlić krótką listę alternatyw, jednocześnie oszczędzając miejsce w interfejsie.
  • W przypadku tekstu przypisanego do każdej opcji stosuj wielkość liter jak w zdaniu.
  • Unikaj wprowadzania zmian w wybranych elementach, które mogą powodować poważne zmiany trudne do cofnięcia, ponieważ użytkownicy często popełniają błędy podczas dokonywania wyborów. Zamiast tego rozważ dodanie przycisku, który odczytuje bieżące wartości wyboru i wywoła działanie.
  • W przypadku menu sortuj opcje alfabetycznie lub według schematu logicznego, który jest zrozumiały dla wszystkich użytkowników (np. prezentowanie dni tygodnia w kolejności od niedzieli do poniedziałku).
  • Ogranicz liczbę opcji w danym widżecie wyboru do rozsądnej liczby. Jeśli opcji jest zbyt dużo, użytkownicy mogą mieć trudności z używaniem widżetu. W takich przypadkach rozważ podzielenie opcji na różne kategorie i wiele widżetów.

Pola tekstowe

Pola tekstowe umożliwiają użytkownikom wpisywanie danych tekstowych.

  • Nie używaj pola tekstowego, aby użytkownik musiał wpisać jeden z określonych zestawów możliwych wpisów. Zamiast tego użyj menu.
  • Użyj wskazówek i sugestii, aby pomóc użytkownikowi wpisać tekst w odpowiednim formacie i z odpowiednimi treściami.
  • Jeśli tekst, który chcesz wpisać, składa się z więcej niż kilku słów, użyj pola tekstowego wielowierszowego.

Promowanie marki

W tej sekcji znajdziesz wskazówki dotyczące dodawania elementów marki do interfejsu rozszerzenia.

W Twoim dodatku

Jeśli chcesz umieścić w interfejsie dodatku elementy marki, postaraj się, aby były one krótkie i nienarzucające się. Dzięki temu użytkownicy będą mogli skupić się na funkcjach dodatku.

  • Wszystkie aspekty dodatku muszą być zgodne ze wytycznymi dotyczącymi marki.
  • Nie używaj słów „Google”, „Gmail” ani nazw innych usług Google.
  • Nie używaj ikon produktów Google, nawet jeśli są one zmienione.
  • Nie używaj w tekście reklamowym słowa „add-on” (dodatek).
  • Tekst dotyczący marki powinien składać się z maksymalnie kilku słów.

W Google Workspace Marketplace

Podczas konfigurowania dodatku do opublikowania podajesz wiele zasobów tekstowych i graficznych, aby utworzyć stronę dodatku w Google Workspace Marketplace.

Wszystkie aspekty informacji o aplikacji i te zasoby muszą być zgodne z wytycznymi dotyczącymi marki.