Identyfikacja

Znak, paleta i szablony

Wszystko, czym PRIME Q się pokazuje, w jednym miejscu i z jednego źródła. Pliki są gotowe do użycia: font jest osadzony w środku, więc prezentacja i dokument otworzą się tak samo na cudzym komputerze.

Cały zestaw

Pobierz i zacznij

Jedno archiwum z całością: znak we wszystkich wersjach, elementy graficzne, tokeny kolorów, font i cztery szablony. W środku jest README, które mówi, od czego zacząć.

Pobierz zestaw (ZIP)

Około 3,5 MB. Zawiera README z instrukcją.

Zobacz spis zawartości
Szablony

Cztery drogi do tego samego wyglądu

Wybierz narzędzie, w którym i tak pracujesz. Wygląd jest ten sam, bo wszystkie cztery wychodzą z tej samej palety i tego samego kroju.

PowerPoint

Prezentacja

Prawdziwy wzorzec slajdów z jedenastoma układami: tytuł, sekcja, treść, dwie kolumny, dane, teza, tabela, obraz, zamknięcie, nota prawna i pusty. Paleta wchodzi do motywu, więc pokazuje się w palecie kolorów PowerPointa. Zainstaluj .potx i twórz z niego nowe pliki; .pptx to gotowa prezentacja poglądowa, po jednym slajdzie na układ.

Podgląd wszystkich dziesięciu slajdów Podgląd wszystkich dziesięciu slajdów
Word

Dokument

Style nagłówków, akapitu wprowadzającego, cytatu, podpisu i noty prawnej. Punktor jest ukośnikiem, stopka sama numeruje strony, a nagłówek niesie znak. Format A4, marginesy 2,5 cm.

Podgląd obu stron dokumentu Podgląd obu stron dokumentu
Markdown

Marp i Quarto

Dla pracy w tekście zamiast w kliknięciach. Marp robi slajdy z Markdowna w kilka sekund, Quarto liczy wykres przy renderowaniu i wypuszcza z jednego pliku i slajdy, i dokument.

HTML

Prezentacja bez zależności

Jeden plik, który otwiera się w każdej przeglądarce. Font i znak są w nim w środku, więc działa bez sieci i bez niczego zainstalowanego. Strzałki przewijają slajdy, Ctrl+P drukuje do PDF-u.

Znak

Dwie wersje, pięć wykończeń

Wersja pełna wszędzie tam, gdzie znak pojawia się pierwszy raz. Sam sygnet tylko wtedy, gdy PRIME Q już padło obok: awatar, ikona, stopka slajdu.

Wersja pełna
Wersja pełna Na jasnym tle
Wersja pełna, biała
Wersja pełna, biała Na granacie i na zdjęciu
Sygnet
Sygnet Awatar, ikona, znak wodny
Sygnet, biały
Sygnet, biały Na ciemnym tle

Pliki do pobrania

SVG do wszystkiego, co da się zrobić wektorowo. PNG z przezroczystym tłem tylko tam, gdzie wektor nie wchodzi. Tło jest przezroczyste w każdym z tych plików, także w SVG: pod znakiem nie ma żadnego prostokąta.

Tak

  • Zostaw wokół znaku światło co najmniej na szerokość Q.
  • Na zdjęciu używaj wersji białej i tylko na spokojnym fragmencie kadru.
  • Poniżej 48 px wysokości używaj sygnetu bez ukośnika: czerwień w tej skali zamienia się w brud.

Nie

  • Nie rozciągaj, nie pochylaj i nie obracaj znaku.
  • Nie przebarwiaj go ani nie dokładaj cienia, poświaty czy obrysu.
  • Nie dopisuj hasła ani opisu bezpośrednio pod znakiem.
  • Nie używaj plików ze starego zestawu, w których Q odkleiło się od ukośnika.
Kolor

Pięć barw i jedna zasada

Czerwień jest akcentem, nie kolorem. Pojawia się raz na slajdzie albo raz na stronie: w ukośniku znaku, na początku linii, w punktorze albo na jednym słupku. Nigdy jako tło i nigdy jako kolor całego akapitu.

Prime Navy

HEX
#041E42
RGB
4, 30, 66
CMYK
C94 M55 Y0 K74

Logotyp, nagłówki, pierwsza seria na wykresie. Jedyna ciemna barwa marki.

Accent Red

HEX
#E11D2E
RGB
225, 29, 46
CMYK
C0 M87 Y80 K12

Ukośnik w znaku, początek linii, jeden punktor, jeden słupek. Nigdy tło.

Slate

HEX
#6B7280
RGB
107, 114, 128
CMYK
C16 M11 Y0 K50

Podtytuły, etykiety, podpisy, przypisy.

Line Gray

HEX
#E5E7EB
RGB
229, 231, 235
CMYK
C3 M2 Y0 K8

Włosowe linie, obramowania tabel, watermark Q.

White

HEX
#FFFFFF
RGB
255, 255, 255
CMYK
C0 M0 Y0 K0

Tło. Slajd i dokument są białe, chyba że sekcja jest świadomie odwrócona.

Wartości CMYK to zwykłe przeliczenie z RGB. Traktuj je jako punkt wyjścia do proofa u drukarni, nie jako separację z profilem.

Tokeny do wklejenia: colors.json prime-q-tokens.css prime-q-tokens.scss

Typografia

Inter, i nic poza nim

Hierarchia bierze się z grubości i wielkości, nie z drugiego kroju. Nagłówki 700 i 800, tekst 400 i 500, światło międzyliterowe w nagłówkach ściągnięte o 0,016 em.

Inter jest na licencji OFL, więc wolno go osadzić w pliku i wystawić na stronie. Dlatego prezentacja i dokument niosą go w środku, a strona serwuje go z własnego serwera. Zamiennikiem, gdyby nie było go nigdzie, jest Arial.

Systematyczne inwestowanie

Inter 800 · Tytuł prezentacji

Systematyczne inwestowanie

Inter 700 · Nagłówek

Systematyczne inwestowanie

Inter 500 · Wyróżnienie w tekście

Systematyczne inwestowanie

Inter 400 · Tekst podstawowy
Elementy

Trzy drobiazgi, które niosą resztę

Ukośnik

Punktor na liście. Ten sam kształt, który przecina Q.

SVG

Linia akcentu

Otwiera sekcję i slajd: włos szarości z krótkim czerwonym początkiem.

SVG

Znak wodny Q

Kontur sygnetu, wypuszczony poza krawędź. Nigdy w pełnym kolorze.

SVG

O starym zestawie

Zestaw rozsyłany wcześniej rysował napis fontem Aptos Display i miał wyeksportowane PNG-i z maszyny bez tego fontu, przez co Q odkleiło się od czerwonego ukośnika. Pliki z tej strony zostały odtworzone z zatwierdzonego slajdu tytułowego i zastępują tamte w całości.