Graficzny system ocen

Pokazujemy, jak wykonać graficzny system ocen, przydatny np. do serwisu, sklepu internetowego.

Od dłuższego czasu na stronach internetowych towarzyszy nam system ocen. Najczęściej obok średniej danego przedmiotu lub usługi wyświetla się także system graficzny – popularne gwiazdki.

Jeżeli tworzymy nowy sklep internetowy od zera takie gwiazdki będą bardzo przydatne. Możemy skorzystać z udostępnionych w internecie wzorów, albo stworzyć własny projekt z indywidualnymi preferencjami.

  1. Utwórz nowy dokument. Rozmiar nie ma znaczenia, ponieważ pliki i tak będą w całości wektorowe.
  2. Narzędziem Wielokąt utwórz i zduplikuj pięcioramienną gwiazdę. Jedna kopia będzie służyć za klasyczną żółtą ikonę, a druga zostanie przekształcona w puste, szare miejsce.

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

  1. Podstawowe modyfikacje to oczywiście żółty kolor i style warstwy nadające efekt wypukłości. Do osiągnięcia poniższego efektu wystarczy spróbować różnych ustawień filtrów Blask wewnętrzny i Faza i płaskorzeźba.

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

  1. Dodaj obrys do gwiazdki za pomocą stylu o tej właśnie nazwie. Kolor obrysu powinien być ciemniejszy od wypełnienia, ale nie całkowicie czarny.

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

  1. Ostatni etap pracy nad żółtą gwiazdką to dodanie lekkiego efektu cienia i ewentualna poprawa poprzednich ustawień.

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

  1. Przy tworzeniu drugiego obiektu musimy skorzystać z szarego koloru i efektu o nazwie Cień wewnętrzny. Da on iluzję wklęsłości warstwy.

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

  1. Pozostałe dwa konieczne do zastosowania style są takie same jak w przypadku poprzedniej gwiazdki. Mowa tu o ciemnoszarym obrysie:

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

I standardowym efekcie cienia:

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

 

Wykonane gwiazdki możemy zapisać w dowolnym rozmiarze, w formacie PNG i umieścić w odpowiednim miejscu na stronie www.

Zaprojektuj własny graficzny system ocen. Poradnik Photoshop.

Podziel się wiedzą z innymi

Komentarz do postu