ADASIĘ

Strona stowarzyszenia działąjącego przeciw wykluczeniu.

Kontekst

Strona internetowa wykonana dla Stowarzyszenia dla Przeciwdziałania Wykluczeniom Adasię. Jest to organizacja non-profit mająca na celu wspieranie lokalnej społeczności oraz przeciwdziałanie rożnego rodzaju wykluczeniu, jaki może jej dotykać. Prowadzą punkt pomocy IT, propagują wolontariat oraz organizują warsztaty.

Specyfika projektu

Etap prototypowania poprzedził Design Sprint oraz stworzenie mapy strony. Strona wizualna jest zgodna z wizją zleceniodawcy. Projekt został w całości stworzony w programie Adobe XD. Przygotowany został responsywny widok mobilny. Strona ma charakter informacyjny z możliwością kontaktu z organizacją.

Bardzo ważnym elementem strony jest Dostępność. Z uwagi na charakter organizacji, która przeciwdziała wykluczeniu osób niepełnosprawnych, ale także z rynku pracy, społecznemu osób starszych oraz cyfrowemu. Strona musiała spełniać wymogi WCAG 2.0, być przejrzysta i czytelna w rożnych kontrastach. 

Modelowanie

Design Sprint

W celu lepszego zrozumienia potrzeb zarówno klienta jak i użytkowników postanowiłem przeprowadzić wstępny proces na wzór Design Sprintu. Uczestniczyli w nim założyciele organizacji oraz specjalistka od grafiki, która tworzyła logo.

Efekt był zadowalający, ponieważ udało się jasno sprecyzować cele projektu. Pomogło to także w skonkretyzowaniu celów całego stowarzyszenia. Na spotkaniu powstał także pierwszy szkic rozwiązań i bardzo podstawowy prototyp. Po zebraniu informacji  zabrałem się za etap projektowania.

Mapa strony

Przed samym rozpoczęciem budowania prototypu stworzyłem mapę strony w programie draw.io.

Projektowanie

Makieta

Prototyp zrobiłem przy użyciu programu Adobe XD. Stworzyłem widoki strony głównej, strony kontaktowej i podstron. Zaprojektowałem także system przeglądania projektów stowarzyszenia. 

Kontrast pomiędzy tekstem a tłem został wyliczony zgodnie z kalkulatorem współczynnika kontrastu zalecanego przez organizację WC3. Nawigacja po stronie jest uproszczona, aby każdy niezależnie od posiadanego sprzętu mógł dotrzeć do wymaganych informacji. Chciałem, aby strona była zrozumiała i funkcjonalna bez natłoku zbędnych informacji.

Dostępność

Głównymi wytycznymi, jakimi kierowałem się przy projektowaniu strony był WCAG 2.0.

Starałem się stworzyć stronę dostępną do jak najbardziej szerokiego grona odbiorców, bez względu na ich niepełnosprawność, wiek, status majątkowy, sprzęt czy oprogramowanie. 

W widocznym miejscu, w górnej części serwisu umieściłem komponenty do zmiany wielkości czcionki oraz  ikony do zmiany kontrastu strony. Biorąc pod uwagę osoby, które mogą mieć problemy z rozróżnianiem barw oraz osoby niedowidzące, stworzyłem widoki trzech alternatywnych widoków kolorystycznych.

Propozycja widoku strony głównej w opcji kontrastowej.

Responsywność

Strona uwzględnia pełną responsywność (RWD), przygotowane zostały widoki na tablety oraz inne urządzenia mobilne. Uwzględnione także zostały dwie wersje językowe, polska i angielska.