Jakub Antalik's banner
Jakub Antalik's profile picture

Jakub Antalik

@Jakubantalik • 22,242 subscribers

Product designer/engineer, prev at @frame_io (acq. by Adobe), @intercom https://t.co/PzfZ0CE0C0 https://t.co/uELldPfsu3

Shorts

Metal effect is now available for SwiftUI. As expected, it reacts and bends when a magnet is nearby. Ready to use on

Metal effect is now available for SwiftUI. As expected, it reacts and bends when a magnet is nearby. Ready to use on

403,396 views

Created a new skill for UI generation skeleton effect, something I’ve been using in my UI videos. These UI examples are built with UI Agent.

Created a new skill for UI generation skeleton effect, something I’ve been using in my UI videos. These UI examples are built with UI Agent.

182,715 views

Made a skill for expressive UI. The libraries-dev skill teaches your agent where and how to use library effects in your project, making your UI less generic, more expressive.

Made a skill for expressive UI. The libraries-dev skill teaches your agent where and how to use library effects in your project, making your UI less generic, more expressive.

275,291 views

Thinking Orbs, animated component library 6 types, optimized for large and small sizes, light & dark mode, playground, zero dependencies npm install thinking-orbs Collaborated on this with alex brinza who did a lot of work

Thinking Orbs, animated component library 6 types, optimized for large and small sizes, light & dark mode, playground, zero dependencies npm install thinking-orbs Collaborated on this with alex brinza who did a lot of work

651,779 views

Voice Effect is now available for SwiftUI with built in emotion recognition. The color theme reacts to the emotion in your speech using local emotion2vec for tone + SamLowe word emotion recognition model.

Voice Effect is now available for SwiftUI with built in emotion recognition. The color theme reacts to the emotion in your speech using local emotion2vec for tone + SamLowe word emotion recognition model.

87,970 views

Gooey (liquid) effect Optimized for UI, 2 different types, works with shadows, build-in image melting effect, playground, zero dep npm install liquid-gooey

Gooey (liquid) effect Optimized for UI, 2 different types, works with shadows, build-in image melting effect, playground, zero dep npm install liquid-gooey

338,205 views

Excited to launch Transitions Builder and Community. All these components were generated with a single prompt with the Transition UI agent, default setup, no designs provided. The agent creates on the library’s knowledge, UI craft principles, and libraries-dev libraries, with a focus on UI motion and the details that make an interface feel polished.

Excited to launch Transitions Builder and Community. All these components were generated with a single prompt with the Transition UI agent, default setup, no designs provided. The agent creates on the library’s knowledge, UI craft principles, and libraries-dev libraries, with a focus on UI motion and the details that make an interface feel polished.

47,787 views

A new home for all my libraries. 5 UI effect libraries, 20+ variants, ready to use for free. Border beam, Orbs, Metal, Gooey, Image

A new home for all my libraries. 5 UI effect libraries, 20+ variants, ready to use for free. Border beam, Orbs, Metal, Gooey, Image

188,772 views

Built something new: Voice effect. Animated voice glow effect, no shades & zero dep, 3 types, multiple states, dark & light theme.

Built something new: Voice effect. Animated voice glow effect, no shades & zero dep, 3 types, multiple states, dark & light theme.

113,609 views

Added new transitions to There are now 21 transitions you can copy as CSS or React code or use as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev

Added new transitions to There are now 21 transitions you can copy as CSS or React code or use as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev

220,993 views

Everything from is now available also as a skill npx skills add jakubantalik/transitions-dev

Everything from is now available also as a skill npx skills add jakubantalik/transitions-dev

267,448 views

Border beam effect is now available for Swift and React Native Dynamic colors, 5 types, playground, dark & light mode, zero dependencies

Border beam effect is now available for Swift and React Native Dynamic colors, 5 types, playground, dark & light mode, zero dependencies

111,230 views

Gooey library updated with a new melt and bend effects. Optimized for UI, cross-browser, 4 different effects, playground, zero dep npm install liquid-gooey

Gooey library updated with a new melt and bend effects. Optimized for UI, cross-browser, 4 different effects, playground, zero dep npm install liquid-gooey

65,936 views

Rebuilt the Metal effect library: It now includes reflection on the cursor, fluid hover bending, reflection on neighbor elements, dynamic glow, 4 types, ready to use npm install metal-fx

Rebuilt the Metal effect library: It now includes reflection on the cursor, fluid hover bending, reflection on neighbor elements, dynamic glow, 4 types, ready to use npm install metal-fx

46,396 views

Added an optional cursor gravity effect to Thinking orbs, just for fun. 9 types, ready to use with React, React Native and SwiftUI Collab with alex brinza

Added an optional cursor gravity effect to Thinking orbs, just for fun. 9 types, ready to use with React, React Native and SwiftUI Collab with alex brinza

39,055 views

Built an animated Liquid Metal border component library with built-in reflections on neighboring components, multiple styles and color modes, dark & light mode npm install metal-fx

Built an animated Liquid Metal border component library with built-in reflections on neighboring components, multiple styles and color modes, dark & light mode npm install metal-fx

135,765 views

Added 12 new transitions to 33 total You can copy as CSS or React code or use as a skill for Claude, Cursor or Codex or use with Refine tool npx skills add jakubantalik/transitions.dev

Added 12 new transitions to 33 total You can copy as CSS or React code or use as a skill for Claude, Cursor or Codex or use with Refine tool npx skills add jakubantalik/transitions.dev

74,750 views

A few examples of using the Transitions skill + Border Beam and Metal effects in a real UI in the Logram app npx skills add Jakubantalik/transitions.dev

A few examples of using the Transitions skill + Border Beam and Metal effects in a real UI in the Logram app npx skills add Jakubantalik/transitions.dev

47,565 views

Animated image loader component library ready to use, supports dark and light theme npm install img-fx

Animated image loader component library ready to use, supports dark and light theme npm install img-fx

82,207 views

Added 3 new transitions to You can grab them as a code or install them with the others as a skill npx skills add jakubantalik/transitions-dev

Added 3 new transitions to You can grab them as a code or install them with the others as a skill npx skills add jakubantalik/transitions-dev

87,871 views

Videos

LIVE
1.2k

Anya Rossi

sweetdream.ai

SweetDream.aiSponsored•Livecam
Streaming Now

Watch Anya Live

Anya is streaming live right now! Join her private show and enjoy exclusive content.

HD live stream
Exclusive private shows
1.2k viewers online

Free preview available • Premium content

More types added to the Thinking Orbs library. Large and small sizes, light & dark mode, playground, zero dep npm install thinking-orbs Huge shoutout to alex brinza who also worked on this
0:22
Jakubantalik's profile picture

More types added to the Thinking Orbs library. Large and small sizes, light & dark mode, playground, zero dep npm install thinking-orbs Huge shoutout to alex brinza who also worked on this

Jakub Antalik

662,574 views • 2 months ago

One skill for all UI motion. The Transitions-dev skill uses content and knowledge from the entire Transitions library and applies it to your project wherever it makes sense, for a more polished and snappy UI.
0:28
Jakubantalik's profile picture

One skill for all UI motion. The Transitions-dev skill uses content and knowledge from the entire Transitions library and applies it to your project wherever it makes sense, for a more polished and snappy UI.

Jakub Antalik

241,032 views • 1 month ago

Made a skill for UI transitions: It reviews a project, identifies transitions, and suggests improvements or replacements based on the source Transitions-dev library, making them more polished and snappy. npx skills add Jakubantalik/transitions.dev
0:26
Jakubantalik's profile picture

Made a skill for UI transitions: It reviews a project, identifies transitions, and suggests improvements or replacements based on the source Transitions-dev library, making them more polished and snappy. npx skills add Jakubantalik/transitions.dev

Jakub Antalik

207,713 views • 1 month ago

Thinking orbs library is now available for SwiftUI and React Native, all for free 9 types, playground, dark & light mode, zero dep Collab with alex brinza
0:27
Jakubantalik's profile picture

Thinking orbs library is now available for SwiftUI and React Native, all for free 9 types, playground, dark & light mode, zero dep Collab with alex brinza

Jakub Antalik

187,765 views • 2 months ago

Border beam effect somehow reached 180k+ installs New version is out: dynamic colors, 5 types, playground, dark & light mode, zero dependencies
0:21
Jakubantalik's profile picture

Border beam effect somehow reached 180k+ installs New version is out: dynamic colors, 5 types, playground, dark & light mode, zero dependencies

Jakub Antalik

230,851 views • 3 months ago

Introducing Transition Agent Transition Agent scans your codebase, scores its motion, and fixes it through pull requests. It uses the knowledge and taste from the entire Transitions-dev library. It should make your UI motion snappy and polished.
0:34
Jakubantalik's profile picture

Introducing Transition Agent Transition Agent scans your codebase, scores its motion, and fixes it through pull requests. It uses the knowledge and taste from the entire Transitions-dev library. It should make your UI motion snappy and polished.

Jakub Antalik

27,069 views • 19 days ago

Animated 3D bot avatars, inspired by Grok Bot 18 types, ready to use for React, React Native and SwiftUI, no threejs or webGPU, zero dep.
0:26
Jakubantalik's profile picture

Animated 3D bot avatars, inspired by Grok Bot 18 types, ready to use for React, React Native and SwiftUI, no threejs or webGPU, zero dep.

Jakub Antalik

32,726 views • 26 days ago

Collection of 33+ production ready UI transitions Available as CSS / React code or as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev
0:27
Jakubantalik's profile picture

Collection of 33+ production ready UI transitions Available as CSS / React code or as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev

Jakub Antalik

84,144 views • 2 months ago

Tune your UI transitions directly in Cursor CLI, Codex or Claude Code with the Transitions-dev skill built in It scans your project with your agent, suggests transitions improvements, and applies changes directly to source code
0:23
Jakubantalik's profile picture

Tune your UI transitions directly in Cursor CLI, Codex or Claude Code with the Transitions-dev skill built in It scans your project with your agent, suggests transitions improvements, and applies changes directly to source code

Jakub Antalik

72,951 views • 3 months ago

Comparison demo without and with the Transitions skill Demo page with more details, usage and commands npx skills add jakubantalik/transitions.dev
0:20
Jakubantalik's profile picture

Comparison demo without and with the Transitions skill Demo page with more details, usage and commands npx skills add jakubantalik/transitions.dev

Jakub Antalik

90,132 views • 5 months ago

Introducing Transitions Refine A tool for tuning UI transitions directly in Cursor, Codex or Claude Code with the Transitions-dev skill built in • Integrated skill analyzes your transitions and provides suggestions you can apply directly • Timeline and controls for manual edits • No need to copy and paste values everything is updated directly in your source
0:23
Jakubantalik's profile picture

Introducing Transitions Refine A tool for tuning UI transitions directly in Cursor, Codex or Claude Code with the Transitions-dev skill built in • Integrated skill analyzes your transitions and provides suggestions you can apply directly • Timeline and controls for manual edits • No need to copy and paste values everything is updated directly in your source

Jakub Antalik

52,274 views • 3 months ago

Added 6 new transitions to You can copy them as a CSS / React code or install them with the others as a skill for Claude or Codex npx skills add jakubantalik/transitions.dev
0:27
Jakubantalik's profile picture

Added 6 new transitions to You can copy them as a CSS / React code or install them with the others as a skill for Claude or Codex npx skills add jakubantalik/transitions.dev

Jakub Antalik

61,665 views • 4 months ago

A small tip I use for state transitions in a UI to make it feel smoother
0:25
Jakubantalik's profile picture

A small tip I use for state transitions in a UI to make it feel smoother

Jakub Antalik

157,691 views • 1 year ago

Created a new variant of the Border beam UI effect: Pulse. Inner and outside types, multiple color variants, dark and light mode npm install border-beam
0:20
Jakubantalik's profile picture

Created a new variant of the Border beam UI effect: Pulse. Inner and outside types, multiple color variants, dark and light mode npm install border-beam

Jakub Antalik

40,766 views • 4 months ago

Finally refreshed my personal website with a bit of help from Claude. As usual, added a feature nobody asked for, page customization. You can change colors and fonts, switch it to 3D, and of course you make the logo bigger
0:35
Jakubantalik's profile picture

Finally refreshed my personal website with a bit of help from Claude. As usual, added a feature nobody asked for, page customization. You can change colors and fonts, switch it to 3D, and of course you make the logo bigger

Jakub Antalik

31,681 views • 7 months ago

Image loader effect New version includes: loading, reveal and regenerate animations, 3 types, playground, dark & light mode
0:22
Jakubantalik's profile picture

Image loader effect New version includes: loading, reveal and regenerate animations, 3 types, playground, dark & light mode

Jakub Antalik

14,237 views • 3 months ago

Built a new component library: animated image generation loader and reveal effect 3 different types, dark and light mode support npm install img-fx
0:26
Jakubantalik's profile picture

Built a new component library: animated image generation loader and reveal effect 3 different types, dark and light mode support npm install img-fx

Jakub Antalik

18,339 views • 5 months ago

A new version of the Liquid Metal is available. Thanks to Martin Petercak the performance is much better and it should run smoothly in all browsers Includes built-in reflection, dark & light modes, shadcn version npm install metal-fx
0:20
Jakubantalik's profile picture

A new version of the Liquid Metal is available. Thanks to Martin Petercak the performance is much better and it should run smoothly in all browsers Includes built-in reflection, dark & light modes, shadcn version npm install metal-fx

Jakub Antalik

16,859 views • 5 months ago

My 2025 design work recap, mostly focused on work for @FUN with a few concepts collab with Aaron Iker ✨
0:42
Jakubantalik's profile picture

My 2025 design work recap, mostly focused on work for @FUN with a few concepts collab with Aaron Iker ✨

Jakub Antalik

19,024 views • 10 months ago

No more content to load