![Brett Profile](https://pbs.twimg.com/profile_images/1506420107555520512/yMBUzR1q_x96.jpg)
Brett
@0xBrettj
Followers
609
Following
10K
Statuses
2K
Practising practitioner, recovering perfectionist · Design engineer at Buildkite
Joined February 2009
After months of all-out work, we’re thrilled to share the new ❖ Fully rebuilt with @astrodotbuild, @tailwindcss, React, Framer Motion ❖ Full light/dark mode support
11
15
172
@mattgperry So exciting! [Framer] Motion has made such an influential impact on animations in modern frontend web development —keen to see what’s next! 🚀
1
0
3
@Ash_Hitchcock @astrodotbuild @tailwindcss Cheers! Videos recorded with Screenflick and composited with Adobe After Effects. Mini-breakdown here:
There are a variety of approaches. This was recorded on macOS with Screenflick¹ and composited with Adobe After Effects. Screenflick records very high quality (both fps/resolution). Recording on an Apple Studio Display gives ~5K pixels to play around with in After Effects, which is useful for displaying in 3D and zooming in close without losing quality. In After Effects, create a new composition and add a camera². Drag in the footage and toggle on 3d for the footage layer. You can use any combination of keyframing the 3d position and rotation of the footage layer, or the position and point of interest of the camera. The camera also has other properties that can be tweaked and animated over time (via the stopwatch icons), such as focus distance and aperture. This is useful for simulating rack focus adjustments. The rest is trial and error! @videocopilot and @mtmograph are very helpful resources for After Effects. _ 1: 2: 40–50mm will feel close to human perspective, wider fov will make angled perspectives look more fisheye, and narrower more telephoto.
0
0
2
There are a variety of approaches. This was recorded on macOS with Screenflick¹ and composited with Adobe After Effects. Screenflick records very high quality (both fps/resolution). Recording on an Apple Studio Display gives ~5K pixels to play around with in After Effects, which is useful for displaying in 3D and zooming in close without losing quality. In After Effects, create a new composition and add a camera². Drag in the footage and toggle on 3d for the footage layer. You can use any combination of keyframing the 3d position and rotation of the footage layer, or the position and point of interest of the camera. The camera also has other properties that can be tweaked and animated over time (via the stopwatch icons), such as focus distance and aperture. This is useful for simulating rack focus adjustments. The rest is trial and error! @videocopilot and @mtmograph are very helpful resources for After Effects. _ 1: 2: 40–50mm will feel close to human perspective, wider fov will make angled perspectives look more fisheye, and narrower more telephoto.
1
1
5
@spicyfiona Same! Think I’ll start to make the transition now but has been holding off since it was first rolled out for me 🫣 The option of edge-to-edge panels does help!
0
0
1
@pinzonjulian @simonswiss @CoreyGinnivan Right back at you Juli! Working with you is always a joy, very much looking forward to everything we’ll build together in future!
1
0
2
@designerjeremy @CoreyGinnivan @astrodotbuild Cheers Jeremy! Strong agree—Astro so far has been a joy to build with! 😄
0
0
1
Huge collaborative effort from a small team—including but not limited to @CoreyGinnivan, @hannahcancode, @mitchjamesjames. Proud of our work—career highlight for sure!
1
0
7
@asallen @notboring would love to use !Vibes on my Mac while working—any plans to offer it for Apple Silicon Macs?
1
0
0
@simonswiss @joshcirre Haven’t tried YellowDot, but it’s made by the developers of Clop, a pretty handy image/video/clipboard optimiser that I quite like...
1
0
2
RT @simonswiss: The video of my talk at #EpicWebConf in Park City 🏔️ "Unleashing Designers With Tailwind CSS"
0
4
0
@toolmantim @shadcn @sourcegraph Nice! 🔥 good reminder that videogames are genuinely an excellent source of UI inspiration (Also, this tweet made me try entering the konami code on to check for an easter egg 😉)
0
0
1
well this is something i didn’t expect to do today...
@wesbos There's a good tool in Edge for it: It won't be a problem if your page is small but the performance will scale poorly with the total number of DOM nodes on the page.
1
1
1