HRI Touchscreen

Harte Research Institute

Harte Research Institute (HRI) is dedicated to advancing the long-term sustainable use and conservation of the Gulf of Mexico. Its vision for an ecologically and economically sustainable Gulf is one passionately shared by senior leadership, research staff, and students alike.

Mandate

While building a brand new Drupal site for Harte Research Institute for Gulf of Mexico Studies we discovered they had a large touchscreen display that wasn’t living up to its full potential. We realized we could create an additional frontend, using both Drupal and React to make the most of their website and their touchscreen too. The project goals were to create a friendly, inviting, and intuitive interface that people would enjoy using. The touchscreen also needed to be easy to update for administrators, without any dev involvement.

Idea

Once we knew we could create the interactivity we wanted, we focused on building the structure to support it. The best part? This information already existed in the Drupal backend. The very same staff content you see on the People landing page of the Harte site would be the same content delivered to the touchscreen. Not only had we eliminated a redundant database, we had streamlined the editing experience. Because everything runs on Drupal, any content editor need only update in one location to push to two.

Drupal is great for storing data, but it’s not the best choice for displaying it, especially in a instant-load environment like a touch-responsive screen. For this, we would need to go outside of Drupal, we needed the display power of React. The plan: we would retain the Drupal frontend for the website, and pull in React to load the touchscreen content.

Result

When you walk in the lobby at Harte Research Institute for Gulf of Mexico Studies, the touchscreen offers a simple, interactive way to find an office, locate a campus building, or see details of any upcoming events in the space. All of the features are aesthetically appealing and instantly familiar, inviting the user in.

All landing pages, are fully scrollable, by simply dragging your finger up or down the screen as you would on your mobile device. Much of what is available on the site has been pared down, removing clutter to make finding information quick and painless.

Creating the touch screen not only let us learn how to bring an entirely new interface to decoupled Drupal, it also let us create a unique and useful interface to help our clients in a super specific way. Nothing makes us happier at amazee than when we can make our clients happy while learning something new.
Amazee previously designed our well-received website and built out our large touch screen directory on that platform. It syncs with the employee profiles we already have on our website, allowing visitors to quickly find someone they might be looking for.
Nikki Buskey, Communications Manager, Harte Research Institute for Gulf of Mexico Studies at Texas A&M University Corpus Christi