Design: Onion Skinning for Blender #102217

Open
opened 2022-11-01 23:07:36 +01:00 by Christoph Lendenfeld · 20 comments

This is the overarching task to get Onion Skinning functionality into Blender.

Onion Skinning (or Ghosting) is a way of displaying data of a different frame than the current one.
This is useful for animation because they can visually compare poses.

This Design Task serves as a starting point for the conversation in the Animation & Rigging module.
More details will be added later.

The Goal

Implement editable Onion Skinning into Blender, following the FIFIDS principles laid out in the Animation Workshop prior to Blender Con.

The Plan

The proposed plan has 3 stages:

Single Frame Onion Skinning

  • Take a snapshot of a user specified geometry or a subset thereof
  • Learn how to implement overlays into the viewport renderer
  • Shading options (Outline, single color, tinting)
  • tools to position and mask onion skins

The Basics

Important to answer is how the user defines what he wants to display as ghost. Not everything should be ghosted, but rather select geometry defined by the user. The information which objects to ghost should be stored on the scene, so it doesn't need to be defined for every view.
The options to display the ghosts should exist per view though since I can see a use for not displaying ghosts in certain scenarios.

The GUI to access the functions can live in the N panel.
screen_space_ghosting_menu.png

In order to quickly toggle ghosts, it can be added to the overlays panel
screen_space_ghosting_overlay.png

Animation Caching

  • Figure out how to evaluate objects on a frame other than the current one and store the result (check out how motion paths do it)
  • If the animation is stored, make sure it is read when playing back the scene
  • Caching needs to be bullet proof. No stale caches should ever be presented to the user

User interaction to define which frames to display

The information which ghosts to display is stored on the scene and not per area.
That makes it possible to use the timeline to define where to display ghosts and have it sync over all areas.
In order to make the setting of ghosts quickly I propose the following interaction:
ALT+click in the time slider area to toggle relative ghosts (those that travel with the current time)
ALT+SHIFT+click to define pinned ghosts (those that stay on the frame no matter what)
onion_skin_timeline.jpg

Editable Onion Skinning

  • Add the option to edit objects from different frames
  • Most important is performance and intuitive use of the system
**This is the overarching task to get Onion Skinning functionality into Blender.** Onion Skinning (or Ghosting) is a way of displaying data of a different frame than the current one. This is useful for animation because they can visually compare poses. This Design Task serves as a starting point for the conversation in the Animation & Rigging module. More details will be added later. # The Goal Implement editable Onion Skinning into Blender, following the FIFIDS principles laid out in the Animation Workshop prior to Blender Con. # The Plan The proposed plan has 3 stages: ## Single Frame Onion Skinning * Take a snapshot of a user specified geometry or a subset thereof * Learn how to implement overlays into the viewport renderer * Shading options (Outline, single color, tinting) * tools to position and mask onion skins ### The Basics Important to answer is how the user defines what he wants to display as ghost. Not everything should be ghosted, but rather select geometry defined by the user. The information which objects to ghost should be stored on the scene, so it doesn't need to be defined for every view. The options to display the ghosts should exist per view though since I can see a use for not displaying ghosts in certain scenarios. The GUI to access the functions can live in the N panel. ![screen_space_ghosting_menu.png](https://archive.blender.org/developer/F14080323/screen_space_ghosting_menu.png) In order to quickly toggle ghosts, it can be added to the overlays panel ![screen_space_ghosting_overlay.png](https://archive.blender.org/developer/F14080319/screen_space_ghosting_overlay.png) ## Animation Caching * Figure out how to evaluate objects on a frame other than the current one and store the result (check out how motion paths do it) * If the animation is stored, make sure it is read when playing back the scene * Caching needs to be bullet proof. No stale caches should ever be presented to the user ### User interaction to define which frames to display The information which ghosts to display is stored on the scene and not per area. That makes it possible to use the timeline to define where to display ghosts and have it sync over all areas. In order to make the setting of ghosts quickly I propose the following interaction: ALT+click in the time slider area to toggle relative ghosts (those that travel with the current time) ALT+SHIFT+click to define pinned ghosts (those that stay on the frame no matter what) ![onion_skin_timeline.jpg](https://projects.blender.org/attachments/250bcf1f-74bc-4691-8b46-d1d89c1561b7) ## Editable Onion Skinning * Add the option to edit objects from different frames * Most important is performance and intuitive use of the system
Author
Member

Changed status from 'Needs Triage' to: 'Confirmed'

Changed status from 'Needs Triage' to: 'Confirmed'
Author
Member

Added subscriber: @ChrisLend

Added subscriber: @ChrisLend
Christoph Lendenfeld changed title from Onion Skinning for Blender to Design: Onion Skinning for Blender 2022-11-02 09:01:06 +01:00

Added subscriber: @mod_moder

Added subscriber: @mod_moder
Contributor

Added subscriber: @RedMser

Added subscriber: @RedMser
Member

Added subscriber: @BClark

Added subscriber: @BClark

Added subscriber: @Yuro

Added subscriber: @Yuro

Added subscriber: @ndh

Added subscriber: @ndh
Contributor

Added subscriber: @Nika-Kutsniashvili

Added subscriber: @Nika-Kutsniashvili
Contributor

Hello. I want to give user feedback if that's ok. I like the GUI designs presented and personally, I'll use the N menu one, but I have a lot of 2D animator friends and thought how would they find the settings for it if they opened up Blender for the first time. I decided to check how grease pencil onion skinning worked but couldn't find it myself. It took me minutes of googling, reading blender doc and youtube videos to finally find where they were. Not only that, but turns out there's no on/off switch. I had to reduce number of skins to 0 to make it go away. Not only is it timewasting practice, but absolutely confusing to anyone opening it for the first time. It's gonna be same for the 3D if beginner opens up blender and wants to control ghosts.

image.png

In other softwares I've used there is always on/off switch for onion skinning at either of those places, and since blender already uses those horizontal menu-thingys so well I think it absolutely needs to go there in either of those places. Personally what I would go for would be one button for toggling on/off and next to it arrow icon that opens up same options that are in N menu. Like Show Gizmo/Overlays buttons.

I hope this is helpful. Appreciate all the amazing work you do and can't wait for this feature. Thank you.

Hello. I want to give user feedback if that's ok. I like the GUI designs presented and personally, I'll use the N menu one, but I have a lot of 2D animator friends and thought how would they find the settings for it if they opened up Blender for the first time. I decided to check how grease pencil onion skinning worked but couldn't find it myself. It took me minutes of googling, reading blender doc and youtube videos to finally find where they were. Not only that, but turns out there's no on/off switch. I had to reduce number of skins to 0 to make it go away. Not only is it timewasting practice, but absolutely confusing to anyone opening it for the first time. It's gonna be same for the 3D if beginner opens up blender and wants to control ghosts. ![image.png](https://archive.blender.org/developer/F14082360/image.png) In other softwares I've used there is always on/off switch for onion skinning at either of those places, and since blender already uses those horizontal menu-thingys so well I think it absolutely needs to go there in either of those places. Personally what I would go for would be one button for toggling on/off and next to it arrow icon that opens up same options that are in N menu. Like Show Gizmo/Overlays buttons. I hope this is helpful. Appreciate all the amazing work you do and can't wait for this feature. Thank you.
Author
Member

hi @Nika-Kutsniashvili and thanks for the feedback
really appreciated.
I agree the options could live in a separate button. It would work just like the overlay button where you can easily toggle it.
The longer I think about it, the more I like it actually. I'll check with the dev team if there is any reason not to add a new button in the viewport

hi @Nika-Kutsniashvili and thanks for the feedback really appreciated. I agree the options could live in a separate button. It would work just like the overlay button where you can easily toggle it. The longer I think about it, the more I like it actually. I'll check with the dev team if there is any reason not to add a new button in the viewport

Added subscriber: @AdamEarle

Added subscriber: @AdamEarle

I have to agree as an animator. Onion skinning is something that is accessed a lot a lot, so constantly menu diving for this feature doesn't really make sense.
You want to also consider Freezframe (pin frames/ snapshots) and shift & traceas well.

Kinda a feature you don't really want to mess up and get wrong.
Take a look at how OpenToonz does it. It is honestly one of the best systems I have ever used, just because of how great it works and how simple it is.

Also, I would be tempted say that onion skinning is keyframe handling the viewport is just displaying the outcome.

No point in reinventing the camera when every animation system has a camera. The same idea applies here as well. Blender is just in a better position to hear from the masses.

In #102217#1464235, @Nika-Kutsniashvili wrote:
Hello. I want to give user feedback if that's ok. I like the GUI designs presented and personally, I'll use the N menu one, but I have a lot of 2D animator friends and thought how would they find the settings for it if they opened up Blender for the first time. I decided to check how grease pencil onion skinning worked but couldn't find it myself. It took me minutes of googling, reading blender doc and youtube videos to finally find where they were. Not only that, but turns out there's no on/off switch. I had to reduce number of skins to 0 to make it go away. Not only is it timewasting practice, but absolutely confusing to anyone opening it for the first time. It's gonna be same for the 3D if beginner opens up blender and wants to control ghosts.

image.png

In other softwares I've used there is always on/off switch for onion skinning at either of those places, and since blender already uses those horizontal menu-thingys so well I think it absolutely needs to go there in either of those places. Personally what I would go for would be one button for toggling on/off and next to it arrow icon that opens up same options that are in N menu. Like Show Gizmo/Overlays buttons.

I hope this is helpful. Appreciate all the amazing work you do and can't wait for this feature. Thank you.

I have to agree as an animator. Onion skinning is something that is accessed a lot a lot, so constantly menu diving for this feature doesn't really make sense. You want to also consider **Freezframe** *(pin frames/ snapshots)* and **shift & trace**as well. Kinda a feature you don't really want to mess up and get wrong. Take a look at how OpenToonz does it. It is honestly one of the best systems I have ever used, just because of how great it works and how simple it is. Also, I would be tempted say that **onion skinning** is **keyframe handling** the viewport is just displaying the outcome. No point in reinventing the camera when every animation system has a camera. The same idea applies here as well. Blender is just in a better position to hear from the masses. > In #102217#1464235, @Nika-Kutsniashvili wrote: > Hello. I want to give user feedback if that's ok. I like the GUI designs presented and personally, I'll use the N menu one, but I have a lot of 2D animator friends and thought how would they find the settings for it if they opened up Blender for the first time. I decided to check how grease pencil onion skinning worked but couldn't find it myself. It took me minutes of googling, reading blender doc and youtube videos to finally find where they were. Not only that, but turns out there's no on/off switch. I had to reduce number of skins to 0 to make it go away. Not only is it timewasting practice, but absolutely confusing to anyone opening it for the first time. It's gonna be same for the 3D if beginner opens up blender and wants to control ghosts. > > ![image.png](https://archive.blender.org/developer/F14082360/image.png) > > In other softwares I've used there is always on/off switch for onion skinning at either of those places, and since blender already uses those horizontal menu-thingys so well I think it absolutely needs to go there in either of those places. Personally what I would go for would be one button for toggling on/off and next to it arrow icon that opens up same options that are in N menu. Like Show Gizmo/Overlays buttons. > > I hope this is helpful. Appreciate all the amazing work you do and can't wait for this feature. Thank you.
Philipp Oeser removed the
Interest
Animation & Rigging
label 2023-02-09 14:34:44 +01:00
Author
Member

based on your suggestion and my experiments in #107641
I have come up with this design

based on your suggestion and my experiments in [#107641](https://projects.blender.org/blender/blender/pulls/107641) I have come up with this design
Contributor

Great job. What I would reconsider is this:

  1. First of all, colours. Hopefully they can be set in theme, but Red is past, Green is future, that's just how its in every software, how traffic signs work even, its just embeded in society right now. I would confuse this in 3D viewport all the time.

  2. I like shortcuts for dragging and pinning, but looking at it it looks like you can't change it, design doesn't tell you about that ability, because it looks like cached data. I would add brackets at the end and start of past/future, so that it communicates with user the ability, and if its draggable by mouse its just perfect design in my opinion.

  3. I think design should be unified with Grease Pencil somehow, drawing in the timeline, shortcuts, pinning and colours should be same for consistency.

  4. I think dashes should always merge, so that its easier to see. Just red lines below frame numbers looks more like an error message.

Great job. What I would reconsider is this: 1. First of all, colours. Hopefully they can be set in theme, but Red is past, Green is future, that's just how its in every software, how traffic signs work even, its just embeded in society right now. I would confuse this in 3D viewport all the time. 2. I like shortcuts for dragging and pinning, but looking at it it looks like you can't change it, design doesn't tell you about that ability, because it looks like cached data. I would add brackets at the end and start of past/future, so that it communicates with user the ability, and if its draggable by mouse its just perfect design in my opinion. 3. I think design should be unified with Grease Pencil somehow, drawing in the timeline, shortcuts, pinning and colours should be same for consistency. 4. I think dashes should always merge, so that its easier to see. Just red lines below frame numbers looks more like an error message.
Author
Member
  1. yes colors would be in user prefs and which colors to chose is not fixed, I am totally open to changing it
  2. The issue with brackets is that they only communicate a range up to a certain frame. However ghosts can be on e.g. 2, 4, 6 frames away from the cursor. That's why I went with dashes. But I agree that ideally it would be draggable by mouse somehow. The shortcut is a bit hidden
  3. yes totally agreed
  4. Not sure about always merging the dashes. There needs to be a way to communicate where the ghost starts and ends
1. yes colors would be in user prefs and which colors to chose is not fixed, I am totally open to changing it 2. The issue with brackets is that they only communicate a range up to a certain frame. However ghosts can be on e.g. 2, 4, 6 frames away from the cursor. That's why I went with dashes. But I agree that ideally it would be draggable by mouse somehow. The shortcut is a bit hidden 3. yes totally agreed 4. Not sure about always merging the dashes. There needs to be a way to communicate where the ghost starts and ends
Contributor

If dashes can't be merged by default then they need to be longer I think, so that they're easier to see, especially when you're zoomed in. Right now they're too short and leave too much negative space around them. Something like this

image

If dashes can't be merged by default then they need to be longer I think, so that they're easier to see, especially when you're zoomed in. Right now they're too short and leave too much negative space around them. Something like this ![image](/attachments/c9d6e61e-9f76-4181-aa4d-fd58b524db47)
Author
Member

yeah why not, the dash can fill the whole space of its frame as long as there is room for it

yeah why not, the dash can fill the whole space of its frame as long as there is room for it
Member

Can the dashes use the new GP "frame can have a length option? image

Can the dashes use the new GP "frame can have a length option? ![image](/attachments/8c35382d-648a-43c5-a7ea-325b2b5bd0a8)
Author
Member

hmm I don't see how I could make that work between 3D and GP
because my idea was that you specify on the scene which frames are ghosted, and the frame might hold GP and regular keyframe data or none at all

hmm I don't see how I could make that work between 3D and GP because my idea was that you specify on the scene which frames are ghosted, and the frame might hold GP and regular keyframe data or none at all
Member

I'll keep an eye on this, seems interesting.

I'll keep an eye on this, seems interesting.
Sign in to join this conversation.
No Label
Interest
Alembic
Interest
Animation & Rigging
Interest
Asset Browser
Interest
Asset Browser Project Overview
Interest
Audio
Interest
Automated Testing
Interest
Blender Asset Bundle
Interest
BlendFile
Interest
Collada
Interest
Compatibility
Interest
Compositing
Interest
Core
Interest
Cycles
Interest
Dependency Graph
Interest
Development Management
Interest
EEVEE
Interest
EEVEE & Viewport
Interest
Freestyle
Interest
Geometry Nodes
Interest
Grease Pencil
Interest
ID Management
Interest
Images & Movies
Interest
Import Export
Interest
Line Art
Interest
Masking
Interest
Metal
Interest
Modeling
Interest
Modifiers
Interest
Motion Tracking
Interest
Nodes & Physics
Interest
OpenGL
Interest
Overlay
Interest
Overrides
Interest
Performance
Interest
Physics
Interest
Pipeline, Assets & IO
Interest
Platforms, Builds & Tests
Interest
Python API
Interest
Render & Cycles
Interest
Render Pipeline
Interest
Sculpt, Paint & Texture
Interest
Text Editor
Interest
Translations
Interest
Triaging
Interest
Undo
Interest
USD
Interest
User Interface
Interest
UV Editing
Interest
VFX & Video
Interest
Video Sequencer
Interest
Virtual Reality
Interest
Vulkan
Interest
Wayland
Interest
Workbench
Interest: X11
Legacy
Blender 2.8 Project
Legacy
Milestone 1: Basic, Local Asset Browser
Legacy
OpenGL Error
Meta
Good First Issue
Meta
Papercut
Meta
Retrospective
Meta
Security
Module
Animation & Rigging
Module
Core
Module
Development Management
Module
EEVEE & Viewport
Module
Grease Pencil
Module
Modeling
Module
Nodes & Physics
Module
Pipeline, Assets & IO
Module
Platforms, Builds & Tests
Module
Python API
Module
Render & Cycles
Module
Sculpt, Paint & Texture
Module
Triaging
Module
User Interface
Module
VFX & Video
Platform
FreeBSD
Platform
Linux
Platform
macOS
Platform
Windows
Priority
High
Priority
Low
Priority
Normal
Priority
Unbreak Now!
Status
Archived
Status
Confirmed
Status
Duplicate
Status
Needs Info from Developers
Status
Needs Information from User
Status
Needs Triage
Status
Resolved
Type
Bug
Type
Design
Type
Known Issue
Type
Patch
Type
Report
Type
To Do
No Milestone
No project
No Assignees
9 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: blender/blender#102217
No description provided.