While scripting plugins is a hot topic on QSC Communities, as it offers a gateway to new solutions for the Q-SYS Ecosystem, the ability to wrap an ingenious design with an intuitive, functional, and sleek User Control Interface is a skill on its own.
There are inherent benefits to a customized UCI design to represent the spatial dimension of the room(s), including a more intuitive user experience and a professional appearance.
Today we would like to look at the great work that Emily has shared with us in hopes to learn more about the techniques used, but also about her favorite tools and design pipelines to get the job done, whether the design is a 3D rendered room or a sleek 2D panel interface.
Rather than just showcasing her work, Emily shared with us her best practices to create appealing UCI designs for the Q-SYS Ecosystem that we hope will give you some inspiration for your future designs.
AA: Hi Emily, first, thank you for joining QSC Communities early on and helping us seed great content for the launch of the platform. Can you introduce yourself briefly?
EE: It’s great to be here! I’m a programmer and applications engineer for Root Integrated Systems in Cleveland, OH. I’m originally from Michigan. I went to school at the University of Michigan and have a Bachelor’s Degree in Performing Arts Technology.
AA: As you know, many of us liked the post you shared about 3D room UCI designs. We are interested in learning about the creative pipeline and process that you used to create the final design. First, what motivates you to use 3D room renders for a specific project? Is it usually a request from the customer or just something that the type of project will dictate?
EE: I have the pleasure of working with some extremely talented people. Simone DiFranco, one of our resident 3D rendering and CAD experts, makes 3D models for some of our customers to be able to take a virtual tour of their site. In the case of this UCI, we wanted to have something that the customer would find intuitive while also being visual striking to visitors; the space is an innovation center that will be visited both virtually and in-person. Simone had already created renderings for the project, and I was able to work with him to tweak the layers, angle, etc. to highlight the audio-visual functionality of the room. The purpose of the room really drove how I started the design. I wanted them to have something super cool, but also functional.
AA: Do you have any general advice for how you approach the organization of your UCI layouts?
EE: I try to think about a flow for how the user will approach the UCI. What will they see first? Where will their eyes be drawn? What happens next? These are the questions I try to answer, and it always helps to have multiple people to show the work to during the design process. As many Designers/Developers know, the more you look at something, the more numb you can become, so I try to combat that by asking people to start pressing buttons as early as possible in the design. I’ll watch to see where their finger goes or what steps they take to accomplish a task. This also helps with finding bugs. You might press something in a certain order over and over and not realize there is a bug until someone else comes up and tries it a different way.
AA: What program do you use to design your 3D models?
EE: We use Revit to design the 3D models. For the UCI I posted, I used Adobe Illustrator to map out where I wanted the user to press and then exported the regions as transparent PNGs, assigned them to buttons, then lined them up on the UCI, over the 3D model. There are different ways you can do this, but with the precision I was going for, I felt this was the most efficient method.
AA: Do you have a lot of experience with 3D modeling, or is something you picked up specifically to improve UCIs?
EE: I took some courses in college, but I rely on our team for their skills and talents. It is definitely a collaborative effort.
AA: How long have you been working with 3D modeling, and how did you get started learning it?
EE: Our company has been making models for customers for at least a couple of years.
AA: Any tips for others who might be thinking about trying these tools out?
EE: Always make sure that you play with hiding parts of the model, so you are seeing the exact elements that you want to see in your design. Simone and I took a good amount of time removing certain elements, like the ceiling, parts of the walls, display mounts, etc. If your UCI isn’t clean, no one is going to want to use it.
AA: As you design the Q-SYS file, do you have the end UCI in mind the whole time, or is the UCI something you add once the system is complete?
EE: I usually start by programming all my main elements. For instance, I knew I would need a matrix switcher, so I started by programming that and then once I had that written in code, I was able to assign my buttons and make things work exactly how I wanted them to. I then go back and add code to make things look and feel right, as needed. I have, in the past, used tools like Adobe XD to build a UI, let the customer play around with it and sign off on it, and then built everything in Designer. For this project I knew I had a lot of code to write so I built most of that first and then the idea for the UCI came as I was writing code.
AA: What drew you into Communities and how do you think it complements the other existing Q-SYS social groups out there like Reddit or Facebook?
EE: I feel like Communities is going to make me more efficient as a programmer and allow me to get some feedback on things I’m working on. The ability to share work with other people and to check out what others have done is huge. You don’t know what you don’t know, so it’s really a great tool.
I’m not on Facebook so I was always hearing about people posting things on Facebook and I wouldn’t have access, so that wasn’t great. I am on Reddit and people seldom post on there and I would try to answer questions and such. I will now point people to Communities going forward.
AA: What are your hopes for the evolution of Communities? Anything that you are hoping to see on it soon?
EE: I’m really excited to see the resources library grow and to continue to learn from other Developers. I look forward to seeing it evolve as more users join.
AA: Thank you, Emily! Looking forward to looking at more of your creations! Outside of Communities, where can fellow Q-SYS designers contact you for work? And do you have social media accounts that peers can follow you on?