This study shows process of creating ink-ot.com website. It goes from design stage into fully functioning website.

A) Planning + Low fidelity designs

It is all about and idea into plan.

Starting with defining website's purpose, identifying its value deliverables and inserting them into sitemap (1) which are than translated into different low fidelity components of the page (2).

All this is done using Figma Software and its Sitemap & UI component plugins.

B) High fidelity designs

After a few brainstorm sessions, where we identify whats right and what could be done differently, final LF is agreed on and High Fidelity Design (HF) designing starts.

Process for HF design is same ad LF. Versions are created, brainstormed until final HF is agreed on.

Into the development stage it comes as a Figma File, where dynamic prototype, assets and code snippets are.

c) Dev & Testing

In this stage website is coded using html, css & javascript (in this case vanilla.js), pushed on github and tested using git version control.

After all the necessary iterations website is ready for deployment, published onto hosting provider's server.