Elementtikirjaston konsepti ja prototyyppi

Abstract

Opinnäytetyössä tutkittiin miten verkkosivujen tuotantoprosessi voidaan muuttaa modulaariseksi. Konseptissa määritellään elementtikirjaston ominaisuudet ja tarkoitus. Elementtikirjasto on verkkosuunnittelijoille ja front-end -toteuttajille tarkoitettu työkalu verkkosivuteemojen rakentamiseen. Se on päivitettävä kirjasto, joka sisältää testattuja, laadukkaita ja uudelleenkäytettäviä käyttöliittymäelementtejä.

Työn ja toimeksiantajan tavoitteena on tuottaa responsiivisia verkkosivuteemoja kustannustehokkaasti ja nopeasti. Kehitysideoiden pohjalta yritys voi kehittää elementtikirjastoa eteenpäin. Prototyyppi on yrityksen sisäisille sivuille toteutettu elementtikirjaston responsiivinen etusivu. Se on toimiva kokonaisuus, jossa voi lisätä, ladata ja poistaa elementtejä käyttämällä erillistä FTP-ohjelmaa.

Elementtikirjaston avulla verkkosivujen tuotantoprosessista voidaan tehdä modulaarinen. Sinne ladattavien elementtien laatu määrittelee tuotettujen verkkosivuteemojen laadun. Elementtien toteuttamisen avuksi ehdotetaan atomisen suunnittelujärjestelmän ja 8-point gridin käyttöä.

The purpose of this thesis was to study how the process of creating websites can be made modular. The concept defines the purpose and features of the element library. The element library is a tool for building website themes and it is used by web designers and front-end coders. The library can be updated and contains reusable, tested and high-quality interface elements.

The goal of the commissioner and this work is to produce responsive website themes fast and cost-effectively. Based on the development ideas the commissioner can improve the element library. The prototype is a responsive front page of the element library that is build on the commissioners private site. The element library is a working whole where you can add, download and remove elements using an FTP-program.

It is possible to make the process of creating websites modular by using the element library. The quality of the final product is defined by the quality of the elements added into the element library. To ease the process of creating elements it is suggested to use design systems like atomic design and 8-point grid.