/oleksii-tsvietkov
/websites/vuca-li
case 2 of 5

Vuca.li

Turned a brand book into eight development-ready pages in nine days

sole designer · website, eight pages · live · 2026
00

The brand I was handed

Vuca.li builds software. It came with a finished identity: a logo drawn from a pair of code braces, a green that burns against near-black, and the typeface Hubot Sans. The direction for the site was a single line asking for futuristic sci-fi, more like a galaxy. With it came a sitemap of eight pages, a company profile and three sites the client liked.

What I was brought in for

To make that identity into a website, with every page on the sitemap ready for their developer. The brief arrived on a Monday, and the client closed the project on the Tuesday of the following week.

An identity is drawn for a logo and a business card. Here it had to carry eight pages, with forms, filters and motion.

The client's brand book, the lockup: the VUCALI logo, its mark drawn from a pair of code braces, in green and white on black. The palette: Vucali green #02DF82 and Space dark #030F0F, with Cool grey, Emerald, Alien purple and Tech yellow as accents. The typography: Hubot Sans, bold for headings and light for text, with a sample paragraph and a button. The logo and its mark on dark, light and green grounds.

The brand identity is the client's, by the client's designer.

Direction came one line at a time, in Figma comments. When a comment asked me to make the CEO message better, I asked what better meant.

The pages went to the developer on the ninth day. The preloader came after, when the client asked for one, and I animated it in Figma.

01

I sent two directions and three questions to choose by.

chosen green-tinted, rounded, the image a stage
not chosen neutral, sharp, the image framed

Both come from the same brand book. The three questions were green or neutral, rounded or sharp, and which sections to take from each. The client took the first, and I designed the other pages in it.

02

I built the motion into the components.

A Figma window in the Prototype tab: the file's pages and layers on the left; on the canvas, two components in their purple dashed frames — Services card, default and hovered, the hovered one lit by a green glow, and Steps animation, five rows with the open card walking diagonally down — with lavender connectors for their wiring: one from the card to its hovered state, and one from every closed step to the row where it is open.

The service card and the process block carry their own motion. Hovered, the card lights up, and a closed step opens on a click. Both use smart animate, 0.3 s ease-out, and both play in the opening film. I prototype components as a rule. That way I can check how each one behaves, the client can see it in a demo, and the developer gets the motion with the component.

03

A contact form that arrives as a brief.

Request a quote asks for what Vuca.li needs to price the job: the service, the project in the customer's own words, files and a phone number with its country code.

04

Eight pages, four templates.

There is one design for each kind of page: a service, an industry, an article and a case study, so the site grows by content, not by new design. The client asked for one template for every service, and the industries follow the same rule.

/see also
Konfidal · shipped · 2024⁠—⁠25designed an eight-service site around the problems it solves, and shipped the build myself Who’s Who · mockup · 2026designed both sides of a business directory — the public site and the owners’ dashboard VBS Invest · handed over · 2026took a dated investment site from thin content to twenty pages with reusable templates Tevris · live · 2026sorted an automotive consultancy’s projects by the three stages of its business
/say hello

open for contract and freelance work, remote. write and tell me what the problem is.

contact me