Akademia Górniczo-Hutnicza logotyp
pl en
en
User Interface in Web Design
Course description sheet

Basic information

Field of study
Social Informatics
Major
-
Organisational unit
Faculty of Humanities
Study level
First-cycle studies
Form of study
Full-time studies
Profile
Practical
Didactic cycle
2025/2026
Course code
HIFSS.I4.17990.25
Lecture languages
Polish
Mandatoriness
Obligatory
Block
Core Modules
Course related to scientific research
No
Course coordinator
Justyna Kraszewska-Kozik
Lecturer
Justyna Kraszewska-Kozik
Period
Semester 3
Method of verification of the learning outcomes
Completing the classes
Activities and hours
Lectures: 14
Project classes: 14
Number of ECTS credits
3

Goals

C1 Zapoznanie studentów, jak w praktyce projektować interfejsy graficzne stron i aplikacji internetowych oraz związanego z nimi user experience.
C2 Zrozumienie procesu projektowego i zapoznanie się z kluczowymi narzędziami oraz metodami warsztatowymi.
C3 Zdobycie podstawowej wiedzy na temat relacji pomiędzy projektowaniem a biznesem

Course's learning outcomes

Code Outcomes in terms of Learning outcomes prescribed to a field of study Methods of verification
Knowledge – Student knows and understands:
W1 Student zna etapy procesu projektowania, techniki i narzędzia wykorzystywane na różnych etapach projektowania interfejsów. Student zna również aktualne style i wzorce projektowe, szablony interfejsu aplikacji mobilnej i jego składowych. IFS1P_W02, IFS1P_W03 Activity during classes, Execution of exercises, Execution of a project
W2 Student zna podstawowe heurystyki dotyczące użyteczności i ergonomii. IFS1P_W04 Participation in a discussion, Presentation
Skills – Student can:
U1 Student posiada umiejętność definiowania wymagań i założeń projektowych, doboru właściwych kolorów, kształtów i symboli w celu zaprojektowania zrozumiałego interfejsu użytkownika oraz umiejętność wizualizacji danych w sposób umożliwiający łatwą i trafną interpretację danych i wyciągnięcie wniosków IFS1P_U01, IFS1P_U02, IFS1P_U03, IFS1P_U04, IFS1P_U05, IFS1P_U06 Participation in a discussion
Social competences – Student is ready to:
K1 Student rozumie zachowania człowieka, umiejetnie identyfikuje jego potrzeby, umie komunikować i prezentować własne pomysły i projektowane rozwiązania, umie współpracować w grupie. IFS1P_K01, IFS1P_K02, IFS1P_K03 Participation in a discussion

Program content ensuring the achievement of the learning outcomes prescribed to the module

Kurs ma na celu zapoznanie studentów z etapami procesu projektowania, technikami i narzędziami wykorzystywanymi na różnych etapach projektowania interfejsów.

Student workload

Activity form Average amount of hours* needed to complete each activity form
Lectures 14
Project classes 14
Preparation for classes 10
Realization of independently performed tasks 15
Contact hours 5
Preparation of project, presentation, essay, report 30
Examination or final test/colloquium 2
Student workload
Hours
90
Workload involving teacher
Hours
28

* hour means 45 minutes

Program content

No. Program content Course's learning outcomes Activities
1.

  1. Podstawy projektowania interakcji i środowisko pracy: Zapoznanie z podstawowymi pojęciami, specyfiką branży oraz warsztatem osoby projektującej interfejsy cyfrowe w oparciu o współczesne standardy rynkowe.

  2. Proces projektowy i metody badawcze: Omówienie etapów realizacji projektów cyfrowych, strategii metodycznych oraz podstawowych badań użytkowników pozwalających zrozumieć modele mentalne i potrzeby odbiorców.

  3. Typografia, kolor i kompozycja w interfejsach: Praktyczne zastosowanie zasad kompozycji, doboru palet barwnych oraz świadomego wykorzystania typografii w celu budowania czytelnej i estetycznej hierarchii wizualnej.

  4. Architektura informacji i nawigacja: Projektowanie struktury systemu, logiki poruszania się po produkcie oraz układu treści wspierającego intuicyjne doświadczenia użytkownika (UX).

  5. Układy, formularze i duże zbiory danych: Zasady projektowania interfejsów dla złożonych systemów, w tym optymalizacja formularzy internetowych, organizacja obszernych zbiorów danych w formie list i tabel oraz projektowanie dashboardów i wizualizacji danych.

  6. Responsywność i aplikacje mobilne: Tworzenie stron internetowych w standardzie RWD (Responsive Web Design) oraz wprowadzenie do projektowania dedykowanych aplikacji mobilnych (z uwzględnieniem wytycznych systemów iOS i Material Design).

  7. Systemy projektowania i dostępność: Praca z Design Systemami oraz wdrażanie standardów dostępności cyfrowej (web accessibility), tak aby tworzone interfejsy były przyjazne dla każdego użytkownika.

  8. Prototypowanie i walidacja: Budowanie modeli interaktywnych oraz testowanie przygotowanych koncepcji interfejsów.

  9. Aspekty biznesowe i praca freelancera: Uwzględnienie działań marketingowych i komercyjnych w procesie projektowym, specyfika wyceny usług, relacje z klientem oraz kryteria rynkowe wpływające na pozytywną ocenę pracy projektanta w formule freelancingu.
    Perspektywy rozwoju: Przegląd nowoczesnych technologii i kierunków rozwoju interfejsów przyszłości.

 W1, W2, U1, K1 Lectures, Project classes

Extended information/Additional elements

Teaching methods and techniques :

Lectures, Case study, Group work, Design thinking, Workshop, Storytelling, Lecture

Activities Methods of verification Credit conditions
Lectures Participation in a discussion, Presentation
Project classes Activity during classes, Execution of exercises, Execution of a project

Additional info

Wykorzystanie narzędzi sztucznej inteligencji (AI) w procesie projektowym jest dozwolone wyłącznie pod warunkiem ich świadomego, krytycznego i każdorazowego udokumentowania w dokumentacji projektowej. AI traktowane jest jako instrument wspomagający ideację, burzę mózgów oraz eksplorację wariantów, a bezrefleksyjne poleganie na gotowych wygenerowanych wynikach. 

Conditions and the manner of completing each form of classes, including the rules of making retakes, as well as the conditions for admission to the exam

 Sposób zaliczenia poprawkowego jest analogiczny jak w pierwszym terminie i obejmuje obronę projektu oraz prezentację wymaganego prototypu.

Method of determining the final grade

Na ocenę składać się będzie:

  1. ocena z obecności studenta na zajęciach (10%)
  2. ocena z aktywności studenta w trakcie ćwiczeń (20%)
  3. ocena projektów przygotowywanych w grupach (70%)

Manner and mode of making up for the backlog caused by a student justified absence from classes

W ramach ćwiczeń dopuszczalna jest jedna nieusprawiedliwiona nieobecność. Wszystkie kolejne braki w obecności wymagają nadrobienia materiału w porozumieniu z prowadzącym oraz własnym zespołem projektowym, z którym student realizuje powierzone zadania.

Prerequisites and additional requirements

Przedmiot stanowi kontynuację i pogłębienie zagadnień realizowanych w ramach wstępu do projektowania interfejsów, metod badań jakościowych oraz metod badań ilościowych, integrując wcześniej nabyte przez studentów kompetencje badawcze z praktycznym podjeściem projektowym.

Rules of participation in given classes, indicating whether student presence at the lecture is obligatory

Udział w wykładach jest nieobowiązkowy, jednak wiedza pozyskana w ich trakcie jest kluczowa dla prawidłowego przygotowania projektu końcowego oraz zrozumienia teoretycznych podstaw projektowania interfejsów. Z kolei obecność na ćwiczeniach jest obowiązkowa (dozwolona są 2 nieobecności), ponieważ mają one charakter warsztatowy i polegają na zaprojektowaniu wybranego produktu interaktywnego od grupie od 2 do 4 osób. Zadania te są rozłożone na cały semestr, a ich efekty są systematycznie opracowywane, konsultowane i prezentowane na koniec semestru. Zadanie odnosi sie do zaprojektowania 2-3 ekranów strony internetowej w wersji desktop i mobile. . W ramach przedmiotu oceniane są przede wszystkim aspekty projektu związane z prawidłowym wykorzystywaniem programu Figma oraz finalny interaktywny prototyp interfejsu.

Literature

Obligatory
  1. The Elements of User Experience: User-Centered Design for the Web, Jesse James Garret, ISBN: 0735712026
  2. Don Norman, Dizajn na codzień. Wydawnictwo Karakter 2018.
  3. Iga Mościchowska, Barbara Rogoś Turek, Badania jako podstawa projektowania User Experience. Warszawa, PWN, 2015.
Optional
  1. Don’t Make Me Think, Steve Krug, ISBN: 0321344758
  2. Donald Norman, Wzornictwo i emocje. Dlaczego kochamy lub nienawidzimy rzeczy powszednie?. Wydawnictwo Arkady, 2015.
  3. Kim Goodwin, Alan Cooper, Designing for the Digital Age: How to Create Human-Centered Products and Services, 2009.