HISE Logo Forum
    • Categories
    • Register
    • Login

    Expandable GUI

    Scheduled Pinned Locked Moved General Questions
    76 Posts 19 Posters 5.7k Views
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • d.healeyD
      d.healey @Matt_SF
      last edited by

      @Matt_SF said in Expandable GUI:

      There's already an example in the snippet browser :

      Oh that guy works fast!

      Libre Wave - Freedom respecting instruments and effects
      My Patreon - HISE tutorials
      YouTube Channel - Public HISE tutorials

      1 Reply Last reply Reply Quote 1
      • A
        ally @clevername27
        last edited by

        @clevername27 I don't think you're considering the use cases where this can be highly relevant and actually improves UX in a given UI and actually goes with what you're saying (less is better).

        Here's an example the advanced view GUI. Screen Shot 2024-08-07 at 1.08.39 PM.png

        Here's that same view but after user clicks the settings icon at the top right,
        Screen Shot 2024-08-07 at 1.10.02 PM.png

        The expanding interface here lets you, in most use cases, to NOT see those controls. Which goes with what you're saying, in that its good practice not to flood users with 100s of options at once.

        But when a user does need to access these global controls in this example, they aren't losing their place in the synth and they aren't going to need to tab back and forth if multiple edits are needed in the settings.

        Compare this with Serum . The settings pages takes away the ability to edit the oscillators, the filters, and most of the synth's parameters.
        Screen Shot 2024-08-07 at 1.15.25 PM.png
        Screen Shot 2024-08-07 at 1.15.31 PM.png

        So what's a better user experience? To make the user completely leave the page they are on and have to tab back and forth or have an expanded view with the controls that need to be accessed when the user needs them? I think you can make arguments for both, but the ladder is growing in popularity.

        Another interesting use case I saw of this is with a emulated compressor. The main GUI has the controls you would see on the physical counterpart, the expanded GUI keeps those in place but introduces new controls with more modern features as well as some experimental features. I think that's an excellent use of an expanding interface.

        d.healeyD clevername27C 2 Replies Last reply Reply Quote 1
        • d.healeyD
          d.healey @ally
          last edited by

          @ally said in Expandable GUI:

          So what's a better user experience? To make the user completely leave the page they are on and have to tab back and forth or have an expanded view with the controls that need to be accessed when the user needs them?

          I'd say there is no single answer for all cases.

          If the user needs to be able to access the settings and still be able to tweak, then perhaps those settings should be part of the interface and not tucked away somewhere else.

          If they don't need to be able to do both at once then it doesn't matter if they are taken away.

          Another option is to have a popup or modal window. Depending on the specifics this can either take the user away from the rest of the UI or it can take up some other part of the UI they don't need access to while changing the settings.

          I agree with @clevername27 that it's not nice to get a surprise of your window no longer fitting on the screen, so it's important with an expanding UI that the user is very clear on what is going to happen when they press the button.

          I like expanding UI as an option, but generally I'd explore other options first and use the one that is most suitable. I think I'll be using the expanding UI (as I think I mentioned earlier in this thread) for showing/hiding the on screen keyboard. In this case the user won't be surprised by the UI getting larger, as it will only make the UI smaller than the default.

          I might also use it to display a macro panel, because in this case the user needs to be able to see both the macro assignments and settings, and the controls on the UI that they are assigning those macros to.

          Libre Wave - Freedom respecting instruments and effects
          My Patreon - HISE tutorials
          YouTube Channel - Public HISE tutorials

          A 1 Reply Last reply Reply Quote 1
          • A
            ally @d.healey
            last edited by

            @d-healey I think keyboard opening and closing is a great use of this feature! It's a feature lot of synths have, and have had for years. Serum is about 10 years old. And it's done this since the beginning.

            I know performers who use VSTs in their live sets appreciate show hide that expands and contracts GUI sizes. For example, Omnisphere can close the presets browser view on the left allowing for the user to magnify the GUI for their live set. Obviously you don't need a robust preset browser while playing out live in a soft synth.

            Omnisphere standard view
            Screen Shot 2024-08-07 at 2.48.27 PM.png

            Omnisphere collapsed
            Screen Shot 2024-08-07 at 2.48.35 PM.png

            @clevername27 said in Expandable GUI:

            There are also practical concerns. Most people use laptops. Screen real estate is at a premium. Whenever a plugin is open, it will initially be obscuring some part of their DAW. And the last thing anyone wants is for a plugin to suddenly take up even more space. They may have carefully placed your plugin window so it's not stepping on anything — but if it suddenly gets bigger, all bets are off. When your interface expands, it may not even be on the screen.

            But lot of synths use this feature to ultimately reduce screen size.

            @clevername27 said in Expandable GUI:

            Complex interfaces can also affect your sales. Prospective customers may think the plugin with lots of controls, expandable panels and such — is cool. But it's also overwhelming.

            A lot of synths use hide/show and expand/contract to make things less complex. Serum does this, I doubt it hurt sales! Keyboard open is 2048x1656 Screen Shot 2024-08-07 at 1.15.25 PM.png

            keyboard closed is 2048x1456. Screen Shot 2024-08-07 at 2.09.20 PM.png

            @d-healey said in Expandable GUI:

            I might also use it to display a macro panel, because in this case the user needs to be able to see both the macro assignments and settings, and the controls on the UI that they are assigning those macros to.

            Not sure if you're familiar with this vst, but Spire allows users to show/hide macros. It's a nice feature!
            Screen Shot 2024-08-07 at 2.38.26 PM.png

            macro closed view
            Screen Shot 2024-08-07 at 2.38.39 PM.png

            All that to say, I see why so many users here have wanted this feature! At the end of the day, developers who care about UX and UI will use this update to make better GUI's and smoother experiences for their customers using their products. To assume, as some have in this thread, that it will only lead to poor design and UX is short sighted to some degree IMO.

            DanHD 1 Reply Last reply Reply Quote 1
            • clevername27C
              clevername27 @DanH
              last edited by

              @DanH Thanks, Dan.

              1 Reply Last reply Reply Quote 0
              • clevername27C
                clevername27 @ally
                last edited by clevername27

                @ally @ally @d-healey Thank you all for sharing your thoughts, and taking the time to illustrate with screenshots. An interesting discussion, and cheers.

                1 Reply Last reply Reply Quote 1
                • orangeO
                  orange @d.healey
                  last edited by

                  Thank you! @Christoph-Hart 🎉🚀

                  @d-healey said in Expandable GUI:

                  47866f74-1928-447b-bf42-df23a944dabc-image.png

                  develop Branch / XCode 13.1
                  macOS Monterey / M1 Max

                  1 Reply Last reply Reply Quote 0
                  • DanHD
                    DanH @ally
                    last edited by DanH

                    @ally who's suggested this will lead to poor UI design? 😆

                    DHPlugins / DC Breaks | Artist / Producer / DJ / Developer
                    https://dhplugins.com/ | https://dcbreaks.com/
                    London, UK

                    A 1 Reply Last reply Reply Quote 0
                    • ulrikU
                      ulrik @d.healey
                      last edited by

                      @d-healey said in Expandable GUI:

                      You da man!

                      47866f74-1928-447b-bf42-df23a944dabc-image.png

                      Indeed @Christoph-Hart is!!, thanks!

                      Hise Develop branch
                      MacOs 15.3.1, Xcode 16.2
                      http://musikboden.se

                      A 1 Reply Last reply Reply Quote 0
                      • A
                        ally @DanH
                        last edited by

                        @DanH

                        @clevername27 said in Expandable GUI:

                        @Fortune My hot take is that @Christoph-Hart shouldn't do it.An interface that changes size is poor design. You should never require so many on-screen widgets as to require the expansion of the interface. Think contextually.

                        DanHD 1 Reply Last reply Reply Quote 1
                        • DanHD
                          DanH @ally
                          last edited by

                          @ally That's a HOT take!! @clevername27 😆 :police_car_light:

                          DHPlugins / DC Breaks | Artist / Producer / DJ / Developer
                          https://dhplugins.com/ | https://dcbreaks.com/
                          London, UK

                          clevername27C 1 Reply Last reply Reply Quote 1
                          • clevername27C
                            clevername27 @DanH
                            last edited by

                            @DanH 🤣

                            1 Reply Last reply Reply Quote 0
                            • A
                              aaronventure @ulrik
                              last edited by

                              @ulrik So the implementation is dead simple: create a broadcaster with width and height as arguments, then call Content.makeFrontInterface whenever you want to change the interface size.

                              Minor epilepsy warning in Reaper, though: when you size it down, the area delta flashes white for a few frames. I guess this is DAW-specific. I'd still be wary of using this for standard panel switching if the user has to endure flashing every time they switch the panels.

                              d.healeyD ? 2 Replies Last reply Reply Quote 3
                              • d.healeyD
                                d.healey @aaronventure
                                last edited by

                                @aaronventure You can use Content.setHeight() and Content.setWidth() - perhaps that will avoid the flashing issue?

                                I'm just looking at the example snippet from Christoph for this.

                                Libre Wave - Freedom respecting instruments and effects
                                My Patreon - HISE tutorials
                                YouTube Channel - Public HISE tutorials

                                A 1 Reply Last reply Reply Quote 1
                                • A
                                  aaronventure @d.healey
                                  last edited by

                                  @d-healey I think it's Reaper's GUI framework from last century. In Reaper, the plugin GUI floats inside the plugin window (you can drag and scale the window beyond the plugin's range, and the plugin won't rescale, you'll just get the creamy white Reaper GUI canvas... you can also scale it down to hide the plugin window), so when the interface size changes, it takes a few frames for it to adjust its canvas to the new interface size.

                                  1 Reply Last reply Reply Quote 1
                                  • DabDabD
                                    DabDab
                                    last edited by

                                    Where is the Expandable GUI Example ? Any Snippet Please .

                                    Bollywood Music Producer and Trance Producer.

                                    d.healeyD DabDabD 2 Replies Last reply Reply Quote 1
                                    • d.healeyD
                                      d.healey @DabDab
                                      last edited by

                                      @DabDab snippet browser in HISE

                                      Libre Wave - Freedom respecting instruments and effects
                                      My Patreon - HISE tutorials
                                      YouTube Channel - Public HISE tutorials

                                      1 Reply Last reply Reply Quote 2
                                      • ?
                                        A Former User @aaronventure
                                        last edited by A Former User

                                        @aaronventure said in Expandable GUI:

                                        @ulrik So the implementation is dead simple: create a broadcaster with width and height as arguments, then call Content.makeFrontInterface whenever you want to change the interface size.

                                        Minor epilepsy warning in Reaper, though: when you size it down, the area delta flashes white for a few frames. I guess this is DAW-specific. I'd still be wary of using this for standard panel switching if the user has to endure flashing every time they switch the panels.

                                        @aaronventure So this is not working properly in Reaper, right? Have you also tried on the other DAWs too?

                                        @Christoph-Hart Any ideas?

                                        A 1 Reply Last reply Reply Quote 0
                                        • A
                                          aaronventure @A Former User
                                          last edited by

                                          @harris-rosendahl It's working properly, it's just Reaper. Read my previous message.

                                          1 Reply Last reply Reply Quote 0
                                          • d.healeyD
                                            d.healey
                                            last edited by

                                            I'm not seeing any issue here in Reaper (on Windows)

                                            Peek 2024-08-21 14-55.gif

                                            Libre Wave - Freedom respecting instruments and effects
                                            My Patreon - HISE tutorials
                                            YouTube Channel - Public HISE tutorials

                                            1 Reply Last reply Reply Quote 1
                                            • First post
                                              Last post

                                            14

                                            Online

                                            1.7k

                                            Users

                                            11.8k

                                            Topics

                                            103.2k

                                            Posts