Desperately Seeking Squircles
An engineer aims to incorporate Apple's 'squircle' shape into Figma, navigating mathematical complexities with superellipse formulas and Bézier curves. Challenges in mirroring and transitioning the shape prompt a proposed smoothing scheme for versatile designs. Differential geometry aids in mathematically analyzing the squircle's perimeter, showcasing the intricate process of digital design translation.
Read original article
The article discusses an engineer's quest to implement Apple's 'squircle' shape into Figma, a design tool. The engineer delves into the mathematical intricacies of the squircle, which is a blend of a square and a circle, emphasizing the importance of curvature in design perception. Initially exploring the superellipse formula, the engineer encounters discrepancies and refines the approach using Bézier curves. Challenges arise in mirroring the shape accurately and maintaining smooth transitions. The engineer proposes a parametrizable smoothing scheme to create various shapes beyond the squircle. Differential geometry concepts are introduced to analyze the squircle's perimeter mathematically. The article highlights the complexity of translating a physical design concept into a digital tool, emphasizing the meticulous attention to detail required in the process.
Related
Software design gets worse before it gets better
The "Trough of Despair" in software design signifies a phase where design worsens before improving. Designers must manage expectations, make strategic decisions, and take incremental steps to navigate this phase successfully.
Eight million pixels and counting: improving texture atlas allocation in Firefox (2021)
Improving texture atlas allocation in WebRender with the guillotiere crate reduces texture memory usage. The guillotine algorithm was replaced due to fragmentation issues, leading to a more efficient allocator. Visualizing the atlas in SVG aids debugging. Rust's simplicity and Cargo fuzz testing are praised for code development and robustness. Enhancements in draw call batching and texture upload aim to boost performance on low-end Intel GPUs by optimizing texture atlases.
SVG: The Good, the Bad, and the Ugly (2021)
SVG, scalable vector graphics, is a versatile format for web design, supporting various graphic elements like paths, shapes, text, and animations. Despite its power, its complexity and extensive specifications can be challenging for users.
Synthesizer for Thought
The article delves into synthesizers evolving as tools for music creation through mathematical understanding of sound, enabling new genres. It explores interfaces for music interaction and proposes innovative language models for text analysis and concept representation, aiming to enhance creative processes.
Round Rects Are Everywhere
In 1981, Bill Atkinson developed oval routines for Macintosh. Steve Jobs challenged him to create rounded rectangles, leading to the "RoundRects" feature. This anecdote showcases innovation and collaboration in early Macintosh development.
5 commentsFor some (irrational, I admit) reason, to me they are a visual reminder of all that went wrong in computing since the times the rounded rectangle was king. The vision of squircles in any UI instantly produces in me a sensation of a patronizing voice saying "don't you just LOVE walled gardens and app stores and closed hardware and ads and...".
Of course the squircles themselves are innocent, but what can I do.
Related
Software design gets worse before it gets better
The "Trough of Despair" in software design signifies a phase where design worsens before improving. Designers must manage expectations, make strategic decisions, and take incremental steps to navigate this phase successfully.
Eight million pixels and counting: improving texture atlas allocation in Firefox (2021)
Improving texture atlas allocation in WebRender with the guillotiere crate reduces texture memory usage. The guillotine algorithm was replaced due to fragmentation issues, leading to a more efficient allocator. Visualizing the atlas in SVG aids debugging. Rust's simplicity and Cargo fuzz testing are praised for code development and robustness. Enhancements in draw call batching and texture upload aim to boost performance on low-end Intel GPUs by optimizing texture atlases.
SVG: The Good, the Bad, and the Ugly (2021)
SVG, scalable vector graphics, is a versatile format for web design, supporting various graphic elements like paths, shapes, text, and animations. Despite its power, its complexity and extensive specifications can be challenging for users.
Synthesizer for Thought
The article delves into synthesizers evolving as tools for music creation through mathematical understanding of sound, enabling new genres. It explores interfaces for music interaction and proposes innovative language models for text analysis and concept representation, aiming to enhance creative processes.
Round Rects Are Everywhere
In 1981, Bill Atkinson developed oval routines for Macintosh. Steve Jobs challenged him to create rounded rectangles, leading to the "RoundRects" feature. This anecdote showcases innovation and collaboration in early Macintosh development.