Protokół Projektowy World

Zasady, Wytyczne i Zasoby

Zasady Projektu

  • Ludzki

    Przekonanie, że naturalne i nieprzewidywalne cechy ludzkie są niezbędne do innowacji.

  • Uniwersalny

    Język wizualny, który zapewnia inkluzywność, dostępność oraz globalne połączenie.

  • Optymistyczny

    Wiara w ludzkość i w rolę, jaką technologia może odgrywać w podnoszeniu jakości życia każdego człowieka.

Przegląd marki

Wszystkie narzędzia istnieją pod parasolem marki głównej, którą jest World.

Przegląd MarkiPrzegląd Marki
Przegląd MarkiPrzegląd Marki

Identyfikacja Wizualna

Logo World

Logo World to wizualny punkt odniesienia naszej marki — jest proste, czytelne i uniwersalne. Jest oparte na ponadczasowych zasadach projektowania i odzwierciedla nasze zaangażowanie w dostępność, innowacyjność oraz globalne połączenie.

Nasz znak graficzny jest podstawowym elementem tożsamości naszej marki. Zawsze używaj logo w jego oryginalnej formie i zachowuj wokół niego wolną przestrzeń, aby zapewnić czytelność i wyrazistość. Modyfikacje, zniekształcenia lub użycie niezatwierdzonych kolorów mogą naruszyć jego integralność.

Wizualna prezentacja zasad i wytycznych marki WorldWizualna prezentacja zasad i wytycznych marki World
Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.

Nasz logotyp jest kluczowym elementem identyfikacji wizualnej naszej marki, współgrającym ze znakiem logo, aby jasno i stylowo komunikować naszą nazwę. Wprowadzanie zmian, rozciąganie lub stosowanie niezatwierdzonych efektów na logotypie jest niedozwolone.

Graficzne przedstawienie elementów brandingu World w sekcji wytycznych markiGraficzne przedstawienie elementów brandingu World w sekcji wytycznych marki
Grafika przedstawiająca wytyczne dotyczące marki World, ilustrująca zasady projektowania oraz zasoby.Grafika przedstawiająca wytyczne dotyczące marki World, ilustrująca zasady projektowania oraz zasoby.

Układ logo łączy symbol logo oraz logotyp w jeden spójny projekt, reprezentując naszą markę w najbardziej kompletnej formie. Połączenie to należy zawsze używać zgodnie z wytycznymi, zachowując właściwe proporcje, odstępy i ustawienie elementów względem siebie. Unikaj rozdzielania, zmiany rozmieszczenia lub niezależnego skalowania elementów. Zawsze korzystaj z wytycznych dotyczących rozmiaru, odstępów i umiejscowienia, aby zachować integralność.

Wizualna reprezentacja związana z brandingiem World oraz zasadami projektowania.Wizualna reprezentacja związana z brandingiem World oraz zasadami projektowania.
Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.

Obszar ochronny (ang. clearspace) określa minimalny dystans pomiędzy znakiem a innymi elementami graficznymi lub tekstowymi w kompozycji. Jego celem jest zapewnienie czytelności oraz integralności wizualnej logo we wszystkich zastosowaniach. Wielkość obszaru ochronnego definiuje szerokość litery „o” ze słowa „world” i powinna być zachowana ze wszystkich stron znaku

Wizualna reprezentacja związana z wytycznymi marki World oraz zasadami projektowaniaWizualna reprezentacja związana z wytycznymi marki World oraz zasadami projektowania
Zasady poprawnego stosowania logo i kolorystyki
Co Można Robić z Logo i KoloramiCo Można Robić z Logo i Kolorami

Czego Nie Można Robić z Logo i Kolorami
Czego Nie Można Robić z Logo i KoloramiCzego Nie Można Robić z Logo i Kolorami

W przypadku prezentowania współpracy partnerskiej logo World może być łączone z logo innej marki w następujących formatach.

Współpraca PartnerskaWspółpraca Partnerska

Kolory

Neutralny
paleta ciemnoszarapaleta ciemnoszara
Delikatny, subtelny, wyrafinowany, stonowany, nienarzucający się, kojący
Kolor podstawowy
paleta podstawowapaleta podstawowa
Wyrażający spokój, uczciwość, opanowanie, refleksyjność, mądrość, zaufanie
Kolory drugorzędne
paleta dodatkowapaleta dodatkowa
Wyrażające witalność, szczęście, żywiołowość, optymizm, energię, Inkluzywność
Ilustracja przedstawiająca hierarchię kolorów w wytycznych marki WorldIlustracja przedstawiająca hierarchię kolorów w wytycznych marki World
Przykłady oznaczeń kolorystycznych zgodnych z wytycznymi marki World w protokole projektowym.Przykłady oznaczeń kolorystycznych zgodnych z wytycznymi marki World w protokole projektowym.
Wizualna reprezentacja zasad oznaczeń kolorystycznych w wytycznych marki WorldWizualna reprezentacja zasad oznaczeń kolorystycznych w wytycznych marki World
Wizualna reprezentacja zasad oznaczeń kolorystycznych w wytycznych projektowych marki WorldWizualna reprezentacja zasad oznaczeń kolorystycznych w wytycznych projektowych marki World
Ilustracja dotycząca oznaczeń kolorystycznych w wytycznych marki WorldIlustracja dotycząca oznaczeń kolorystycznych w wytycznych marki World

Kolory dodatkowe są wykorzystywane zarówno w celach ekspresyjnych, jak i użytkowych w ramach marki World. Przykładem jest kodowanie kolorami różnych poziomów dostępu identyfikatorów eventowych, zlokalizowane gradientowe kolory flag na materiały promocyjne, semantykę kolorów w interfejsach użytkownika i ekspresyjne materiały wizualne.

portugaliaportugalia
Wielka BrytaniaWielka Brytania

Typografia

World Pro to czcionka zaprojektowana specjalnie z myślą o skalowalności oraz stworzeniu uniwersalnego systemu wizualnego dla wszystkich użytkowników, integracji i wchodzących w interakcję z World. To jedyny krój pisma wykorzystywany przez markę World.

World ProWorld Pro

Czcionka World Pro

Grubości pisma

Istnieją dwie grubości czcionki World Pro: Regular oraz Medium. Najczęściej używana jest wersja Regular, a Medium służy jako akcent w przypadkach, kiedy potrzebne jest dodatkowe podkreślenie.

World Pro MediumWorld Pro Medium
Odstępy między wierszami i literami
Odstępy między wierszami i znakamiOdstępy między wierszami i znakami
Odstępy między wierszami i znakamiOdstępy między wierszami i znakami
Wyrównanie
WyrównanieWyrównanie

World Pro Regular jest zazwyczaj wystarczająco uniwersalna, by stosować ją zarówno w nagłówkach, jak i w treści głównej, a hierarchia tworzona jest głównie poprzez różnicowanie wielkości.

World Pro Medium można stosować w krótszych podtytułach, gdy wymagany jest większy nacisk wizualny.

NagłówkiNagłówki
UżytkowanieUżytkowanie
outdoor-screen-3 3outdoor-screen-3 3

Korzystamy z czcionki Noto razem z naszym podstawowym krojem pisma łacińskiego, aby zapewnić wszechstronne wsparcie dla wszystkich skryptów niełacińskich. Noto została wybrana ze względu na swoje szerokie pokrycie języków świata i oferuje spójną i wizualnie harmonijną typografię w różnych pismach, w tym w chińskim, arabskim, cyrylicy i japońskim.

To podejście pozwala nam zachować spójność marki i inkluzywność, zapewniając, że nasza komunikacja dociera do użytkowników na całym świecie w ich rodzimych alfabetach, bez kompromisów w czytelności lub estetycznej spójności.

Sekcja wytycznych marki World prezentująca zasoby projektowe i przykłady typografii.Sekcja wytycznych marki World prezentująca zasoby projektowe i przykłady typografii.
Mandaryński: Noto Sans HKn
Wizualna reprezentacja elementu akordeonu w wytycznych marki World, z tekstem w czcionce Noto Sans JP.Wizualna reprezentacja elementu akordeonu w wytycznych marki World, z tekstem w czcionce Noto Sans JP.
Japoński: Noto Sans JP
Graficzna reprezentacja czcionki Noto Sans Arabic, należącej do wytycznych marki WorldGraficzna reprezentacja czcionki Noto Sans Arabic, należącej do wytycznych marki World
Arabski: Noto Sans Arabic
Wizualne przedstawienie tekstu w języku bengalskim w czcionce Noto Sans Bengali, prezentujące typografię marki.Wizualne przedstawienie tekstu w języku bengalskim w czcionce Noto Sans Bengali, prezentujące typografię marki.
Bengalski: Noto Sans Bengali
Przykład czcionki Noto Sans Hebrew w ramach wytycznych markiPrzykład czcionki Noto Sans Hebrew w ramach wytycznych marki
Hebrajski: Noto Sans Hebrew
Wizualizacja elementu akordeonu zawierająca element projektowy marki World, eksponująca cyrylicę w czcionce Noto Sans.Wizualizacja elementu akordeonu zawierająca element projektowy marki World, eksponująca cyrylicę w czcionce Noto Sans.
Cyrylica: Noto Sans

W sytuacjach, gdy World Pro nie jest dostępny, np. w Google Slides, można użyć alternatywnego kroju z biblioteki Google Fonts: w tekście zasadniczym stosuje się czcionkę Inter, natomiast w nagłówkach – Inter Tight. Dozwolone jest użycie wyłącznie tych czcionek z biblioteki Google Fonts i wyłącznie w sytuacji, gdy użycie World Pro jest niemożliwe.

Grafika przedstawiająca elementy projektowe wytycznych marki World.Grafika przedstawiająca elementy projektowe wytycznych marki World.

Kompozycja

Siatka to jedno z najważniejszych narzędzi w systemie projektowym. Jest niezbędna we wszystkich układach oraz kompozycjach i powinna być stosowana zawsze. W zależności od rozmiaru obszaru roboczego oraz liczby zawartych w nim elementów może mieć 2, 4, 6 lub 8 kolumn, lecz wszystkie elementy kompozycji powinny być wyrównane do bazowej siatki i proporcjonalnie rozstawione względem marginesów.

Wizualna reprezentacja zasad i wytycznych projektowych marki WorldWizualna reprezentacja zasad i wytycznych projektowych marki World
Materiały wewnętrzne

We wszystkich materiałach wewnętrznych i materiałach marki, gdzie logo występuje z innymi elementami i treścią, logo umieszcza się w lewym górnym rogu układu dla zachowania spójności.

Ilustracja pokazująca wytyczne dotyczące umiejscowienia logo w brandingu WorldIlustracja pokazująca wytyczne dotyczące umiejscowienia logo w brandingu World
Samodzielna wersja logo

W układach, gdzie logo jest jedynym elementem (jak karty wideo czy wybrane kampanie lub ogłoszenia), logo jest umieszczane w centralnej części układu.

Graficzna reprezentacja przedstawiająca wytyczne dotyczące umiejscowienia logo na materiałach brandingowych WorldGraficzna reprezentacja przedstawiająca wytyczne dotyczące umiejscowienia logo na materiałach brandingowych World
Profile w mediach społecznościowych
Ilustracja prezentująca prawidłowe umiejscowienie logo w brandingu WorldIlustracja prezentująca prawidłowe umiejscowienie logo w brandingu World
World to sieć prawdziwych ludziWorld to sieć prawdziwych ludzi
benefitybenefity
benefity world idbenefity world id

Ilustracja

Każdy z głównych produktów World ma przypisaną ilustrację, wynikającą z charakteru produktu lub jego oferty.

World ID
telefonytelefony
World App
Grafika dotycząca aplikacji World App w wytycznych markiGrafika dotycząca aplikacji World App w wytycznych marki
World Chain
Wizualizacja dotycząca zasad brandingu World ChainWizualizacja dotycząca zasad brandingu World Chain
Worldcoin
Ilustracja dotycząca brandingu Worldcoin, ukazująca zasady i zasoby projektoweIlustracja dotycząca brandingu Worldcoin, ukazująca zasady i zasoby projektowe
Orb
Ilustracja lub grafika związana z Orbem, będąca częścią wytycznych marki WorldIlustracja lub grafika związana z Orbem, będąca częścią wytycznych marki World

Chociaż istnieje wiele sposobów prezentowania danych, należy stosować spójny styl. Kontury, kształty geometryczne wykresów i diagramów, subtelne i zamierzone użycia wypełnień oraz koloru to stałe elementy grafiki wizualizacji danych.

Przykład 1 – Wykres słupkowy
Ilustracyjny wykres słupkowy przedstawiający dane w wytycznych marki WorldIlustracyjny wykres słupkowy przedstawiający dane w wytycznych marki World
Przykład 2 – Model skalowy
Ilustracja modelu w skali przedstawiająca elementy marki World i zasady projektowe.Ilustracja modelu w skali przedstawiająca elementy marki World i zasady projektowe.
Przykład 3 – Wykres ceny
Graficzna przedstawienie trendów cenowych dla produktów World.Graficzna przedstawienie trendów cenowych dla produktów World.
Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.
Wizualna reprezentacja wytycznych marki World w dekoracyjnym formacie akordeonowym.Wizualna reprezentacja wytycznych marki World w dekoracyjnym formacie akordeonowym.
Stylizowana grafika przedstawiająca zasady projektowania marki WorldStylizowana grafika przedstawiająca zasady projektowania marki World
Graficzne przedstawienie elementów brandingu World, ilustrująca wytyczne projektowe.Graficzne przedstawienie elementów brandingu World, ilustrująca wytyczne projektowe.
Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowania oraz zasoby.
Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowe oraz zasoby.Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady projektowe oraz zasoby.
Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady oraz zasoby projektowe.Grafika ilustrująca wytyczne dotyczące marki World, podkreślająca zasady oraz zasoby projektowe.
Wizualne przedstawienie wytycznych marki World, zawierające zasoby i zasady projektowe.Wizualne przedstawienie wytycznych marki World, zawierające zasoby i zasady projektowe.
Grafika przedstawiająca zasady i wytyczne projektowe marki World w formacie akordeonu.Grafika przedstawiająca zasady i wytyczne projektowe marki World w formacie akordeonu.
Graficzna reprezentacja związana z zasadami projektowymi marki World, znajdująca się w sekcji wytycznych markiGraficzna reprezentacja związana z zasadami projektowymi marki World, znajdująca się w sekcji wytycznych marki
Graficzna reprezentacja zasobów marki World w układzie zgodnym z identyfikacją wizualną.Graficzna reprezentacja zasobów marki World w układzie zgodnym z identyfikacją wizualną.
Wizualna reprezentacja związana z wytycznymi marki World w sekcji protokołu projektowego.Wizualna reprezentacja związana z wytycznymi marki World w sekcji protokołu projektowego.
Graficzna reprezentacja związana z wytycznymi marki World, prezentująca elementy projektu.Graficzna reprezentacja związana z wytycznymi marki World, prezentująca elementy projektu.
Ilustracja przedstawiająca zasady i wytyczne marki World.Ilustracja przedstawiająca zasady i wytyczne marki World.
Logo World w nowoczesnym designie, reprezentujące innowacyjność i wzmacnianie potencjału w obszarze technologii.Logo World w nowoczesnym designie, reprezentujące innowacyjność i wzmacnianie potencjału w obszarze technologii.
Graficzna reprezentacja związana z wytycznymi marki World i zasadami projektowymiGraficzna reprezentacja związana z wytycznymi marki World i zasadami projektowymi

Gradientowe siatki pełnią funkcję kolorowych, ekspresyjnych grafik i używane są na dwa sposoby:

  1. Jako zlokalizowane odwzorowania z użyciem kolorów mapy danego kraju jako baz dla przejścia gradientu
  2. Grafiki nastrojowe, niezwiązane z określonymi kolorami, które po prostu wyrażają nastrój lub energię.
Przykład 1 – Kolumbia
kolumbiakolumbia
Przykład 2 – Argentyna
ArgentynaArgentyna

Ikonografia

Poniżej znajduje się pełny zestaw ikon w aktualnej wersji. W przyszłości mogą być tworzone kolejne ikony, jednak muszą one być tworzone zgodnie z wytycznymi w celu zachowania spójności.

Ikony World są zaprojektowane jako rozszerzenie naszego kroju pisma, naśladując grubość linii oraz krzywizny.

Bardzo ważne jest, by wszystkie ikony zestawiane z tekstem zachowywały te same proporcje i wyrównanie, aby harmonizowały z krojem pisma. Ikony są zaprojektowane w taki sposób, że poziome ikony prostokątne są wyrównane do górnej i dolnej wysokości majuskuł i są wyśrodkowane w pionie.

Grupa Ex Grupa Ex
Rozmiar ikon

Wszystkie ikony SVG znajdują się w standardowej ramce. Aby utrzymać spójny rozmiar względem typografii, można zastosować wzór do ramki ikony: pomnóż rozmiar czcionki przez 1,07, aby uzyskać rozmiar ramki ikony. Np. jeśli rozmiar czcionki to 180px, ramka ikony powinna mieć szerokość (180x1,07)=192,6px.

MailMail
Rozmiar CzcionkiRozmiar Czcionki

Zasoby

Zasoby dla banerów głównych, gradientu, symbolu waluty WLD, Orba, World App, World Chain itp.