Arc animation effect with CGAffineTransform / GeometryEffect in SwiftUI

How can I make the following animation move in a more circular/arc way?

What I need is to be able to animate the red circle in an arc shape, where it goes up and then down forming a curve/arc. Right now the animation looks almost linear with just a little bit of curve, and it doesn't look smooth.

    import SwiftUI

    struct GeometryEffectTesting: View {
        @State private var isOn: Bool = false

        var body: some View {
            VStack{
                ZStack{
                    Image(systemName: "circle.fill")
                        .font(.title)
                        .foregroundColor(.orange)
                        .animation(.easeOut(duration: 0.3), value: isOn)
                    
                    Image(systemName: "circle.fill")
                        .font(.title2)
                        .foregroundColor(.red)
                        .modifier(SpecialEffect(isAnimating: isOn))
                        .animation(.easeOut(duration: 0.3), value: isOn)
                        .onTapGesture {
                            self.isOn.toggle()
                        }
                }
            }
            .padding()
        }
    }
    struct SpecialEffect: GeometryEffect{
        private var percentage : CGFloat
        private var isAnimating : Bool


        init(isAnimating: Bool){
            self.percentage = isAnimating ? 1 : 0
            self.isAnimating = isAnimating
        }

        var animatableData: CGFloat{
            get{return percentage}
            set{percentage = newValue}
        }

        func effectValue(size: CGSize) -> ProjectionTransform {
            let transform: CGAffineTransform
            if isAnimating{
                transform = Self.transform(forPercent: percentage)
            }else{
                transform = Self.transform(forPercent: 0)
            }
            return ProjectionTransform(transform)
        }
        
        static func transform(forPercent percent: CGFloat) -> CGAffineTransform {
            let xPos: CGFloat = 50
            let yPos: CGFloat = 50
            let transform: CGAffineTransform
            
            if percent == 0{
                transform = .init(translationX: 0, y: 0)
                return transform
            }else{
                if percent < 0.25 {
                    transform = .init(translationX: percent * xPos, y: -percent * yPos)
                } else if percent < 0.5 {
                    transform = .init(translationX: (percent * xPos) * 2, y: -(percent * yPos) * 2)
                } else if percent < 0.75 {
                    transform = .init(translationX: (percent * xPos) * 3, y: -(percent * yPos) * 2)
                } else {
                    transform = .init(translationX: (percent * xPos) * 4, y: -(percent * yPos) * 2)
                }
                return transform
            }
        }
    }