In "Habit Hustle: The Creative Process Behind a UI Animation," Michael Crawford, a visual designer based in Stockholm, shares insights into his creative journey while developing a captivating animation inspired by gemstones. The article delves into the tools and techniques he employs, providing a detailed look at the workflow involved in creating UI animations. Crawford begins by introducing his background, highlighting his transition from advertising to interactive design. He emphasizes his passion for learning new skills in software like AfterEffects and Blender, which he uses to create prototypes. His animation project revolves around the concept of gemstones, which he associates with rewards for completing everyday tasks. This thematic choice sets the stage for the visual exploration that follows. The article outlines Crawford's program stack, which includes Blender for 3D motion, Figma for layout design, and AfterEffects for animation. He mentions specific plugins that enhance his workflow, such as AEUX for converting Figma files to AfterEffects and Motion 4 for streamlining animation tasks. These tools are essential for managing the complexities of syncing animations between different software. Crawford details his initial concept development, where he creates gemstone assets in Blender. He shares insights into the shader setup for achieving realistic glass and gem effects, emphasizing the importance of using accurate values for index of refraction (IOR) and dispersion to enhance realism. This technical foundation is crucial for the visual appeal of the final animation. The animation process is broken down into several steps. Crawford explains the challenges of syncing animations between Blender and AfterEffects, particularly for scroll animations. He provides practical tips for exporting layouts from Figma to AfterEffects, including strategies for managing layers and ensuring text is properly formatted. He also discusses the importance of building the animation in AfterEffects first to establish timing before moving to Blender. Once the rough animation is established, Crawford moves to Blender to refine the animation. He describes the intricacies of setting keyframes and adjusting properties, noting the flexibility of Blender in animating various elements. He emphasizes the need for frequent saving due to the software's tendency to crash, particularly during rendering. After testing the animation in AfterEffects, Crawford iterates on the timing and details, ensuring that the final product is polished. He highlights the significance of creating a seamless loop for social media and case studies, even if it’s not necessary for client projects. The final rendering process in Blender is time-consuming, especially with complex glass materials, but it culminates in a satisfying result. Crawford concludes by reflecting on the joy of creating personal projects, which allow him to experiment and refine his skills. He encourages others to pursue their interests in design and animation, emphasizing the importance of enjoyment in the learning process. The article serves as both a tutorial and an inspiration for designers looking to enhance their animation skills.

Björn Ottosson, a Swedish engineer, is the creator of the Oklab color space, which aims to provide a more intuitive and effective way to work with colors in digital environments. In an interview with Philip Jägenstedt, Ottosson discusses his background in the gaming industry, where he worked on popular titles like FIFA and Battlefield, and how his interest in technology and art led him to develop Oklab. Ottosson explains the challenges of working with colors in software, noting that while colors may seem simple, the common color spaces like sRGB and HSL do not accurately reflect human color perception. He highlights the limitations of sRGB, particularly its tendency to produce unexpected results, such as purple hues in gradients, due to its design based on CRT monitors rather than human vision. The conversation delves into the complexities of color perception, emphasizing that it is influenced by various factors, including lighting conditions and background colors. Ottosson references historical models like CIE XYZ, which laid the groundwork for understanding color vision, and discusses the shortcomings of existing color spaces that fail to account for the intricacies of human perception. Oklab was born out of Ottosson's desire to create a color space that balances hue uniformity with accurate lightness and saturation handling. He combined elements from CIECAM16 and IPT to develop Oklab, which he describes as a simple yet effective model. The name "Oklab" reflects a sense of humility, as Ottosson aimed to create a color space that was "okay" for practical use, acknowledging that further research could enhance its capabilities. The rapid adoption of Oklab across major browsers surprised Ottosson, who initially expected it to be used primarily in the gaming and visual effects industries. A blog post he shared garnered significant attention, leading to discussions with industry professionals and ultimately its integration into CSS and software like Photoshop. In addition to Oklab, Ottosson introduced Okhsl and Okhsv, which aim to address some of the limitations of HSL while maintaining a user-friendly parameter space. Okhsl, in particular, was designed to improve color selection and manipulation by ensuring that all combinations of hue, saturation, and lightness remain within the bounds of sRGB. Throughout the interview, Ottosson emphasizes the importance of compromise in color modeling, as the complexities of color perception often require practical solutions. He acknowledges that while Oklab has its strengths, there is always room for improvement and further exploration in the field of color science. In closing, Ottosson shares his personal favorite colors, which include burgundy, dark greens, and navy blues, and expresses gratitude for the opportunity to discuss his work. The interview provides valuable insights into the development of Oklab and the ongoing challenges and innovations in the realm of color spaces.