fbpx

W tym wpisie pokażę Ci parę szybkich sztuczek, które pomogą Ci projektować lepsze przyciski pod względem użyteczności oraz wyglądu.

Padding

Tak naprawdę wielkość paddingu zależy od zastosowanego fontu w etykiecie. W ustalaniu wielkości przy krawędziach może pomóc Ci taka sztuczka. Utwórz dużą literę W stosując krój oraz wielkość fontu z etykiety na przycisku. Tym sposobem otrzymałeś obszar odstępu od góry i dołu krawędzi. Jeśli natomiast chodzi o boczne odstępy to zastosuj podwojenie litery WW. 

Dwa przyciski obok siebie

Jeśli musisz umieścisz dwa przyciski obok siebie to przede wszystkim pokaż, który z nich jest ważniejszy. Dobrą praktyką jest, by ten mniej ważny przycisk, był w formie ducha czyli posiadał tylko obrys zamiast wypełnienia.

Kolory

Niektóre kolory bardzo mocno kojarzą się z daną funkcją. Do tego stopnia, że ich zmiana może wprowadzić zamieszanie. Na przykład zielony przycisk „usuń” spowoduje małe zamieszanie, podobnie jak czerwony przycisk „zapisz”.

Przycisk anuluj

Zneutralizuj przycisk Anuluj. Najprościej zrobisz to stosując kontrast kolorów. Tworząc go w formie obramowania (ducha) nie stosuj kolorowego obrysu, wybierz szarości.

Sprecyzuj etykietę

Słowo na przycisku powinno opisywać działanie lub wynik wezwania do działania. Nazywanie przycisku „OK” lub „Anuluj” nie pomaga użytkownikowi w żaden sposób. Tym sposobem zmuszasz go do przeczytania całego okna dialogowego, by odnaleźć sens przycisku.

CTA i czerwony kolor

Dobrze by w Twoim projekcie czerwony kolor miał ostrzegawczą funkcje np. był zarezerwowany dla komunikatów ostrzegawczych oraz przycisków destrukcyjnych.

Dlatego też nie stosuj tego koloru w przyciskach CTA. Zarezerwuj czerwony kolor tylko dla działań destrukcyjnych. Na pewno w swojej palecie barw znajdziesz kolory, które o wiele lepiej nadają się do przycisków CTA niż czerwony i są pd niego mniej niepokojące.