Harjoitus: prototyyppi

Tässä harjoituksessa tehdään suunnitelma omaa tietokantaa hyödyntävän web-palvelun ulkoasusta (harjoitus 2). Lisää GitHub-repoon uusi kansio (t4_ulkoasu) ja tallenna tässä harjoituksessa tehdyt tiedostot kansioon.

1. Rautalankamalli

• Tehtävänäsi on laatia rautalankamalli Adobe XD:n avulla web-sovelluksesta joka käyttää harjoituksessa kolme suunnittelemaasi tietokantaa.
• Tee desktop- ja mobiilinäkymä sovelluksesta..
• Tallenna XD-tiedosto mukaan GitHub-repoosi.

2. HTML/CSS-proto

• Tehdään prototyyppi sivustosta joka ei sisällä toiminnallisuuksia. Prototyypissä tulisi olla etusivu sekä jokin lomaketta hyödyntävä sivu, esimerkiksi kirjautuminen.
• Tee ensin html-sivu ja mieti etusivun rakenne rautalankamalliasi noudattaen.
• Lisää css-tiedosto ja määrittele siellä värit, fontit yms. suunnitelmasi mukaisesti.
• Huomioi responsiivisuus lisäämällä media query css-tiedostoon.
• Esimerkki elokuva-sivusta.