Open in app

Sign In

Write

Sign In

Pavel Laptev
Pavel Laptev

1.5K Followers

Home

About

Apr 8, 2021

Squircles on the Web — Houdini to the rescue 🚑 🚀

Hallo zusammen! Today I want to tell about my experience with CSS Houdini, what is it and how it works. In particular, I’ll show and tell you about Paint API, this is the part of Houdini CSS. About a year ago I heard about CSS Houdini and that it’s a…

Squircle

9 min read

Squircles on the Web — Houdini to the rescue 🚑 🚀
Squircles on the Web — Houdini to the rescue 🚑 🚀
Squircle

9 min read


Feb 7, 2021

How to create a Pan`n`Pinch component for a Figma plugin. Step-by-step Recipe.

Hallo, Leute! Today I want to shortly describe a component that I wrote for one of my plugins — WarpIt. And I want to share my experience with you. Figma - Warp It | A simple plugin that allows you to warp 🌀, bend, and distort vector shapes… Figma Community plugin - A simple plugin that allows you to warp 🌀, bend, and distort vector shapes. Features Grid…www.figma.com There were some pitfalls during the coding process but not too much. …

Figma

6 min read

How to create a Pan`n`Pinch component for a Figma plugin. Step-by-step Recipe.
How to create a Pan`n`Pinch component for a Figma plugin. Step-by-step Recipe.
Figma

6 min read


Published in

Prototypr

·Oct 17, 2020

Kinetic Typography with ThreeJS

Hallo Leute! Today we will do some interesting stuff with ThreeJS and typography — we will make Kinetic Typography. There are plenty of cool shots over the internet tagged as #kinetictypography. Here are some of them ↘

Threejs

6 min read

#kinetictypography with ThreeJS
#kinetictypography with ThreeJS
Threejs

6 min read


Sep 11, 2020

Make text pattern background with <canvas>

I’m writing a new article and actually this is a part of it. I’ll describe a method that I used to generate textures in Three.js. But I decided to describe some methods as separate articles to be more flexible and don’t worry about the amount of text and structuring. What we will do We…

Canvas

3 min read

Make text pattern background with canvas
Make text pattern background with canvas
Canvas

3 min read


Published in

Prototypr

·Aug 10, 2020

iPad pointer on the web

A short diary of iPad pointer recreation with GSAP — a week ago I saw a new IPad Pointer presentation and was very excited about what they did. It was very interesting to see how they design different pointer modes and attention to details. Here is the presentation: Design for the iPadOS pointer - WWDC 2020 - Videos - Apple Developer Bring the power of the pointer to your iPad app: We'll show you how Apple's design team approached designing the iPadOS…developer.apple.com

Gsap

12 min read

iPad pointer on the web
iPad pointer on the web
Gsap

12 min read


Published in

Alteos Tech Blog

·Jun 11, 2020

The Design System That Alteos Built

Hello there! Today I want to share the experience of using a system approach in Alteos design — we will talk about design systems, how they help, how we build and maintain ours, plus a little about code. My name is Pavel Laptev, I’m a lead designer at Alteos. As…

Design Systems

7 min read

The Design System That Alteos Built
The Design System That Alteos Built
Design Systems

7 min read


Published in

Weekly Webtips

·Apr 25, 2020

JSON to Figma plugin. from Vanilla JS to React

Not so while ago, I wrote a plugin that can parse a JSON file and populate Figma layers. JSON to Figma. How to create a vanilla Figma Plugin Sup, dudes! This is your boy Mr.Smarty Pants! Today I want to break down the process of writing a Figma Plugin. In our…medium.com I wrote the first 1.0 version of the plugin as MVP. That’s why the plugin was written in vanilla JS and plain HTML and it was pretty hard to refactor it. When…

Json

8 min read

JSON to Figma plugin. from Vanilla JS to React
JSON to Figma plugin. from Vanilla JS to React
Json

8 min read


Feb 18, 2020

JSON to Figma Plugin. How to create a vanilla Figma Plugin

Sup, dudes! This is your boy Mr.Smarty Pants! Today I want to break down the process of writing a Figma Plugin. In our case, it will be a plugin that can parse a JSON file and populate text layers by its values. For the introduction — here is a plugin’s…

Figma

10 min read

JSON to Figma. How to create a vanilla Figma Plugin
JSON to Figma. How to create a vanilla Figma Plugin
Figma

10 min read


Published in

ITNEXT

·Nov 17, 2019

Changing children's state from another component with React Hooks

Lately, I pretty often use React for rapid prototyping and developers' handoff, but I faced the problem when you need to change the state of the one component from another —in my case, it was a “Toast” component. Today let’s consider a few examples on this task. Task ⤵ We…

React

4 min read

Changing children state from another component with React Hooks
Changing children state from another component with React Hooks
React

4 min read


Published in

Prototypr

·Oct 23, 2019

Theming With CSS Variables

Hello, today I want to share my experience on how to theme a website with CSS variables. There was a use case — to build a scalable design system with an easy customize method for the Whitelabel option when a client wants to have their own colors and typography, styles. …

CSS

11 min read

Theming with CSS variables
Theming with CSS variables
CSS

11 min read

Pavel Laptev

Pavel Laptev

1.5K Followers

Nerd and visual maniac

Following
  • Nick Babich

    Nick Babich

  • Marc Andrew

    Marc Andrew

  • Fresh Frontend Links

    Fresh Frontend Links

  • Muzli

    Muzli

  • Tan Yun (Tracy)

    Tan Yun (Tracy)

See all (300)

Help

Status

Writers

Blog

Careers

Privacy

Terms

About

Text to speech

Teams