By the way, the Samsung gallery has a nice video editor with a timeline built in.
Designing a Timeline for Mobile Video Editing
11–16 of 16 posts
Re: Designing a Timeline for Mobile Video Editing
#12I’m curious why they chose SwiftUI. In my experience, this kind of highly responsive editor UIs are best implemented using immediate mode GUI techniques. A declarative layer like SwiftUI or React is often a hindrance. The article alludes to these issues: ”All these gestures must behave as expected and not interfere with each other. We found it unexpectedly difficult to fine-tune and harmonize these interactions with…
Hi! I wrote the article.
Excellent question! You are right, we definitely did not choose to implement it in SwiftUI because it’s easier than it would have been with UIKit.
Our main concern was to build a future-proof solution for our SDK customers. Apple has repeatedly made clear that they consider SwiftUI the future of UI development for their platforms.
Even though we were not able to implement the whole timeline experience without falling back to UIKit techniques, we think the result was worth the extra effort. For example, it is very flexible in terms of appearance and theming, including sizes, colors, animations, and behavior.
Re: Designing a Timeline for Mobile Video Editing
#13The phone form factor is yelling something at us and UX designers just can’t hear it. Hint: We don’t spend our days scrolling horizontally
Valid point! I agree in general. For timelines though, I believe that most people expect timeline user interfaces to be horizontal. Vertical scrolling may be more comfortable, but it clashes with existing mental models for video editing.
You’re right, it may be worth exploring a vertical timeline though, especially for more experimental video editing concepts! It would definitely be possible to implement with the IMG.LY SDK.
Re: Designing a Timeline for Mobile Video Editing
#14Overall, I love it! I tried to import an MP3 from OneDrive into the video editor; it showed that it imported, but on playback, there was no sound. However, I could clearly hear the sound in the import preview window. Then, I tried replacing it with a sound already included, and then replacing it back with my MP3 to see if that would work, but the app crashed.
Thanks for sharing! We will have a look and try to reproduce the issue you’re seeing.
Re: Designing a Timeline for Mobile Video Editing
#15I have not used this video editor. Are there specific UI innovations over other mobile videos editors like CapCut?
Great question! The most important difference is probably that this is an SDK, which means that it can be built into all kinds of apps by other companies that want to offer video functionality.
There is a demo app on the iOS app store, check out the link in the article if you want to give it a spin!
Re: Designing a Timeline for Mobile Video Editing
#16Quick Questions out of curiosity: What ideas have been rejected during the design process?
There were a ton of different design variations! The differences were mostly in the details. The main requirement was to build a video editor that does everything that a video editor does, but as well as possible. And because this editor is designed to work within third-party apps that license the SDK, we wanted it to be well-designed but neutral, as easy to use as possible.
One example of a rejected idea: We had played around with the idea of collapsing and expanding the clips when you scroll vertically in the timeline, like an accordion, but it turned out that traditional vertical iOS-native scrolling felt better.