Motion system to make Zed feel fluid and intentional

assets/settings/default.json

@@ -195,6 +195,15 @@
   //
   // Default: "client"
   "window_decorations": "client",
+  // Whether to reduce motion in UI animations.
+  // May take 3 values:
+  //  1. Follow the OS accessibility setting:
+  //         "reduce_motion": "system"
+  //  2. Always reduce motion (skip animations):
+  //         "reduce_motion": "on"
+  //  3. Never reduce motion (always animate):
+  //         "reduce_motion": "off"
+  "reduce_motion": "system",
   // Whether to use the system provided dialogs for Open and Save As.
   // When set to false, Zed will use the built-in keyboard-first pickers.
   "use_system_path_prompts": true,

crates/gpui/src/app.rs

@@ -1236,6 +1236,11 @@ impl App {
         self.platform.should_auto_hide_scrollbars()
     }
 
+    /// Returns whether the platform's accessibility settings request reduced motion.
+    pub fn should_reduce_motion(&self) -> bool {
+        self.platform.should_reduce_motion()
+    }
+
     /// Restarts the application.
     pub fn restart(&mut self) {
         self.restart_observers

crates/gpui/src/elements/animation.rs

@@ -229,6 +229,11 @@ mod easing {
         }
     }
 
+    /// The cubic ease-out function, which starts quickly and decelerates to a stop
+    pub fn ease_out_cubic(delta: f32) -> f32 {
+        1.0 - (1.0 - delta).powi(3)
+    }
+
     /// The Quint ease-out function, which starts quickly and decelerates to a stop
     pub fn ease_out_quint() -> impl Fn(f32) -> f32 {
         move |delta| 1.0 - (1.0 - delta).powi(5)
@@ -261,3 +266,38 @@ mod easing {
         }
     }
 }
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn test_ease_out_cubic_boundaries() {
+        assert_eq!(ease_out_cubic(0.0), 0.0);
+        assert_eq!(ease_out_cubic(1.0), 1.0);
+    }
+
+    #[test]
+    fn test_ease_out_cubic_monotonically_increasing() {
+        let mut previous = 0.0f32;
+        for i in 1..=100 {
+            let t = i as f32 / 100.0;
+            let value = ease_out_cubic(t);
+            assert!(
+                value >= previous,
+                "ease_out_cubic should be monotonically increasing: f({t}) = {value} < f({}) = {previous}",
+                (i - 1) as f32 / 100.0
+            );
+            previous = value;
+        }
+    }
+
+    #[test]
+    fn test_ease_out_cubic_midpoint() {
+        let mid = ease_out_cubic(0.5);
+        assert!(
+            mid > 0.5,
+            "ease-out should be above linear at midpoint, got {mid}"
+        );
+    }
+}

crates/gpui/src/elements/uniform_list.rs

@@ -544,12 +544,13 @@ impl Element for UniformList {
             window,
             cx,
             |_, window, cx| {
-                for item in &mut request_layout.items {
-                    item.paint(window, cx);
-                }
+                // Decorations paint before items so backgrounds (e.g. selection highlights) render behind item content.
                 for decoration in &mut request_layout.decorations {
                     decoration.paint(window, cx);
                 }
+                for item in &mut request_layout.items {
+                    item.paint(window, cx);
+                }
             },
         )
     }

crates/gpui/src/platform.rs

@@ -270,6 +270,10 @@ pub(crate) trait Platform: 'static {
     fn set_cursor_style(&self, style: CursorStyle);
     fn should_auto_hide_scrollbars(&self) -> bool;
 
+    fn should_reduce_motion(&self) -> bool {
+        false
+    }
+
     fn read_from_clipboard(&self) -> Option<ClipboardItem>;
     fn write_to_clipboard(&self, item: ClipboardItem);
 

crates/gpui/src/platform/mac/platform.rs

@@ -1006,6 +1006,14 @@ impl Platform for MacPlatform {
         }
     }
 
+    fn should_reduce_motion(&self) -> bool {
+        unsafe {
+            let workspace: id = msg_send![class!(NSWorkspace), sharedWorkspace];
+            let reduce: BOOL = msg_send![workspace, accessibilityDisplayShouldReduceMotion];
+            reduce != NO
+        }
+    }
+
     fn read_from_clipboard(&self) -> Option<ClipboardItem> {
         let state = self.0.lock();
         state.general_pasteboard.read()

crates/picker/Cargo.toml

@@ -21,6 +21,7 @@ gpui.workspace = true
 menu.workspace = true
 schemars.workspace = true
 serde.workspace = true
+settings.workspace = true
 theme.workspace = true
 ui.workspace = true
 ui_input.workspace = true