# motion design

Published articles for motion design.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Yestalgia: Bringing Decathlon's '90s Spirit to Life Through a Playful Digital Experience

DevFeed: [Yestalgia: Bringing Decathlon's '90s Spirit to Life Through a Playful Digital Experience](<https://devfeed.tech/articles/yestalgia-bringing-decathlon-s-90s-spirit-to-life-through-a-playful-digital-experience-4349.md>)

Original publisher: [Read original article](<https://tympanus.net/codrops/2026/09/12/yestalgia-bringing-decathlons-90s-spirit-to-life-through-a-playful-digital-experience/>)

Author: Quentin Hocdé and Jonathan Da Costa

Published: 2026-09-12T08:40:31Z

Content type: article

Language: en

Sources: [Codrops](<https://devfeed.tech/sources/codrops.md>)

Topics: [micro-interactions for websites](<https://devfeed.tech/topics/micro-interactions-for-websites.md>)

Tags: [90s-inspired-design](<https://devfeed.tech/tags/90s-inspired-design.md>), [90s-web-design](<https://devfeed.tech/tags/90s-web-design.md>), [animation](<https://devfeed.tech/tags/animation.md>), [articles](<https://devfeed.tech/tags/articles.md>), [case-study](<https://devfeed.tech/tags/case-study.md>), [creative-development](<https://devfeed.tech/tags/creative-development.md>), [creative-technology](<https://devfeed.tech/tags/creative-technology.md>), [creative-web-design](<https://devfeed.tech/tags/creative-web-design.md>), [decathlon-digital-experience](<https://devfeed.tech/tags/decathlon-digital-experience.md>), [decathlon-website](<https://devfeed.tech/tags/decathlon-website.md>), [decathlon-yestalgia](<https://devfeed.tech/tags/decathlon-yestalgia.md>), [design](<https://devfeed.tech/tags/design.md>), [development](<https://devfeed.tech/tags/development.md>), [editorial-web-design](<https://devfeed.tech/tags/editorial-web-design.md>), [experimental-web-design](<https://devfeed.tech/tags/experimental-web-design.md>), [fashion-web-design](<https://devfeed.tech/tags/fashion-web-design.md>), [gsap](<https://devfeed.tech/tags/gsap.md>), [gsap-animation](<https://devfeed.tech/tags/gsap-animation.md>), [illustration](<https://devfeed.tech/tags/illustration.md>), [immersive-web-experience](<https://devfeed.tech/tags/immersive-web-experience.md>), [interactive-storytelling](<https://devfeed.tech/tags/interactive-storytelling.md>), [interactive-website](<https://devfeed.tech/tags/interactive-website.md>), [lenis-smooth-scroll](<https://devfeed.tech/tags/lenis-smooth-scroll.md>), [motion-design](<https://devfeed.tech/tags/motion-design.md>), [nostalgic-web-design](<https://devfeed.tech/tags/nostalgic-web-design.md>), [performance](<https://devfeed.tech/tags/performance.md>), [piecesjs](<https://devfeed.tech/tags/piecesjs.md>), [product](<https://devfeed.tech/tags/product.md>), [product-focused-design](<https://devfeed.tech/tags/product-focused-design.md>), [product-launch](<https://devfeed.tech/tags/product-launch.md>), [rive](<https://devfeed.tech/tags/rive.md>), [rive-animation](<https://devfeed.tech/tags/rive-animation.md>), [typography](<https://devfeed.tech/tags/typography.md>), [walkman-navigation](<https://devfeed.tech/tags/walkman-navigation.md>), [web](<https://devfeed.tech/tags/web.md>), [web-animation](<https://devfeed.tech/tags/web-animation.md>), [wordpress](<https://devfeed.tech/tags/wordpress.md>), [wordpress-custom-theme](<https://devfeed.tech/tags/wordpress-custom-theme.md>), [yestalgia](<https://devfeed.tech/tags/yestalgia.md>)

### AI overview

This article presents Yestalgia, Decathlon's '90s-inspired capsule collection website. It explains how editorial product presentation, vibrant illustration, expressive typography, animation, micro-interactions, and a cassette-player navigation concept turn the campaign's nostalgic art direction into a playful digital experience.

### Source excerpt

A closer look at how Yestalgia brings Decathlon's '90s-inspired vision to the web through art direction, interaction, animation, and creative development.

## Prioritizing craft in Recap, our newest AI-powered feature

DevFeed: [Prioritizing craft in Recap, our newest AI-powered feature](<https://devfeed.tech/articles/prioritizing-craft-in-recap-our-newest-ai-powered-feature-9151.md>)

Original publisher: [Read original article](<https://slack.design/articles/prioritizing-craft-in-recap-our-newest-ai-powered-feature/>)

Author: andyacevedo

Published: 2024-09-26T19:19:38Z

Content type: opinion

Language: en

Sources: [Slack Design](<https://devfeed.tech/sources/slack-design.md>)

Topics: [Slack](<https://devfeed.tech/topics/slack.md>), [Artificial Intelligence](<https://devfeed.tech/topics/ai.md>), [User interface design](<https://devfeed.tech/topics/ui-design.md>), [ui](<https://devfeed.tech/topics/ui.md>), [Mobile](<https://devfeed.tech/topics/mobile.md>)

Tags: [ai](<https://devfeed.tech/tags/ai.md>), [collaboration](<https://devfeed.tech/tags/collaboration.md>), [design](<https://devfeed.tech/tags/design.md>), [motion-design](<https://devfeed.tech/tags/motion-design.md>), [process](<https://devfeed.tech/tags/process.md>), [product](<https://devfeed.tech/tags/product.md>), [slack](<https://devfeed.tech/tags/slack.md>), [ui](<https://devfeed.tech/tags/ui.md>), [uncategorized](<https://devfeed.tech/tags/uncategorized.md>)

### AI overview

A Slack Design article explains how the team prioritized craft while launching Recap, a Slack AI feature that provides daily channel summaries. It describes the emphasis on simplicity, accessibility, intentional interaction details, collaborative design work, and lessons for future AI features.

### Source excerpt

Think about your experience using other products. What made them feel good to use? With the launch of Recap -- our new Slack AI feature that provides daily summaries of channels you want to keep tabs on but aren't active in -- we knew it had to go beyond just working as expected. Functionality is [...] The post Prioritizing craft in Recap, our newest AI-powered feature appeared first on Slack Design.

## How our design team level set on career leveling

DevFeed: [How our design team level set on career leveling](<https://devfeed.tech/articles/how-our-design-team-level-set-on-career-leveling-9674.md>)

Original publisher: [Read original article](<https://www.figma.com/blog/figma-design-team-career-levels/>)

Author: Sara Culver

Published: 2023-03-23T00:00:00Z

Content type: article

Language: en

Sources: [Figma Blog](<https://devfeed.tech/sources/figma-blog.md>)

Topics: [Figma](<https://devfeed.tech/topics/figma.md>), [Notion](<https://devfeed.tech/topics/notion.md>)

Tags: [career](<https://devfeed.tech/tags/career.md>), [design](<https://devfeed.tech/tags/design.md>), [figma](<https://devfeed.tech/tags/figma.md>), [management](<https://devfeed.tech/tags/management.md>), [motion-design](<https://devfeed.tech/tags/motion-design.md>), [product-design](<https://devfeed.tech/tags/product-design.md>), [product-strategy](<https://devfeed.tech/tags/product-strategy.md>), [prototyping](<https://devfeed.tech/tags/prototyping.md>), [research](<https://devfeed.tech/tags/research.md>), [skills](<https://devfeed.tech/tags/skills.md>), [writing](<https://devfeed.tech/tags/writing.md>)

### AI overview

Figma's design organization revamped its product design and writing career levels to clarify expectations, evaluate craft, support hiring and performance management, and help designers identify skill-development priorities. The framework includes a FigJam, a skills chart, core competency descriptions, and a Skills Widget.

### Source excerpt

Design Manager Sara Culver takes us through evolving Figma's product design and writing career levels.

## Designing accessible animation

DevFeed: [Designing accessible animation](<https://devfeed.tech/articles/designing-accessible-animation-9380.md>)

Original publisher: [Read original article](<https://a11yproject.com/posts/design-accessible-animation/>)

Author: Kelly Gillit

Published: 2020-12-22T00:00:00Z

Content type: article

Language: en

Sources: [The A11Y Project](<https://devfeed.tech/sources/the-a11y-project.md>)

Topics: [Accessibility](<https://devfeed.tech/topics/accessibility.md>), [web animation](<https://devfeed.tech/topics/web-animation.md>), [Responsive Design](<https://devfeed.tech/topics/responsive-design.md>), [User interface design](<https://devfeed.tech/topics/ui-design.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [animation](<https://devfeed.tech/tags/animation.md>), [developers](<https://devfeed.tech/tags/developers.md>), [digital-products](<https://devfeed.tech/tags/digital-products.md>), [motion-design](<https://devfeed.tech/tags/motion-design.md>), [responsive-design](<https://devfeed.tech/tags/responsive-design.md>)

### AI overview

This article explains how to design accessible animation for digital products. It discusses motion-related risks, responsive animation, limiting duration and repetition, and giving users controls to pause, stop, or hide animations.

### Source excerpt

Animation is used in digital products in many ways, such as drawing a user's focus to a particular area on the screen, providing another layer to a brand's style with unique and ownable motion design, and adding a spark of unexpected fun to an otherwise robotic interaction. But designing animation that surprises and delights accessibly is trickier than it sounds. Dizziness, nausea, disorientation, migraines, and even seizures can all be caused by well-executed yet inaccessible motion design. Because of this, it is critical to design your animation with both aesthetics and accessibility in mind. Consider parallaxing--large-scale animation where the foreground and background slide past each other at different speeds--and primary navigation based on horizontal scrolling. These effects, especially when dramatic, can trigger the symptoms mentioned earlier. Animations inherently carry a lot of visual and cognitive weight, so always take into account how the user will be viewing it. Desktop screens are interacted with at a greater distance than handheld devices, therefore any animation should be responsive to avoid overwhelming or distracting users from anything essential. Users with cognitive and learning disabilities may especially appreciate this. Next, rein in the animations. Endlessly looping animations at any size can be more disorienting than delightful. Specifying the number of cycles it will play, limiting the duration that it plays, or having the animation paused by default will ensure its accessibility. Another way to handle this is by designing controllers that allow the user to pause, stop, or hide the animation altogether. While it's essential that accessible animation starts at the design level, there are additional ways developers can implement these tips behind the scenes. We've included some links to help show you how.