Theater Management Console
As part of my senior design project in 2016, I designed an administrative console to be used to manage the website's content. For more information on this project's parent project, read the section on TicketAngel.
Work on the administration console (which we soon dubbed the Theater Management Console) began shortly after the primary website. As with TicketAngel, I spent much of my time designing the console's user experience, and implementing the views in HTML.
After reading through and digesting the project's requirements, I opened up Adobe Illustrator and created an initial concept for the design. The first draft had a very similar look and feel to the original website, as a way to provide a consistent look and feel between both the website and control panel.
The next few weeks were devoted to working on the main website. During that time, I considered the management console design and discussed it with the rest of the project's team. From that oiint, I decided to try a few alternative designs which had a different look and feel from the rest of the site. While this offered less consistency, that can often be a good thing when conveying to users that they are in an entirely different section of the website.
Over the next few days, I prepared a few other design mockups for the management console.
The final result was a hybrid layout between the two alternatives seen above. I removed the sidebar and replaced it with a tab bar at the top of the console, which had a much cleaner feel in my opinion, and also allowed for a smaller set of options for the user to choose from. Instead of presenting all of the advanced settings at the top level with a sidebar, I moved them underneath a "Theater Setup" tab.
Below is the GUI that allows theater cashiers to look up tickets based off a ticketholder's name or ticket number.
Below is the GUI that allows the theater administrator to manage their theater's settings on the website. In particular, the section shows lets them edit the names, prices, and parameters of the seats, rows, and sections of their theater.
The source code for the Theater Management Console is available online via Github, along with the rest of the source for the TicketAngel project. You can also view a live demo of the TicketAngel website by visiting this link.