Sytuacja wyjściowa
Nowa inicjatywa naukowa potrzebowała od podstaw spójnego języka wizualnego i serwisu, który przełoży go na komunikację cyfrową.
Konsorcjum na rzecz Danych Społecznych gromadzi informacje związane m.in. z udziałem Polski w europejskiej infrastrukturze CESSDA ERIC oraz działalnością Repozytorium Danych Społecznych.
Witryna miała być skierowana przede wszystkim do przedstawicieli środowiska naukowego zainteresowanych archiwizacją i udostępnianiem danych społecznych. Jej charakter wymagał więc prostoty, czytelnej struktury oraz dużego nacisku na treści tekstowe.
Projekt rozpoczynał się jeszcze wcześniej, od stworzenia kompletnej identyfikacji wizualnej. Naszym zadaniem było zaprojektowanie marki i jej cyfrowej reprezentacji jako jednego spójnego systemu.
Nowa identyfikacja
Projekt potrzebował własnego znaku, kolorystyki, typografii i zasad stosowania identyfikacji.
Komunikacja naukowa
Forma wizualna musiała wspierać dużą ilość treści i pozostać czytelna dla specjalistycznego odbiorcy.
Dwujęzyczny serwis
Projekt strony musiał uwzględniać komunikację w dwóch wersjach językowych.
Dostępność
Interfejs od początku miał być projektowany zgodnie z wymaganiami WCAG 2.1 dla podmiotów publicznych.
Wyzwanie
Największym wyzwaniem było stworzenie jednego systemu wizualnego, który sprawdzi się jednocześnie w materiałach instytucjonalnych, prezentacjach, social mediach i rozbudowanym serwisie informacyjnym.
Zbudować identyfikację od podstaw
Logo, kolory, typografia i zasady stosowania musiały stworzyć rozpoznawalny, ale profesjonalny charakter projektu naukowego.
Przenieść branding do interfejsu
Serwis nie mógł być niezależnym projektem graficznym. Musiał być naturalnym rozwinięciem stworzonej identyfikacji.
Pogodzić design z dostępnością
Kolory, kontrasty, typografia i układ interfejsu musiały od początku uwzględniać wymagania WCAG 2.1.
Przygotować projekt do późniejszego wdrożenia
Dokumentacja projektu musiała być wystarczająco precyzyjna, żeby na jej podstawie można było stworzyć spójny szablon WordPressa.
Rozwiązanie
Prace rozpoczęliśmy od identyfikacji wizualnej. Przygotowaliśmy trzy koncepcje logotypu oraz trzy koncepcje projektu serwisu, a następnie rozwinęliśmy wybrane kierunki w spójny system obejmujący warianty znaku, typografię, kolorystykę i zasady stosowania.
Identyfikację rozszerzyliśmy o materiały wykorzystywane w codziennej komunikacji Konsorcjum, w tym szablony prezentacji oraz grafiki do mediów społecznościowych.
Na tej podstawie przygotowaliśmy projekt graficzny dwujęzycznego serwisu informacyjnego. Zakres obejmował stronę główną, do 20 podstron i do 5 dodatkowych komponentów, przygotowanych zarówno dla desktopu, jak i urządzeń mobilnych.
Projekt został opracowany z myślą o późniejszym wdrożeniu na WordPressie. Oprócz ekranów przygotowaliśmy ikonografię, elementy graficzne oraz specyfikację kolorów, fontów i odstępów potrzebną do odwzorowania systemu w warstwie frontendowej.
Wymagania WCAG 2.1 były uwzględnione w projekcie od początku, a zastosowane fonty miały być darmowe i otwarte.
- Identyfikacja wizualna: 3 koncepcje logotypu i 3 koncepcje projektu serwisu
- Księga znaku, kolorystyka i typografia
- Szablony prezentacji w formatach POTX, OTP i dla Google Slides
- Grafiki profilowe i nagłówkowe dla Facebooka i X
- Projekt strony głównej, do 20 podstron i do 5 komponentów
- Kompletne widoki desktop i mobile
- Dedykowana ikonografia i elementy graficzne
- Specyfikacja wizualna przygotowana pod wdrożenie w WordPressie
- Klient
- Uniwersytet Warszawski / ICM
- Zakres
- Branding, identyfikacja wizualna, projekt graficzny serwisu, WCAG
- Rola Foreto
- Opracowanie kompletnej identyfikacji wizualnej i projektu graficznego serwisu internetowego
- Narzędzie projektowe
- Figma
- Docelowa platforma
- WordPress
- Standard dostępności
- WCAG 2.1
- Wersje serwisu
- Desktop / Mobile
- Języki
- PL / EN
- Termin umowny
- do 60 dni
System wizualny w praktyce
Identyfikacja została zaprojektowana z myślą o różnych punktach kontaktu z projektem. Ten sam język wizualny łączy znak, prezentacje, komunikację w social mediach oraz interfejs serwisu internetowego.
Rezultat
Powstał kompletny system wizualny Konsorcjum na rzecz Danych Społecznych, od identyfikacji marki po szczegółowy projekt jej cyfrowej reprezentacji. Wszystkie elementy zostały zaprojektowane jako jedna całość, dzięki czemu komunikacja może zachować spójny charakter niezależnie od kanału.
Spójna identyfikacja
Logo, typografia, kolorystyka i zasady stosowania tworzą jeden rozpoznawalny system marki.
Wiele kanałów komunikacji
Identyfikacja została przełożona na prezentacje, social media i komunikację cyfrową.
Kompletny projekt serwisu
Desktop i mobile obejmują stronę główną, rozbudowany zestaw podstron oraz dodatkowe komponenty interfejsu.
Gotowość do wdrożenia
Projekt został przygotowany pod WordPressa wraz z ikonografią i specyfikacją niezbędną do odwzorowania warstwy wizualnej.
Tworzysz nową markę i jej cyfrową obecność?
Możemy zacząć od identyfikacji i przełożyć ją na kompletny projekt serwisu, dzięki czemu marka i interfejs od początku tworzą jeden spójny system.
