Polskie Innowatorium to warszawski zespół, który filmuje, fotografuje i promuje działania innowatorów, polskich marek i instytucji publicznych. Zaprojektowałem jego stronę internetową: osobną podstronę dla każdej z tych trzech grup, z projektami na filmie, krótkimi rolkami, fotorelacjami i formularzem kontaktowym, w sześciu językach, od polskiego po arabski.
Strony dla odbiorców / Filmy z projektów / Sześć języków
Rys. 01Strona główna, a na telefonie podstrona dla instytucji.
Notatki
Zespół pracuje dla trzech bardzo różnych grup klientów, więc strona każdej z nich otwiera osobne drzwi. Strona główna zaczyna się od trzech dużych kart: Innowacje, Polskie Marki i Instytucje. Każda ma własne zdjęcie i własną obietnicę i każda prowadzi do podstrony z własnymi projektami. Sama praca zespołu to film, więc projekty odtwarzają się jako wideo, rolki stoją w ramkach telefonów, a za nimi idą fotorelacje. Interfejs pozostaje cichy i zostawia kolor nagraniom.
Rys. 02Po lewej: każdy projekt odtwarza się jako film, a każda karta ma datę. Po prawej: menu na telefonie, ze wszystkimi sześcioma językami pod ręką.
Decyzja projektowa
Dwa razy więcej na ekranie telefonu
Na trzech podstronach zespół pokazuje dwadzieścia cztery projekty, a w jednej kolumnie telefon zamieniłby je w długie przewijanie. Dlatego na wąskim ekranie karty projektów, usługi i opinie klientów stoją po dwie w rzędzie, a każdy ekran mieści dwa razy więcej.
Projekty dla instytucji, po dwa w rzędzie.
Usługi obok siebie, Strategia przy Zasięgu.
Opinie klientów, po cztery na ekranie.
Decyzja projektowa
Ta sama strona, czytana od prawej
Zespół relacjonuje targi i szczyty od Emiratów po Koreę i Wietnam, więc strona mówi w sześciu językach. Po arabsku cały układ się odwraca: logo i tekst przechodzą na prawą stronę, formularz zajmuje lewą, a liczby zmieniają się na cyfry pisma arabskiego, podczas gdy adresy e-mail nadal czyta się od lewej do prawej.
Angielski: tekst po lewej, formularz po prawej.
Arabski: ta sama sekcja w lustrzanym odbiciu.
Komponenty
Elementy do pokazywania filmu
Strona jest zbudowana z garści elementów. Ciemna karta projektu mieści tagi, czerwoną plakietkę z datą i film. Rolki stoją w ramkach telefonów, opinie są na białych kartach z szarym logo klienta, czerwone geometryczne ikony nazywają usługi, a menu języków wymienia wszystkie sześć razem z flagami.
Nawigacja, karta projektu, opinie, rolki, ikony usług, menu języków i formularz w obu kierunkach.
Rys. 03Krótkie rolki w ramkach telefonów, a na telefonie fotorelacje.