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 do Get in touch

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.

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

Interactive example01 / Wireframe

Heading + progress

Before we ship

— / —

List item / 01

List item / 02

List item / 03

Feedback after an action

Content first. Styling comes later.

Start with the task: see what’s left and mark it done. That gives the screen its structure.

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.

Choose a principle

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.