Figma — wstęp do radości z projektowania

Narzędzia
GoFullPage | Fonts Ninja | Typescale
ColorZilla | Encykoloropedia
Figma: podstawy 01 | 02 | 03 |  Praca z tekstem

1. Warsztat wstępny
2. Fundament pracy projektanta i zabawa (Figma vs FigJam | Interfejs Figmy | Figma Start | Myślenie obiektowe) 
3. Język wizualny (Typografia i hierarchia | Kolor i kompozycja)
4. Struktura i systemy (Auto Layout | Komponenty i biblioteki)
5. Interakcja i prezentacja (mikro-interakcje | export)
6. Prezentacja projektu

1. Yablonski, J. (2021). Prawa UX. Jak psychologia pomaga w projektowaniu dobrych produktów i usług. Gliwice: Helion. [spis treści | CINIBA]
2. Strona internetowa: lawsofux.com [interaktywne uzupełnienie książki Yablonskiego]

3. Krug, S. (2014). Nie każ mi myśleć! O życiowym podejściu do funkcjonalności stron internetowych. Gliwice: Helion. [spis treści | CINIBA]
4. Norman, D. (2018). Dizajn na co dzień. Kraków: Karakter.
Biblia dla kognitywistów. Tłumaczy, czym są afordancje (dlaczego przycisk wygląda jak coś do wciskania).
5. Yifrah, K. (2020). Mikrocopy. O słowach w projektowaniu. Gliwice: Helion.
Kluczowa pozycja dla grupy z Dziennikarstwa. Uczy, jak napisać krótki tekst na przycisk (CTA) lub nagłówek w „Bio Site”, żeby był skuteczny.
6. Wszołek, M. (2024). Manual. Projektowanie komunikacji wizualnej. Warszawa: Wydawnictwo Naukowe PWN. [Solidna baza teoretyczna o kompozycji i systemach.]
7. Kleon, A. (2013). Twórcza kradzież. 10 przykazań dla każdego, kto chce być kreatywny. Gliwice: Helion.
Bardzo krótka książka, która zdejmuje presję „nie mam talentu”.
8. Barczak, O. (2021). #Kolor. Pop-up Studio.

Ponieważ Figma zmienia się co miesiąc, książki techniczne o niej są nieaktualne w momencie druku.

1. Figma YouTube Channel (Oficjalny)
Szczególnie playlista: „Figma for Beginners” oraz „Office Hours”.
2. Nielsen Norman Group (nngroup.com)
Baza wiedzy z zakresu badań UX (dla studentów, którzy chcą pisać prace dyplomowe o projektowaniu).
3. Material Design 3 (m3.material.io)
Dokumentacja Google. Świetnie pokazuje, jak działają gridy, typografia i kolory w systemach cyfrowych.

Warunki zaliczenia przedmiotu

1. Źródło: Jon Yablonski, „Prawa UX. Jak psychologia pomaga w projektowaniu dobrych produktów i usług”.
2. Zadanie: Wybierz jeden rozdział (jedno prawo, np. Prawo Hicka, Efekt von Restorffa). Stwórz w Figmie jeden plakat cyfrowy / slajd (1920×1080 px), który wizualnie tłumaczy to zjawisko.
3. Cel: Pokazanie, że rozumiesz mechanizm psychologiczny i potrafisz go przełożyć na prostą formę graficzną (wykorzystanie tekstu, kształtów, kolorów).
4. Wrzuć do katalogu na Teams plik jpg podpisany nazwisko_nazwa_prawa
5. Zaprezentuj swoją pracę przed grupą

1. Opis: Zaprojektuj i wykonaj prototyp swojej osobistej strony typu „Linktree” / „Bio”. Jest to strona, która zbiera wszystkie Twoje linki, portfolio, social media i krótkie bio w jednym miejscu.
2. Wymagania techniczne (checklista):
   1. Dwa widoki: Mobile (np. iPhone 14) oraz Desktop (Laptop).
   2. Struktura: Zastosowanie Auto Layout do listy linków/przycisków (musi się skalować).
   3. System: Użycie minimum jednego Komponentu (np. przycisk linku).
   4. Style: Zdefiniowane style tekstu i kolorów.
   5. Prototyp: Projekt musi być „klikalny” (podświetlanie przycisków po najechaniu myszką + działające linki).
3. Forma oddania: karta oceny z linkiem do pliku w Figmie, prezentacja przed grupą