zeRET / frontend developer

Hi,I’m Kirill.

I build websites and web apps with React and Next.js. I enjoy figuring out how things work, making interfaces easy to use, and tinkering with animation.

What I doEmail is unavailable

03 / CSS

.interface {
  display: grid;
  gap: 1rem;
  perspective: 1200px;
}

⌘ zeret.pw / playground

A small working world↗

Ideas become interfaces._

React Next.js CSS● live

Move in to take over · click to explore

Open to project enquiries

Scroll to unfold ↓

01 — 03What I do

One interface. Many moving parts.

The scene above breaks down into the things I enjoy building: useful products, reusable components, and thoughtful interactions.

Everyday interfaces

Account pages, dashboards, and internal tools. I enjoy turning complex logic into an interface someone can figure out and get things done with.

React
Next.js
Accessibility

Reusable components

When the same button appears in ten places, I’d like to change it once. I build shared components to keep pages consistent and make updates easier.

TypeScript
Design systems
Storybook

Motion with purpose

I like bringing interfaces to life through transitions, movement, and 3D. The trick is knowing when to stop, before a simple scroll becomes a theme park ride.

GSAP
Three.js
Web platform

From small details to a complete experience.How I work

How I work

From the task to the interface.

First I work out what someone needs to do. Then I build the screen and try it out. There’s usually something to simplify along the way.

01 / Understand the task

What does someone need to do?

I start with questions: what is this screen for, where does the data come from, and what can someone do with it? The answers help me decide which components it needs.

The user’s task
Data and actions
Component structure

02 / Build and check

What if something goes wrong?

Data can take a while to arrive, and requests can fail. I check these cases separately. Nobody wants to fill out a form and lose everything because one request went wrong.

Slow loading
Empty data and errors
Different permissions

03 / Work on the details

Time for the finishing touches.

I adjust spacing, work on the visual hierarchy, and tune the animation. I check how the screen feels on a phone and whether it’s clear what happened after a button press.

Text and visual hierarchy
Phones and keyboards
Feedback on actions

Behind the interface

Code I can come back to.

Interfaces change: new fields, pages, and requirements will come along. I try to make the next update easy to work on, whether it’s mine or another developer’s.

cart.tsBefore

Cooking...

01function calc(a: number[]) {
02  const x = a.reduce((s, n) => s + n, 0)
03  return x
04}
05 
06const data = [120, 80, 40]
07const result = calc(data)

First, you have to guess what calc does.

A name should tell you what a function does or what a variable holds. I try to save the next reader a trip through several files to find out.