2. tēma: Stils, multimediji un datņu pārvaldība

Tavs mērķis: Apkopot un pabeigt spēles pieteikuma vizuālo noformējumu, integrējot un sakārtojot multimediju resursus atbilstoši ergonomikas un datņu pārvaldības standartiem.

1.4.1., 1.1.1., 2.3.3., 2.4.11., 5.2.6.

Darba uzdevuma gaita

1. solis: Datņu sistēmas un pamata sakaru pārbaude

  1. Pārliecinies, ka tava projekta mape ir loģiski strukturēta (atsevišķas mapes css, assets/images un assets/audio).
  2. Pārbaudi, vai index.html failā ir pareizi norādīti relatīvie ceļi uz CSS failu un visiem attēliem/skaņām.
  3. Palaid "Live Server" un pārliecinies, ka neviens attēls nav "salūzis" (nav rādīts kā tukšs rāmītis).

2. solis: Vizuālās izkārtojuma kontroles (Box Model) pielietošana

  1. Izmanto ārējās (margin) un iekšējās (padding) atkāpes CSS failā, lai saturs nebūtu pielipis pie ekrāna malām.
  2. Izveido un iekrāso centrēto spēles laukuma konteineru (rāmīti), izmantojot klases (piem., .game-container).
  3. Pielāgo pievienoto attēlu izmērus (izmantojot width vai max-width), lai tie harmoniski iekļautos tekstā un nedeformētu lapu.

3. solis: Ergonomikas pilnveide un versiju fiksēšana

  1. Kritiski izvērtē un uzlabo krāsu kontrastu starp tekstu un fonu (vai teksts ir viegli salasāms visās ierīcēs?).
  2. Pārliecinies, ka fontu izvēle (font-family) atbilst tavas spēles tematikai (piem., "retro" spēlei var izmantot pikseļu fontu, modernai - "sans-serif").
  3. Izveido detalizētu GitHub commit (piem., "Pabeigts 2. tēmas vizuālais prototips, pievienoti resursi un sakārtotas mapes") un veic push operāciju.

Vērtēšanas kritēriji (SLA)

Kritēriji Sācis apgūt (1-3) Turpina apgūt (4-6) Apguvis (7-8) Apguvis padziļināti (9-10)
Datņu pārvaldība un multimediji (2.3.3., 2.4.6.) Faili atrodas vienā mapē, daži attēli vai skaņas nedarbojas nepareizu saīšņu dēļ. Ir izveidotas mapes, bet struktūra ir nepilnīga. Attēli un audio ir ievietoti, bet nav optimizēti (ir pārāk lieli). Visi faili ir precīzi sakārtoti mapēs (css, assets). Saites strādā nevainojami, failu izmēri ir piemēroti web videi. Loģiska un nemainīga failu struktūra. Izmantoti atbilstošākie formāti (piem., PNG ar caurspīdīgumu spēles elementiem). Pievienoti "alt" teksti visiem attēliem.
Vizuālā ergonomika un CSS (1.1.1., 1.4.1.) CSS fails ir pieslēgts, bet stili pielietoti haotiski, teksts grūti salasāms. Ir pamata izkārtojums, izmantoti foni un krāsas, bet "Box Model" principi (padding/margin) pielietoti kļūdaini. Lapai ir saskanīgs, estētisks dizains. "Box Model" izmantots pareizi – saturs ir centrēts, elpojošs un vizuāli atdalīts. Dizains mērķtiecīgi atbalsta spēles tēmu. Izcils krāsu kontrasts, pārdomāta fontu hierarhija. Kods CSS failā ir labi strukturēts un izmanto klases.

Pašpārbaudes saraksts

⬅ Iepriekšējā stunda Tēmas apkopojums ➡