Article thumbnail

Full site designed in Figma and coded within Tilda CMS using custom solutions

The project

In the Autumn of 2024 I completed the task of a full cycle (excluding (excluding content management tasks) of website creation from design to programming for my Russian partner.

Design was completed in Figma.

The site itself was set up in the Tilda constructor, but using custom components, for which the webpack assembly (with typescript and scss) was used.

Screenshots

Design

Design layout in figma.
Design layout in figma.
Editing the site header in the Tilda CMS.
Editing the site header in the Tilda CMS.

Original site

The following screenshots are presented as they looked immediately after the completion of the design phase.

Main page (as a landing).
Main page (as a landing).
Contacts page.
Contacts page.
Internal page.
Internal page.
Popup feedback form.
Popup feedback form.

The webpack project

To customize the standard Tilda building blocks, typescript code is used, organized into a project that is compiled using webpack.

See the project on Github.